【ES6】es6新特性

一、变量
1.1let
var：只有全局作用域和函数作用域，全局作用域就是在任何位置都能访问var声明的全局变量

函数作用域，变量声明在函数内容，而函数外部无法访问函数内容的变量

let特点：

1.变量不能重复声明

2.块级作用域，只在代码块中执行

3.不存在变量提升

4.let声明变量具有暂时性死区，不影响作用域链

es6规定，在区块中使用let一旦声明就形成封闭作用域，凡是在声明之前使用这些变量就会报错，这就是死区

块级作用域：点击修改颜色的时候，进行实现的是for循环，使用var的时候是全局的也不是代码块的内容，而使用let则是定义了一部分代码块的内容items[i]，可以使用


<script>//使用var的时候，通常是保存i的值或者是保存this的值var items = document.querySelectorAll(".item");for(var i=0;i<items.length;i++){items[i].index =i;items[i].onclick=function (){console.log(this.index)}}//块级作用域let=0时是一块，let=1时是一块，以此类推并不会造成一些相互的影响let items = document.querySelectorAll(".item")//循环添加点击事件for(let i =0;i<items.length;i++){items[i].onclick = function (){//若使用var//this.style.background ="pink"items[i].style.background ="pink"}}
</script>

var	let	const
只有全局作用域和函数作用域	有块级作用域	有块级作用域
存在变量提升	不存在变量提升	不存在变量提升
可以重复声明	不能重复声明	不能重复声明
没有死区	存在暂时性死区	存在暂时性死区
可以先声明后赋值	可以先声明后赋值	声明即赋值声明常量

1.一定要赋初值

2.一般常量使用大写

3.常量值不能修改

4.块级作用域

5.对于数组和对象元素修改，不算对常量的修改，不会报错

二、变量的解构赋值
ES6中，允许按照一定模式从数组和对象中提取值，对变量进行赋值，这被称为解构赋值


<script>//数组的解构赋值let [a,b,c] = [1,2,[1,2]];//定义变量abc，分别对其进行解构赋值，如果想忽略数组的某个元素对变量进行赋值，可以使用逗号处理let [a,,c] = [1,2,[1,2]];//rest参数//使用rest参数来接受赋值数组的剩余元素，要确保这个rest参数放在赋值变量的最后一个位置，变量前面必须要有三个点，变量名随意let [name1,name2,...rest] = ["Julius", "Caesar", "Consul", "of the Roman Republic"];//字符串的解构let user = {name: "york",age: 18} let {age, name} = user;//字符串的解构赋值let str = "byesame";for(var i=0;i<str.length;i++){console.log(str[i])}let [a, b, c, d, e, f, g] = str;console.log(a, b, c, d, e, f, g)//对象的解构赋值let {name1:a,age:b}={name:100,age:200}//对name，age进行重命名操作console.log(name1,age);//报错,原因就是name和age被重新命名了，新的名字为a，bconsole.log(a,b);//100,200let user ={name:"zhangsan",age:22,child:{group1:{one:111,two:222},group2:{one:333two:444}},arr:[10,20,30]}//完全解构let { name, age, child: { group1: { one, two }, group2: { one: one1, two: two2 } }, arr: [a, b, c] } = user;console.log(name, age, one, two, one1, two2, a, b, c);</script>

【ES6】es6新特性相关推荐

ES6常用新特性---笔记一
ES6的新特性 1.定义函数不一定需要function 2.创建类,constructor 3.模块,JavaScript支持了原生的module,将不同的代码分别写在不同的文件,最后只需export ...
ES6一些新特性记录
ES6一些新特性记录 1.箭头操作符箭头操作符左边是需要输入的参数,右边是返回值比如运用到js回调函数中可以使书写更加方便 var array=[1,3,5]; //标准写法 array.fore ...
ES6 的新特性总结
ES6 的新特性总结关于声明变量由 var 变成 let 和 const 区别: var声明的变量会挂载到window上,let和const声明的变量不会 var声明的变量存在变量提升,而let和 ...
ES6 — ES11 新特性一篇通
一.ES6 1.1.let 变量不能重复声明有块级作用域不存在变量提升(必须先声明后使用) 不影响作用域链 <script>//声明变量let a;let b, c, d;let e ...
ES6~ES12新特性
ES6新特性 let属性 <div class="item">记得刷卡</div> <script type="text/javascrip ...
es5和es6的区别、以及es6的新特性
es5和es6的区别系统库的引入 es5:ES5中的引用需要先使用require导入React包,成为对象,再去进行真正引用 es6:ES6里,可以使用import方法来直接实现系统库引用,不需要额 ...
html5语义化边框,Html5、Css3、ES6的新特性
html5的新特性 1.语义化标签有利于seo,有助于爬虫抓取更多的有效信息,爬虫是依赖于标签来确定上下文和各个关键字的权重. 语义化的html在没有css的情况下也能呈现较好的内容结构与代码结构方 ...
ES6/ES7新特性
ES6 一.let const let 声明的变量只在代码块内有效 for循环的计数器适合用let命令不存在变量提升.–即var变量在声明之前就能使用,值为undefine.let不允许暂时性死区 ...
ES6的新特性----Vue学习必备基础知识
学习Vue之前,ES6的基础常识是必须要了解的,下面列举了几种最重要的特性,学会了这些,Vue的学习就易如反掌了. 1.变量声明const和let 在ES6之前,我们都是用var关键字声明变量.var ...
ES6的新特性（8）——数组的扩展
数组的扩展扩展运算符含义扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列. console.log(...[1, 2, 3]) / ...

【ES6】es6新特性

【ES6】es6新特性相关推荐

最新文章

热门文章