ES5 ES6相关内容 day15

1. JavaScript 的版本

          JavaScript这种语言的基本语法结构是由ECMAScript来标准化的, 所以我们说的JavaScript版本一般指的是ECMAScript版本.

2009年12月，ECMAScript 5.0版正式发布

2011年6月，ECMAscript 5.1版发布

2015年6月，ECMAScript 6正式发布，并且更名为“ECMAScript 2015”。

2016年6月，ECMAScript6.1发布， 与ECMAScript6差异较小

ES5 : ECMAScript 5

ES5的严格模式:

所谓严格模式,从字面上就很好理解,即更严格的模式,在这种模式下执行,浏览器会对JS的要求更苛刻,语法格式要求更细致,更符合逻辑

怪异模式:就是我们之前一直使用的开发模式,就叫怪异模式.因此很多时候出来的结果是非常 怪异的,所以才称之为怪异模式

使用严格(全局)模式

         "use strict";

         n = 10;

console.log(n);

使用严格(局部)模式

        function fn(){

            "use strict";

            n = 10

            console.log(n);

        }

Javascript 为什么要设立严格模式：

1.消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为;

2.代码运行的一些不安全之处，保证代码运行的安全；

3.提高编译器效率，增加运行速度；

  例如以下几点:

 1. 不可以省略var声明变量

 2. 禁止函数使用this关键字指向全局变量

 3. 禁止使用八进制方法

 4. 不允许在非函数的代码块内声明函数

 5. 严格模式下,arguments变量,形参是不会变(不同步)

ES5-bind

    绑定一个新对象， 让函数中的this指向该对象， 一般在定时器中使用较多。

例如：

var name = "哈哈";

var obj = {name:"张三"};

var obj2 = {

      name: "李四",

      show: function(){

    console.log(this.name);

      }

}

setInterval(obj2.show.bind(obj), 2000); 函数对象.bind(绑定的对象)()

ES5-Array新增

indexOf() : 判断数组中是否包含某个元素， 和字符串的indexOf用法类似

forEach() : 用来遍历数组中的每一项；这个方法执行是没有返回值的，对原来数组也没有影响

var arr = [1,2,3,4,5];

arr.forEach(function(value, index, array){

      console.log("值：" + value + ", 下标：" + index + ", 数组：" + array);

});

map(): 和forEach非常相似，都是用来遍历数组中的每一项的，区别是map的回调函数中支持return返回

不管是forEach还是map 都支持第二个参数值，第二个参数的意思是把匿名回调函数中的this进行修改。

var arr = [1,2,3,4,5];

var newArr = arr.map(function(value, index, array){

        return value * 2;

});

console.log(arr);  //[1,2,3,4,5]

console.log(newArr);  //[2,4,6,8,10]

注意：forEach和map不支持IE8及以下

    reduce()用法： 接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终为一个值，是ES5中新增的一个数组逐项处理方法  

 var result = arr.reduce(function(pre, cur, index, array){

     console.log("前一个值：" + pre + "当前值：" + cur + ", 下标：" + index + ", 数组：" + array);          return cur;    

}, 10);

reduce接收四个两个参数， 第二个参数可选（为pre的初始值）

第一个参数是回调函数，该回调函数中又包含四个参数， 分别为：

    pre：上一次调用回调函数时的返回值，或者初始值  

    cur：当前正在处理的数组元素

    index : 当前正在处理的数组元素下标

    array : 调用reduce()方法的数组

   result: 遍历完数组后的最终结果

reduce()用法：    使用reduce()求和

var arr = [1,2,3,4,5];

var sum = arr.reduce(function(pre, cur){

        return pre + cur;

});

console.log(sum); //25

forEach、map以及reduce的相同点：

    都是用于处理数组

    都不兼容IE8及以下

forEach、map以及reduce的不同点：

    forEach 方法是将数组中的每一个值取出做一些程序员想让他们做的事情

    map 方法是将数组中的每一个值放入一个方法中做一些程序员想让他们做的事情后可以返回一个新的数组

    reduce 方法 将数组中的每一个值与前面的值处理后得到的最终值

    filter()：  过滤出数组中你想要的元素， 不改变原数组

var arr = [1,2,3,4,5];

function fn(n) {

      return n >= 3;

}

var newArr = arr.filter(fn);

console.log(arr);  //[1,2,3,4,5]

console.log(newArr); //[3,4,5]

ES6

ES6-let

let是ES6中新增关键字.它的作用类似于var,用来声明变量,但是所声明的变量,只在let命令所在的代码块内有效

if(true){

    var a = 1;

    let b = 2; }

console.log(a);

console.log(b);  // 报错：ReferenceError: b is not defined

ES6-let let关键字涉及到一个概念：块级作用域

ES6以前，只有全局作用域和函数局部作用域，ES6之后加入块级作用域，一个大括号{}我们称之为一个代码块，一个大括号{}的内部就是块级作用域

利用块级作用域可以有效解决以下问题

1.防止全局变量泄露

2.防止变量提升带来的覆盖问题

ES6-const

const 声明的是常量，一旦声明，值将是不可变的, const 也具有块级作用域 ,  const 不可重复声明