您的位置：首页 > 其它

ECMAScript6

2016-06-25 23:12 197 查看 
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
div{
display: none;
}
.show{
display: block;
}
.active{
background-color: yellow;
}
</style>
</head>
<body>
<input type="button" value="tab1" class="active">
<input type="button" value="tab2">
<input type="button" value="tab3">
<div class="show">div1</div>
<div>div2</div>
<div>div3</div>
<script type="text/javascript">
"use strict"
//1-变量
/*
let特性：
1、不允许重复声明
2、没有预解析。
3、块级作用域

一对{}包括的区域称为代码块
块级作用域指一个变量或者函数只在该区域才起作用。

从块的开始到声明这段的区域 暂存死区

*/
// console.log(a);
// var a = 1;
// // var a = 3;
// // let b = 2;
// console.log(b);
// let b = 3;

// {

// 	let a = 1;

// }
// console.log(a);

// for(var i=0;i<10;i++){
// 	(function(i){
// 		setTimeout(function(){
// 			console.log(i);
// 		})
// 	})(i)
// }
// for(let i=0;i<10;i++){
// 	setTimeout(function(){
// 			console.log(i);
// 		})
// }
var tabs = document.getElementsByTagName('input');
var divs = document.getElementsByTagName('div');

for(let i=0;i<tabs.length;i++){

tabs[i].onclick = function(){
for(var j=0;j<tabs.length;j++){
divs[j].className = '';
tabs[j].className = '';
}
this.className = 'active';
divs[i].className = 'show';
}
}
//2-const
/*
在定义之后值是固定不变的，即为常量

常量的值不能修改，但是如果常量保存的是一个对象，那么对象的属性是可以被修改的。

*/
// const a = 1;

// // a = 2;
// console.log(a);

const a = {
name:'leo'
};
a.name = 'momo';
console.log(a.name);
/*
解构赋值：
ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。

数组的解构赋值：
按照对应的顺序解构。

*/
// var arr = [1,[2,3]];
// var [a,[b,c]] = arr;

// console.log(a,b,c);
// var obj = {
// 	foo:function(){

// 	},
// 	o:{

// 	},
// 	arr:[],
// 	str:'abc'
// }
// var {foo,arr,str,o} = obj;
// console.log(foo,arr,str,o);

// function fn(){

// 	return {}
// }
//3-解构赋值
var y = 1;
var x = 2;

var [x,y] = [y,x];

console.log(x,y);

//4-字符串扩展
//var s = 'miaov';
//var s = '
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航