es6
es6是ECMAScript的第六次修订,于2015年完成,也叫ES2015。
特点:语法上更加简洁,提高开发效率。
(当要求动态上下文的时候就不能够用箭头函数)
特点:
1、箭头函数中,this的指向是定义时所在的作用域对象,而非运行时;
2、不能够用作构造函数,即不能使用new命令;
2、不能够用arguments对象;
3、不能使用yield命令;
附:超时调用的代码都是在全局作用域中执行的,即setTimeOut中的this指向window,但是使用箭头函数可以改变this的指向.
二、var 、let 、const区别
var 有变量提升、没有块级作用域
let和const没有变量提升,一定要先声明再使用,有块级作用域,
let定义变量;const定义常量;
const定义后,不能修改其指向的目标,若是对象、数组,可以修改里面的属性值。我们可以在引用第三方库的时,把需要声明的变量,用const来声明,这样可以避免未来不小心重命名而导致出现bug .
const xxx = require(‘xxxxx‘);
var oLi=document.querySelectorAll(‘li‘) var arr=[]; for(var i=0;i<oLi.length;i++){ oLi[i].onClick(function(index){ console.log(index) //打印出来的是3 }); } , //var定义的i为全局变量,每循环一次,新值都会覆盖旧值 //let 定义的i为局部变量,没循环一次,都为i创建新的绑定代码 //闭包 function show(i){ return function(){ console.log(i) //0、1、2 } } var arr=[]; for(var i=0;i<3;i++){ oLi[i].onClick(show(index)); } //立即执行函数 for(var i=0;i<3;i++){ (oLi[i].onClick(function(index){ console.log(index) }))(i); } //0/1/2 //立即执行函数给每个 li 创造一个独立作用域
Set是一个构造函数,类似数组,里面的值是唯一的;Set没有length属性值,遍历只能用for of
//数组去重: let set=new Set([1,2,3,3]); console.log([...set]) //[1,2,3] console.log(Array.from(set)) //[1,2,3] 类数组转换为数组: Array.prototype.slice.call(likeArray)//利用slice的返回新数组以及call改变this指向而形成一个新数组
类数组:(类似于一个数组的对象):是一个对象,里面有数组的值以及相应的属性(length).
类数组是指在写法上跟数组一样,比如argumens,函数的第一个参数是argument[0],写法上跟数组一样,但是不是数组,他的原型是Object。
常见的类数组有:
1、函数的参数 arguments,
2、DOM 对象列表(比如通过 document.querySelectorAll 得到的列表)
3、 jQuery 对象 (比如 $(“div”)).
Map与对象:
1、对象的key只能是字符串,Map的key可以是任意数据类型;
2、Map有自己的操作方法:
//不传参数的情况下,type为‘cat‘ function animal(type = ‘cat‘){ console.log(type) } animal()
rest参数(形式为“…变量名”),用于获取函数的多余参数
//es5 function fn(){ for(var i = 0; i<arguments.length ; i++){ console.log(arguments[i]); } } fn(1,2,3);//1,2,3 //es6 function newFn(...args){ args.filter((obj)=>{console.log(obj)}) } newFn(1,2,3);//1 2 3
四、模板字符串
用反引号来拼接
`hello ${name}`
五、class、extend、super
Class是定义类的方法,es5用构造函数定义类,es6用class,让对象原型的写法更清晰、更面向对象编程的语法、更通俗易懂。
原文:https://www.cnblogs.com/annie211/p/12690346.html