es6中的部分新特性

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

1、es6中变量声明可以使用let声明变量，用const声明常量。例：

test:function(){
{
var num=10;
let num1=11;
const num2=12;
}
console.log(num); //
console.log(num1); //报错
console.log(num2); //报错
}

2、es6中的模板字符串。使用反撇号字符`代替普通字符串的引号'或"。例：

test:function(){
var num=12;
var num1=15;
var str=`${num}+${num1}=${num+num1}`;
console.log(str); //12+15=27
}

3、箭头函数。例：

test:()=>{
num=[1,2,3,4,5,6,7];
num.forEach(function(v){
console.log(v); //输出数组中的每个值
})
//使用箭头函数(=>符号取代function，当参数只有一个的时候，可以省略参数外面的括号)
num.forEach(v=>{
console.log(v); //输出数组中的每个值
});
//参数的扩展
function root(num=4){
console.log(num);
}
function root1(...num){
let sum=0;
for(let n of num){
sum+=n;
}
}
root(); //4 没有参数的时候默认值为4
root(8); //8 传递参数的时候所传的参数取代默认值
root1(1.2); //1.2
root1(1,2,3,4,5) //
//this作用域
wx.getSystemInfo({
success:function(res){
this.setData({ //没有使用箭头函数时，这样写会报错，因为this指向是wx.getSystemInfo
//假设data里面有定义一个name的值
name:"123"
})
success:res=>{
this.setData({ //使用了箭头函数，this指向是test,所以可以修改data里面的值
//假设data里面有定义一个name的值
name:"123"
})
}
})
}

4、增强的变量字面量。例：

test:function(){
var tool={
['str'+'name'+'you']:"ok",
};
console.log(tool); //strnameyou:ok
}

5、解构赋值：es6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，叫做解构

①：数组的解构赋值，可以从数组中提取值，按照对应位置，对变量赋值

②：对象的解构赋值

③：字符串的解构赋值，字符串被转换成了一个类似数组的对象

④：函数参数的解构赋值

test:function(){ //数组的解构
var num=[45,46,85,22];
var [a,b,c,d]=num;
console.log(a,d); //45,22 //对象的解构
var tool={
name:"loop",
age:12,
sex:'男'
};
var {name,sex}=tool;
console.log(name,sex); //loop，男 //字符串的解构赋值
var [a,b,c,d]="java";
console.log(a,b,c,d); //j a v a //函数的解构赋值
function tt([x,y]){
console.log(x,y); //1,2
}
tt([1,2]);
}

6、类：Class是es6引入的最重要的特性之一，在没有Class之前，我们只能通过原型链来模拟类

test:function(){
var Root=function(){ };
Root.prototype.eat=function(){
console.log("es5 eat");
}
Root.doing=function(){
console.log("es5 eat")
} let a=new Root();
a.eat(); //es5 eat
Root.doing(); //es5 eat class Roots{
constructor(){ }
eat(){
console.log("Es6 eat");
}
static doing(){
console.log("Es6 doing");
}
}
let b=new Roots();
b.eat(); //Es6 eat
Roots.doing(); //Es6 doing
}