es6
1.函数功能新增
1.1参数解构
function add(a,b){
console.log(a+b);
}
add(1,2);
//参数为数组
function add([a,b]){
console.log(a+b);
}
var arr=[1,2]; //相当于数组解构
add(arr);
//参数为对象
function add({a,b}){
console.log(a+b);
}
var arr={a:1,b:2}; //对象解构
add(arr);
//设置参数默认值
function add([a=1,b=2]){
console.log(a+b);
}
add([ ]); //设置了参数默认值时，可以没有参数值，但是参数解构必须要有
1.2 rest参数
ES6 引入 rest 参数（形式为…变量名），用于获取函数的多余参数，就不需要使用arguments对象了。
这里的变量就是一个数组，rest参数将多余的参数放入数组。
使用rest参数就可以像函数中传入任意数量的参数。
rest和arguments的区别：
arguments是一个类数组对象，但是不是数组，要想使用数组方法时需要使用Array.prototype.slice.call转换为数组。
而rest就是一个数组，可以直接使用数组的方法。
注：
rest参数之后不能放置别的参数，否则会出错。
函数的length属性不包括rest参数。
function add(a,...b){
console.log(arguments); //类数组 [Arguments] { '0': 1, '1': 2, '2': 3, '3': 4, '4': 5 }
console.log(a); // 1
console.log(b); //数组 [ 2, 3, 4, 5 ]
}
add(1,2,3,4,5);
1.3 箭头函数 ()=>{}
-
没有this,super,arguments
var name='zhangsan'; function getname(){ console.log(111) }; var f1=function(){ console.log(this.name); getname() //全局 }; var f2=()=>{ console.log(this.name); getname(); //console.log(arguments); //报错，箭头函数没有arguments }; console.dir(f1); console.dir(f2); //没有protptype原型 f1(); f2(); var obj={ getname(){ console.log(222); } } var f1=function(){ console.log(this.name); this.getname(); }; //在何处调用this就指向谁 var f2=()=>{ console.log(this.name); this.getname(); //箭头函数中无法改变this的指向 }; //谁定义箭头函数this指向谁（外层），无法改变 f1.call(obj); //通过call改变运行环境 f2.call(obj); -
不能通过new关键字调用（不能当构造函数使用）
var f3=()=>{ this.name=name; this.age=age; console.log(this.name); }; var obj=new f3('zhangsan',13); //箭头函数不能当作构造函数使用（不能通过new关键字调用） -
没有原型prototype
-
不能改变this的指向（普通函数的this指向调用他的对象，箭头函数的this指向定义他的对象（即永远指向他的父级作用域，任何方法都改变不了，包括call，apply，bind））
-
不支持重复的命名参数
-
当参数只有一个时，小括号可以省略；功能体只有一行时，大括号可以省略，会默认添加return进行返回；无参数时需要用小括号进行占位，代表参数部分。
var f4=a=>a; //代码比较简单，可以省略括号 /* function f4(a){ return a; } */ var num=f4(1); // 获取return的值 console.log(num); var f5=(a,b)=>{ //若参数有多个或功能体比较复杂时需要加括号 var c=a+b; }
2.对象简写
var name='zhangsan';
var age=10;
var obj={
name:name,
age:age,
getname:function(){}
} //对象原写法
var obj={
name,
age,
getname(){}
} //对象简写
3.对象功能新增
-
Object.is()
判断两个值是否为一个值，返回true或false如果满足以下条件则两个值相等:
-
都是 undefined
-
都是 null
-
都是 true 或 false
-
都是相同长度的字符串且相同字符按相同顺序排列
-
都是相同对象（意味着每个对象有同一个引用）
-
都是数字且
都是 +0
都是 -0
都是 NaN
或都是非零而且非 NaN 且为同一个值console.log(Object.is('1','1')); //true console.log(Object.is(1,'1')); //false console.log(Object.is({},{})); //false console.log(Object.is([],[])); //false 引用数据类型的内存地址不同 console.log(Object.is(null, null)); //true console.log(+0 === -0); //true console.log(Object.is(+0, -0)); //false console.log(NaN === NaN); //false console.log(Object.is(NaN, NaN)); //true
-
Object.assign()
将另一个对象中可枚举的属性拷贝到原对象中var obj1={n1:1,n2:2}; var obj2=Object.assign({},obj1); //深拷贝 要开辟新的内存空间 var obj3=Object.assign(obj1,{}); //浅拷贝 传引用 var obj4={n2:3,n3:4}; var obj5=Object.assign(obj1,obj4); //如果重复后者会覆盖前者 console.log(obj5); //{n1:1,n2:3,n3:4} -
Object.getPrototypeOf()
获取一个对象的原型var obj={} console.log(Object.getPrototypeOf(obj)); //获取的就是对象隐式原型属性 console.log(obj._proto_); -
Object.setPrototypeOf()
设置一个对象的原型function Animal(name){ this.name=name; } Animal.prototype.getname=function(){ //设置对象的原型，原型方法getname console.log(this.name); } var d1=new Animal('yangyang'); d1.getname(); //yangyang -
Object.keys()
获取所有可枚举属性名，返回值为数组。 -
Object.values()
获取所有的可枚举属性值 -
Object.entries()
获取所有的可枚举属性名和属性值键值对var obj={ name:'zhangsan', age:10, getname(){} } var keys=Object.keys(obj); //获取对象的可枚举属性名 ['name','age'] var values=Object.values(obj); //获取对象的所有可枚举属性值 var ens=Object.entries(obj); //获取所有可枚举属性名和属性值键值对 console.log(keys,values,ens);
4.数组功能新增
-
Array.from()
将类似数组或可迭代对象转为数组var str='hello'; console.log(Array.from(str));//[ 'h', 'e', 'l', 'l', 'o' ] var obj={ 0:'h', 1:'e', 2:'l', 3:'l', 4:'o', length:5 } //下标对应元素，length不可少 console.log(Array.from(obj)); [ 'h', 'e', 'l', 'l', 'o' ] -
Array.of()
创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型（创建数组）var arr1=new Array(1); //数组中有一个元素，元素为空 var arr2=Array.of(1); //将值当做元素传到数组中 arr1[0]=1; //给arr1元素赋值为1 console.log(arr1); console.log(arr2); -
Array.prototype.find()
返回数组中满足条件函数的第一个元素的值(只会找一个)var nums=[1,2,3,4,5]; var res=nums.find((v,k,arr)=>{ //k和arr可以省略 return v>2; }) console.log(res); -
Array.prototype.findIndex()
返回数组中满足条件函数的第一个元素的索引，未找到元素则返回-1var res1=nums.findIndex((v,k,arr)=>{ return v>2; }) console.log(res1); -
Array.prototype.includes()
找到一个元素是否存在于数组中，返回true或falseconsole.log(nums.includes(6)); //false nums中不包含6 -
Array.prototype.fill(v,start,end)
填充数组var ns=new Array(100); //数组有100位空元素 ns.fill(1); console.log(ns); ns.fill(1,0,50); ns.fill(2,50,100); console.log(ns); -
Array.prototype.keys()
返回一个包含数组中每个索引的对象。 -
Array.prototype.values()
返回一个包含该数组中索引所对应的值的对象。 -
Array.prototype.entries()
返回包含数组中索引键值对的对象。var nums=[1,2,3,4,5]; //返回可迭代对象 console.log(nums); console.log(nums.keys()); console.log(Array.from(nums.keys())); //可迭代对象转为数组 console.log(nums.values()); console.log(nums.entries()); //遍历可迭代对象 for(var v of nums.keys()){ console.log(v); }
5.for-of（可迭代对象）
用来遍历可迭代对象。
一个数据结构只要部署了Symbol.iterator属性，就被视为具有iterator接口（可迭代对象），就可以用for…of循环遍历它的成员。
6.Symbol
ES5 的对象属性名都是字符串，这容易造成属性名的冲突。
防止属性名冲突，包装每个属性的名字都是独一无二的，从根本上防止属性名的冲突。
特点：
-
用来定义对象的唯一属性名
var s1=Symbol(); console.log(s1); var s2=Symbol(); console.log(s2); console.log(s1==s2); //false console.log(s1===s2); //false 每个symbol都是独一无二的 -
Symbol 值作为对象属性名，设置属性值时，不能用点运算符，要用中括号表示法
-
Symbol 值作为对象属性名时，该属性不会出现在
for...in、for...of循环中var obj={name:'zhangsan'}; for(var k in obj){ //在for in 语句中，symbol不能被遍历出来 console.log(obj[k]); } -
可以有参数，但是参数仅仅为一个描述，便于区分
在对象中当做属性名使用
var obj={name:'zhangsan'};
var name=Symbol('name'); //name仅仅只是symbol的描述
console.log(name);
obj[name]='xiaoming'; //将Symbol('name')当做属性名，只能使用[] 设置，不能使用.
console.log(obj[name]);
obj[Symbol.for('age')]=10; //若存在以该参数作为名称的symbol值，返回值，没有则新建
console.log(obj[Symbol.for('age')]);
消除魔术字符串
魔术字符串指的是，在代码之中屡次出现、与代码造成强耦合的某一个具体的字符串或者数值。
var stus={
n1:Symbol('xiaohong'),
n2:Symbol('xiaoming'),
n3:Symbol('xiaobai')
}
function test(name){
if(name==stus.n1)
console.log(1);
else if(name==stus.n2)
console.log(2);
else if(name==stus.n3)
console.log(3);
}
//test('xiaohong')
test(stus.n2);
方法：
-
Object.getOwnPropertySymbols()
返回一个数组，只包含symbol类型 -
Reflect.ownKeys()
返回所有的键数组 -
Symbol.for()
接受一个字符串作为参数，然后搜索有没有以该参数作为名称的 Symbol 值。若已经存在该值，就返回对应的Symbol值，否则就新建一个以该字符串为名称的 Symbol 值，并将其注册到全局var obj={name:'zhangsan'}; obj[Symbol.for('age')]=10; //若存在以该参数作为名称的symbol值，返回值，没有则新建 console.log(obj[Symbol.for('age')]); console.log(Object.getOwnPropertySymbols(obj)); //获取symbol设置的属性，返回数组，值包含symbol类型 console.log(Reflect.ownKeys(obj));//获取对象所有的成员（包括symbol） var s5=Symbol.for('test'); console.log(Symbol.keyFor(s5)); //获取已经注册过的Symbol的键
注意：
Symbol 值作为属性名时，该属性是公有属性不是私有属性，可以在类的外部访问。
但是不会出现在 for…in 、 for…of 的循环中，也不会被 Object.keys() 、 Object.getOwnPropertyNames() 返回。
如果要读取到一个对象的 Symbol 属性，可以通过 Object.getOwnPropertySymbols() 和 Reflect.ownKeys() 取到。
7.Set集合
Set类似于数组，但是里面的成员是唯一的，且不会重复（可以用来去重）；
Set是一个构造函数，成员不能通过索引的方式访问；
Set是一个可迭代对象（有iterable接口）；
Set 构造函数可以接受一个数组（或者具有 iterable 接口的其他数据结构）作为参数，用来初始化。
-
Set.prototype.size
返回Set实例的元素总数 -
Set.prototype.add(value)
添加某个值，返回Set结构本身，不能添加重复的值 -
Set.prototype.delete(value)
删除某个值，返回一个布尔值，表示删除是否成功 -
Set.prototype.has(value)
返回一个布尔值，表示该值是否为Set的元素。 -
Set.prototype.clear()
清空一个 Set 对象中的所有元素。 -
Set.prototype.keys()
返回Set 对象中的元素值的一个 Iterator 对象。 -
Set.prototype.values()
返回Set 对象中的元素值的一个 Iterator 对象。 -
Set.prototype.entries()
返回Set 对象中的[key, value]的一个 Iterator 对象。 -
Set.prototype.forEach()
遍历var arr=[1,2,3,4,5,5,5] var s=new Set(arr); //去重 可迭代对象 console.log(s); var arr=Array.from(s); //转换为数组（完成数组去重） console.log(arr); console.log(s.size); //set元素总数 s.add(6); //添加成员 console.log(s); s.delete(1); //删除该成员 console.log(s); console.log(s.has(2));//是否包含该成员 //s.clear(); //清除所有数组元素 console.log(s); console.log(s.keys()); //set对象的键 console.log(s.values()); //set对象的值 console.log(s.entries()); //set对象的键值对 键值相同 s.forEach((v)=>{ console.log(v); }) //遍历
8.Map集合
Map用于保存键值对，类似于对象，也是键值对的集合，任何值(对象或者原始值) 都可以作为一个键或一个值。
Map 可以接受一个数组作为参数。该数组的成员是一个个表示键值对的数组。[[key,value],[key,value]]
在Map中任何的类型的数据都可以为键，值跟Object一致。
- 我们在使用{}时，有可能会出现属性名和原型中的属性名一致的情况，Map不会
- 一个 Map的键可以是任意值，包括函数、对象或任意基本类型。
- Map 中的 key 是有序的。{}无序
- Map 的键值对个数可以轻易地通过size 属性获取，{}需要计算
Map集合在创建时，也可以传递一个数组进行创建，但是需要注意形似为[key,value]
-
Map.prototype.size
返回Map对象的键/值对的数量。 -
Map.prototype.set(key, value)
set方法设置键名key对应的键值为value -
Map.prototype.get(key)
get方法读取key对应的键值 -
Map.prototype.has(key)
某个键是否在当前 Map 对象之中 -
Map.prototype.delete(key)
delete方法删除某个键，返回true -
Map.prototype.clear()
清除所有成员 -
Map.prototype.keys()
返回键名的遍历器对象 -
Map.prototype.values()
返回键值的遍历器对象 -
Map.prototype.entries()
返回键值对的遍历器对象 -
Map.prototype.forEach()
遍历var k=[]; var arr=[[0,'1'],[1,'2'],[k,3],[{},4]] var m=new Map(arr); console.log(m); console.log(m.get(k)); //获取键对应的值，[]和{}不能直接写 m.set(4,'5'); //设置键值 console.log(m); console.log(m.size); //键值对的数量 console.log(m.has(0));//查找是否含有该成员 m.delete(1); console.log(m); //m.clear(); console.log(m.keys()); console.log(m.values()); console.log(m.entries()); m.forEach((v,k,map)=>{ console.log(v); //值 }) for(var k of m.keys()){ console.log(k); //键 }
关于es6的更多文章
es6基础
ES6语法 1（let，const，解构，模板字符串，扩展运算符）
ES6语法 3（class，迭代器，promise，generator，async/await，proxy/reflect）
148
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
