ES5&ES6新变化

ES5:新特性、新API==》语法没有变化

1.保护对象：保护对象的属性和方法

1.四大特性：每个属性都有四大特性

• 有哪四大特性：

  {
          "value": 3500, //实际保存属性值的地方
          "writable": true,//开关：控制着是否可以被修改
          "enumerable": true,//开关：控制着是否可以被for in循环遍历到
          "configurable": true//开关：控制着是否可以被删除
  }
  

• 如何修改：

  Object.defineProperties(obj,{
                      "属性名":{四大特性}
                  })
  

2.三大级别：

• 防扩展：禁止给对象添加任何新属性==》Object.preventExtensions(obj);
• 密封：禁止给对象添加任何新属性，也不能删除属性==》Object.seal(obj);
• 冻结：禁止给对象添加任何新属性，也不能删除属性，也不能修改属性==》Object.freeze(obj);

注意：这些都不重要==》

• 如果你不用面向对象开发，你保护个屁
• 前辈们都没有保护，你保护个屁

2.数组的新的api：3组6个

1.判断

• every：每一个==》判断数组中的每个元素都要符合要求，最后结果才为ture，只要有一个不满足，结果则为false，类似于&&

  语法：

  arr.every(function(val,i,arr){
      console.log(val);//当前元素
      console.log(0);//当前元素的下标
      console.log(arr);//数组本身
      return判断条件;
  })
  

• some：有一些==》判断数组中是否包含符合要求的元素，只要有一个符合，最后结果则为ture，只有全部不满足，结果才为false，类似于||

  语法：

  arr.some(function(val,i,arr){
      console.log(val);//当前元素
      console.log(0);//当前元素的下标
      console.log(arr);//数组本身
      return判断条件;
  })
  

2.遍历：对每个元素执行相同的操作

• forEach:对原数组中每个元素执行相同操作==》直接修改原数组

  语法：

  arr.forEach(function(val,i,arr){
              操作
  });
  

• map:取出原数组中每个元素，执行相同操作后，放入一个新数组中返回==》不修改原数组，只返回新数组

  语法：

  var 新数组=arr.map(function(val,i,arr){
      return 操作;
  });
  

3.过滤和汇总

• 过滤 filter：筛选出原数组中符合条件的元素组成的新数组==》原数组不变

  语法：

  var subArr=arr.filter(function(val,i,arr){
  return 判断条件;
  })
  

• 汇总 reduce：将数组中每个元素的值，汇总成一个最终结果==》返回值：一个汇总的结果

  语法：

  var result=arr.reduce(function(val,i,arr){
  return 操作;
  })
  

3、Object.create()方法：直接用父对象创建子对象，并且子对象扩展自有属性

• 语法：

  var 子对象=Object.create(父对象，{
  "自有属性"，{四大特性}，
  ...
  })
  

4、严格模式：很严格

• 如何开启："use strict",可以放在任何一个作用域的顶部
• 1、禁止给未声明的变量赋值 - 解决了全局污染
• 2、将静默失败升级为了错误
• 以后如果三阶段学了gulp和webpack，可能打包时就会自动给你生成一个"use strict"，你去把他删掉

5、call、apply、bind

1、call、apply:临时替换函数中的this=》借用

• 差别：

  0. call，要求传入函数的实参必须单独参入
  1. aplly，要求传入函数的实参必须是一个数组

• 语法：

  0. 要借用的函数.call(借用的对象,实参1,...);
  1. 要借用的函数.apply(借用的对象,arr); - apply除了有借用的功能，还会悄悄的打散我们的数组

2、bind：永久的替换函数中的this=》买

• 语法：var 新函数=老函数.bind(指定的对象)

• 3件事：

  0. 创建了一个和原函数功能完全一样的函数
  1. 将新函数中的this永久绑定为指定对象
  2. 将新函数中的部分固定参数提前永久绑定

• 强调：bind绑定在新函数中的this，无法被call/apply再替换。

3.总结：

1. 如果临时调用一个函数，立刻执行==》call/apply
2. 如果创建一个函数提前绑定this,不一定希望立刻执行==》bind
3. 个人推荐：call、apply==》这个的性能比bind好

4.使用场景：

0. 比较出数组中的最大值和最小值：Math.max/min.apply(Math.arr)
1. 得到Object最原始的toString：Object.prototype.toString.call/apply(arr);
2. 将类数组转换成普通数组：var 新数组=Array.prototye
3. 其实ES5还提供了一个数组API，可以直接将类数组对象转为普通数组：var 新数组=Array.from(类数组对象)

ES6:新特性、新API==》语法有变化

1.模板字符串:简化字符串的拼接，支持在字符串中书写变量

• 语法：我的名字叫${name}==》在字符串中实现了一个简单的js环境

2.let关键字:创建变量优先使用let，再考虑var

• 语法：let 变量名=值

• 优点：

  0. 解决了声明提前
  1. 添加了块级作用域，一个{}就是一个块
  2. 如果绑定事件时，用到了let来遍历，那么let会记录住你当前元素的下标==》以后再也不需要自定义下标了

3.箭头函数：简化一切的回调函数

1. 去掉function，()和{}之间添加=>，形参只有一个可以省略()
2. 函数体只有一句话，省略{}
3. 函数体只有一句话，并且是return，省略{}和return

4.for...of==》垃圾

• 语法：

  for(var v of arr){
              v//直接拿到值
          }
  

• 缺点：

  1. 不能修改原数组
  2. 不能遍历hash数组和对象

5.常量

6.解构赋值

7.Set和Map类型

8.模块化开发

9.Promise

10.Class