1.解构
解构:自动解析数组或对象中的值,并赋值给指定的变量。、
1.1
var arr = [3,4,5]; var [a, b, c] = arr; console.log(a, b, c); //还可以忽略值 需要使用,占位 var arr = [3,4,5]; var [a,, c] = arr; console.log(a, c); //函数返回值为数组,进行解构 function f5(){ return [1,2,3]; } var [a, b, c] = f5(); console.log(a, b, c);
1.2
var person = { "nickname": "老三", "age": 30, "sex": "男"};//解构时 {}中的变量名,不能加引号var {nickname, age, sex} = person;console.log(nickname, age, sex);//可以忽略值 直接忽略 不需要占位var {nickname, sex} = person;console.log(nickname, sex);
1.3
函数参数使用解构数组或解构对象形式
//1.函数形参,使用解构数组形式,调用函数时需要传递数组实参function f1([x,y,z]){ console.log(x,y,z);}var arr = [1,2,3];f1(arr);//相当于/*function f1(a){ var [x,y,z] = a; console.log(x,y,z);}var arr = [1,2,3];f1(arr);*///2.函数形参,使用解构对象形式,调用函数时需要传递对象实参function f2({nickname,age,sex}){ //变量名与对象成员名一致 console.log(nickname,age,sex);}var obj = {"nickname":"zhangsan", "age":40, "sex":"男"};f2(obj);//相当于/*function f1(a){ var {nickname, age, sex} = a; console.log(nickname,age,sex);}var obj = {"nickname":"zhangsan", "age":40, "sex":"男"};f2(obj);*/
1.4
1.5
2.
ES6新增了一种数据类型:Symbol,表示独一无二的值,Symbol最大的用途是用来定义对象的唯一属性名
var symbol1 = Symbol();var symbol2 = Symbol("Alice");console.log(symbol1, symbol2) // 输出:Symbol() Symbol(Alice)
Symbol类型的值是一个独一无二的值,Symbol函数的参数只是表示对当前Symbol值的描述,因此相同参数的Symbol函数的返回值是不相等的。
var attr_name = Symbol();var obj = { [attr_name]: "Alice"};console.log(obj[attr_name]);var obj = { [Symbol()]:"Alice"};console.log(obj);
使用[]方括号,里面的attr_name不带引号,表示attr_name是一个变量.
3.
ES6可以使用“箭头”(=>)定义函数,注意是普通函数,不要使用这种方式定义类(构造器)。
3.1
具有一个参数并直接返回的函数
var f1 = a=>a;//相当于 var f1 = function(a){ return a;};console.log(f1('hello'));//'hello'
没有参数的需要用在箭头前加上小括号
var f2 = () => '来了老弟';console.log(f2());
多个参数需要用到小括号,参数间逗号间隔
var f3 = (a, b) => a+b;console.log(f3(3,4));//7
函数体多条语句需要用到大括号
var f4 = (a, b) => { console.log('来了老弟'); return a+b;}console.log(f4(5,6));//11
返回对象时需要用小括号包起来,因为大括号被占用解释为代码块
var f5 = () => { return ({"name":"老弟", "age":40});}//var f5 = () => ({"name":"老弟", "age":40});console.log(f5());
直接作为事件处理函数
赋值为对象的方法
var obj = {};obj.say = ()=>{ return "hello,我是obj的say方法";}console.log(obj.say());
作为回调函数
var f6 = (f)=>{ console.log(f(100));};// f6(a=>a);var f7 = a=>a;f6(f7);
1.2
var f1 = a=>a;console.log(typeof f1);//'function'
instanceof判断是否Function的实例,结果为true
var f1 = a=>a;console.log(f1 instanceof Function);//true
箭头函数不绑定this, 内外this指向固定不变
var obj = { say:function(){ //非箭头函数 var _this = this; var f1 = function(){ console.log(_this);//obj console.log(this);//window }; f1(); //箭头函数 var f2 = ()=>{ console.log(this); }; f2(); }};obj.say();
箭头函数不能做构造函数,不能用new实例化,也没有prototype属性
var Person = ()=>{};console.log(Person.prototype);//undefinedvar p = new Person();//报错
不能使用arguments
var f1 = ()=>{ console.log(arguments);};f1(); //报错
箭头函数也支持默认参数、剩余参数、解构
var f1 = (x=1,y)=>{ console.log(x, y); //3 4};f1(3,4);var f2 = (...x)=>{ console.log(x); //[3,4]};f2(3,4);var f3 = ([x,y]=[])=>{ console.log(x, y); //3 4};f3([3,4]);