一、概述
es表示ECMASCript,从es3,es5,es6是2009.12月发布的,es6是2015.6月发布的。vue2完全支持es5, react完全支持es6。
二、es5新特性:
严格模式:一般用于相关设计,上面书写一个严格模式下面代码必须按照严格模式执行
特性:变量必须带修饰符;
函数里的this不能指向window;
不允许在非函数区域内声明函数;
函数的形参和实参不同步;
禁止八进制方法;
对数组和字符串进行加强:
数组的高阶函数(以函数做参数的函数称为高阶函数)
forEach:遍历
map:遍历
reduce:计算
fillter:过滤
some:有一些存在返回ture
every:每一个满足返回ture
字符串加强
es5新增改变this指向的方法
bind(不会自动执行)
call(自动调用函数)
applay(自动调用函数)
怪异模式:平时用的
三、ES新特性
概述:对数组、字符串、对象、函数及循环都有加强(有些说法是es6后的都是es6)
数组增强:
find查找
findindex查找下标
静态方法(使用类名):
Array.of() 将一组数据转为数组
Array.from()将伪数组转为数组
字符串增强
indexof基础上
includes
endsWith
startWith
平铺:repeat
变量修饰符(增强)
var 关键词修饰的是伪全局变量(进行变量提升)
let关键词:块状作用域(变量名不能重复声明,避免变量名被污染)
const:常量(常量不可变 ,也不能重复声明,声明一定要赋值,不能重复赋值)
新增值类型:
原有:number boolean null undefined
新增:symbol:独一无二
bigInt:存储number存不了的数据,传字符串
对象的增强
is方法:Objiect.is()判断两个对象是否是一个
Objiect.assign将后面的对象合并到前面
函数增强
箭头函数(里面没有this):this会自动找上一级,如果上一级没有,会逐层往上找
var obj = {
age: 15,
say: () => {
console.log(this);
}
}
obj.say();
function test(){
return ()=>{
console.log(this);
}
}
test()();
test.call({username:"hello"})()
默认参数:
对象里面内容的简化
属性简化:当属性值是一个变量,以及使用变量名做key的名字,可卡因省略key
函数的简写(function里面不可以):
循环的加强:
新增迭代器
set 元素不重复的集合
获取元素:值即是key又是值
map方法
解构:快速读取值,常用于对象
var obj ={name:"jack",pwd:"123"}
var {pwd} =obj;
console.log(pwd);
拓展运算符:...打开数组,拿出里面的内容
var arr =[2,3,5,6,8];
console.log(...arr);
console.log([1].concat(...arr,...arr));
新增class()类
用于构建对象的容器,调用这个class要用到new关键词
class的类名必须大写,不能重复定义,this只能在构造器(contructor)里面
this指向当前实例化,实例化的过程中,调用的的是构造器里的,与其他函数无关
class Person{
constructor(){
this.age=12;
this.name="jack";
}
run(){
console.log(this.name+"跑");
}
}
class Son extends Person{
constructor(){
super();
this.sex = "男"
}
}
var son = new Son();
console.log(son);
console.log(son.run());