深入理解ES语法1
学习react之际,发现很多看不懂的语法,比如=>
,...
不定参数,set()
集合等等。我就买了一本尼神的《深入理解ES6》,在此之前,我还没有看完红宝书,但是这本ES6的内容,真的让我更加理解js语法。在此记录一些要点。
let
块级声明
let声明:用法与var相同,用let代替var来声明变量,就可以把变量的作用域限制在当前代码块中。由于let声明不会被提升,因此开发者通常将let声明语句放在封闭代码块的顶部,以便整个代码块都可以访问。let禁止重复声明。
if (condition){
let value="blue";
// 其他代码
return value;
}else{
//变量value在此处不存在
return null;
}
}
const
声明
使用const
声明的是常量,其值一旦被设定后不可更改。因此,每个通过const
声明的常量必须进行初始化。
const maxItems=30;
const name; //语法错误:常量未初始化
- ES6增强来Function构造函数的功能,支持在创建函数时定义默认参数和不定参数。唯一需要做的是在参数名后添加一个等号及一个默认值,就像这样:
var add=new Function("first","second=first","return first+second");
console.log(add(1,1)); //2
console.log(add(1)); //2
定义不定参数,只需在最后一个参数前添加...
,像这样:
var pickFirst=new Function("...args","return args[0]");
console.log(pickFirst(1,2)); //1
- 展开运算符
let values=[25,50,75,100]
console.log(Math.max(...values));
//100
//等价于
//console.log(Math.max(25,50,75,100));
- 箭头函数
在ES6中,箭头函数是其中最有其的新增特征。是一种使用箭头=>
定义函数的新语法,但是它与传统的js函数有些许不同,主要集中在以下方面:
- 没有
this
,super
,arguments
和new.target
绑定。这些值由外围最近一层非箭头函数决定。 - 不能通过
new
关键字调用,箭头函数没有[[Construct]]方法,所以不能被用作构造函数。 - 没有原型
- 不可以改变
this
的绑定。函数内部的this
值不可被改变,在函数的生命周期内始终保持一致。 - 不支持
arguments
对象,所以必须通过命名参数和不定参数这两种形式访问函数的参数。 - 不支持重复的命名参数。
- 没有
- 箭头函数语法
let reflect=value=>value;
//相当于
let reflect=function(value){
return value;
};
let sum=(num1,num2)=>num1+num2;
//相当于
let sum=function(num1,num2){
return num1+num2;
};
let getName=()=>"Terrence";
//相当于
let getName=function(){
return "Terrence";
};
如果想创建一个空函数,需要写一对没有内容的花括号,像这样:
let doNothing=()=>{};
//相当于
let doNothing=function(){};
如果想在箭头函数外返回一个对象字面量,则需要将该字面量包裹在小括号里。像这样:
let getTempItem=id=>({ id:id,name:"Temp" });
//相当于
let getTempItem=function(id){
return{
id:id,
name:"Temp"
};
};
创建立即执行函数表达式
let person=((name){
return{
getName:function(){
return name;
}
};
})("Terrence");
console.log(person.getName());//"Terrence"
比较器:
var result=values.sort((a,b)=>a-b);