变量申明

引入let，const来区分作用域

• let:适用于块级作用域,"{}"之间有效，尽量使用let替换原来的var
• const:常量申明，申明之后就必须初始化，且不能进行修改

赋值-解构化赋值，详情

数组

let [a,b] = [1,2];
//a = 1
//b = 2

        

          
        
        
        

          

          AI 代码解读
        
      
      

说明:左侧可以和右侧不是一一对应的关系例如[,b] b也会被赋值2。

对象

let {a,b} = {a:1,b:2};
//a = 1
//b = 2

        

          
        
        
        

          

          AI 代码解读
        
      
      

说明: 左侧变量名需要和右侧属性名一致，如改成别的名字则会赋值失败

默认值

let [a=3,b] = [undefined,2];
//a = 3
//b = 2

        

          
        
        
        

          

          AI 代码解读
        
      
      

说明:当右侧数组或对象没有左侧对应值时会取默认值进行赋值操作，可以用在方法的参数传递上,需注意只有undefined或者对象中没有左侧变量同名的内容时才会取默认值，如右侧结果为null，那么会赋值为null

别名

let {a:aa,b} = {a:1,b:2};
//a:VM81:1 Uncaught ReferenceError: a is not defined
//aa = 1
//b = 2

        

          
        
        
        

          

          AI 代码解读
        
      
      

说明:适用于对象赋值

剩余赋值

let [a,...b] = [1,2,3,4];
//a = 1
//b = [2,3,4]
let {a,...b} = {a:1,t1:1,t2:2,t3:3}
//a = 1
//b = {t1:1,t2:2,t3:3}

        

          
        
        
        

          

          AI 代码解读
        
      
      

动态赋值

let test = "a";
let {[test]:temp} = {a:1,b:2};
// temp= 1

        

          
        
        
        

          

          AI 代码解读
        
      
      

等号右侧可以是固定对象，也可以是函数的返回值，且操作会在代码中混合使用，需牢记

其它

等号右侧会优先转换为js对象进行处理

let [a,...b] = "test"
// a="t"
// b = "est"
let {length:len} = "test";
// len = 4

        

          
        
        
        

          

          AI 代码解读
        
      
      

字符串

新增一些常用方法

模板字符串

使用反引号` 键盘上1左边那个键，包裹的内容可以字符串与变量混用

let test = "my test"
let str = `in ${test}`
// str = "in my test"

        

          
        
        
        

          

          AI 代码解读
        
      
      

说明：

1. ${}中可以是函数，表达式
2. ``包裹的内容可以换行符等

• 带标签的模板字符串

模板字符串可以和函数一起使用：函数名模板字符串，详细请看例子

var person = 'Mike';
var age = 28;

function myTag(strings, personExp, ageExp) {

  var str0 = strings[0]; // "that "
  var str1 = strings[1]; // " is a "

  // There is technically a string after
  // the final expression (in our example),
  // but it is empty (""), so disregard.
  // var str2 = strings[2];

  var ageStr;
  if (ageExp > 99){
    ageStr = 'centenarian';
  } else {
    ageStr = 'youngster';
  }

  return str0 + personExp + str1 + ageStr;

}
var output = myTag`that ${ person } is a ${ age }`;
//等价于myTag(["that ","is a "],person,age)
console.log(output);
// that Mike is a youngster

        

          
        
        
        

          

          AI 代码解读
        
      
      

• 在标签函数中第一个参数可以通过strings.raw[0]来访问原始模板字符串

箭头函数

let a = function (t){return t+1;};
//等价于
let a = t=>t+1;

        

          
        
        
        

          

          AI 代码解读
        
      
      

说明:

• 与lamda表达式类似，如函数体有多行需要使用{}包裹，需返回时需显示使用return
• 箭头函数中this继承上层，如上层也为箭头函数则一直向上找
• 箭头函数中this为申明时绑定的，不会动态变化，例如onClick如用箭头函数则函数体中this为window对象而不是触发onClick的事件源对象
• 当箭头函数只包含一个返回的json对象时不能直接写:{a:1} 因为{}是关键字会参与解析，需使用括号包裹var func = () => ({foo: 1});

箭头函数嵌套使用

const add = (a) => (b) => a + b;
//等价于
function add(a) {
    return function(b) {
        return a + b;
    }
}
// 使用
// add(1)(3)

        

          
        
        
        

          

          AI 代码解读
        
      
      

柯里化：又译为卡瑞化或加里化，是把接收多个参数的函数变换成接收一个单一参数（最初函数的第一个参数）的函数，并返回接受剩余的参数而且返回结果的新函数的技术。这个技术由克里斯托弗·斯特雷奇以逻辑学家哈斯凯尔·加里命名的。

参考资料

http://es6.ruanyifeng.com/