ES6语法

es5 -升级- es6（js打脸史）

• 作用域

  var a
  function () {
  
  }
  

  a=1 //含义不明，不要用，函数的函数里面
  var a=1 //变量提升，所有的声明在最前面var。声明提前。所以不要用var了
  • let
    • es5 局部变量 需要使用立即执行函数，所以es6引入了let
    • Temp Dead Zone，先声明后使用

      console.log(a)
      let a=1//这是错误的
      

    • 重复使用let a，报错
    • const 只有一次赋值机会，无法修改，而且必须在声明的时候赋值（const特有）
    • 面试题
      for(let i=0;i<6;i++){}//i的作用域只在()中
• 块级作用域

默认参数

• es6之前

  
  image.png
  image.png

• es6

  
  image.png

---

• es6 数组push 见http://effbot.org/zone/default-values.htm

  • js 每次新初始化一个数组

    
    image.png

• python 数组push，python不会初始化一个新的数组

  
  image.png

---

• 加法，参数

  
  image.png

• es6新语法，...numbers，后面的...在numbers数组中

  
  image.png

• 三个把伪数组转化成真数组的方法es5，es6，es6

  
  image.png

---

• 数组展开

• 上面es6，下面es5

  
  image.png

---

• 方括号会上移动一行，特别注意[]和()之前之后加；

  
  image.png

---

• 解构赋值

  
  image.png

image.png

image.png

[a=1,b=2]=[3],a=1,b=2是默认参数，如果不赋值的时候会取到

image.png

• 浅拷贝

  • 对象拷贝

    
    image.png

  • 对象合并

    
    image.png

• 深拷贝 面试，假的深拷贝

  
  image.png

---

• 字符串

• 变量作为key而不是字符串作为key

  
  image.png
• 模板字符串以及标签模板http://es6.ruanyifeng.com/?search=%E6%A8%A1%E6%9D%BF&x=8&y=4#docs/string#%E6%A0%87%E7%AD%BE%E6%A8%A1%E6%9D%BF
  http://es6.ruanyifeng.com/?search=%E6%A8%A1%E6%9D%BF&x=8&y=4#docs/string#%E6%A0%87%E7%AD%BE%E6%A8%A1%E6%9D%BF
  应用styled component http://www.alloyteam.com/2017/05/guide-styled-components/
  image.png
  image.png
  image.png
  image.png
  image.png