浏览器支持

现在虽然已经出了ES6的规范，但是各大浏览器兼容性还有待提高。所以现在我们平时写的js代码还是多以ES5为规范。时至今日，除了一些较低版本的浏览器，各大主流浏览器基本都实现了对ES5的支持。

Chrome 13+
Firefox 4+
Safari 5.1* （Safari5.1 不支持 Function.prototype.bind）
IE 9* （IE9不支持严格模式，IE10开始支持）

ES5新特性简介

以下对ES5新增的特性或者API作一些简要介绍。

1、严格模式（Strict Mode）

Strict Mode, 即所谓的严格模式。严格模式的意义是为了提供一种更佳良好错误检查机制，让你规避掉一些语言本身的bad point。将"use strict"放在函数体或脚本文件的第一行（严格地说，只要前面不是产生实际运行结果的语句，"use strict"可以不在第一行，比如直接跟在一个空的分号后面。），则整个函数体或脚本文件以"严格模式"运行。

使用未声明的变量赋值抛出一个错误, 而不是创建一个全局变量
不止一对对象字面量分配相同的属性会抛出错误
使用with抛出错误

详细介绍，见阮一峰老师的博客《Javascript 严格模式详解》

2、JSON对象

ES5提供一个内置的（全局）JSON对象，可用来序列化（JSON.stringify）和反序列化（JSON.parse）对象为JSON格式。其一般性用法如下，

var test = {
    "name": "bothyan",
    "age": 26
};
console.log(JSON.stringify(test)); // string  '{"name": "bothyan", "age": 26}' 
console.log(JSON.parse('{"name": "bothyan"}')); // Object {"name": "bothyan"}

JSON对象提供的 parse 方法还提供第二个参数，用于对具体的反序列化操作做处理。比如，

var result = JSON.parse('{"a": 1, "b": "a"}', function(key, value){
	  if (typeof value == 'string'){
	    return 0;
	  } else {
	    return value; 
	  }
	})
console.log(result.b)   //0

JSON对象提供的 stringify方法也会提供第二个参数，用于解析的预处理，同时也会提供第三个参数，用于格式化json字符串（缩进的空格数）。比如，

var obj = {
    name: 'bothyan',
    age: 26,
    job: 'IT'    
};
var ret = JSON.stringify(obj , function(key, value) {
    return typeof value === 'string' ? undefined : value;
}, 3);
console.log(ret);   
/*
{
   "age": 22
}
*/

3、新增 object 接口

对象	构造器	说明
object	getPrototypeOf	返回对象的原型
object	getOwnPropertyDescriptor	返回对象自有属性的属性描述符
object	getOwnPropertyNames	返回一个数组，包括对象所有自有属性名称集合（包括不可枚举的属性）
object	create	创建一个拥有置顶原型和若干个指定属性的对象
object	defineProperty	给对象定义一个新属性，或者修改已有的属性，并返回
object	defineProperties	在一个对象上添加或修改一个或者多个自有属性，并返回该对象
object	seal	锁定对象。阻止修改现有属性的特性，并阻止添加新属性。但是可以修改已有属性的值。
object	freeze	冻结对象，阻止对对象的一切操作。冻结对象将永远不可变。
object	preventExtensions	让一个对象变的不可扩展，也就是永远不能再添加新的属性。
object	isSealed	判断对象是否被锁定
object	isFrozen	判断对象是否被冻结
object	isExtensible	判断对象是否可以被扩展
object	keys	返回一个由给定对象的所有可枚举自身属性的属性名组成的数组

下面分享几个常用的object接口：

一、object.defineProperty

让对象的属性有了更多控制，例如哪些是允许被修改的，哪些是可以枚举的，哪些是可以删除的等。

var cat = {};

Object.defineProperty(cat, "name", {
  value: "Maru",
  writable: false,
  enumerable: true,
  configurable: false
});

Object.defineProperty(cat, "skill", {
  value: "exploring",
  writable: true,
  enumerable: true,
  configurable: true
});

对于cat 对象, 其名字 name 不能被改变，但是会出现在 for-in 循环中。在其他方面，其skill是可以改变的

二、object.create

Object.create(prototype, descriptors) ：创建一个具有指定原型且可选择性地包含指定属性的对象

参数:
prototype 必需。要用作原型的对象。可以为 null。
descriptors 可选。包含一个或多个属性描述符的 JavaScript 对象。

4、新增 Array 接口

对象	构造器	说明
Array.prototype	indexOf	返回根据给定元素找到的第一个索引值，否则返回-1
Array.prototype	lastIndexOf	方法返回指定元素在数组中的最后一个的索引，如果不存在则返回 -1
Array.prototype	every	测试数组的所有元素是否都通过了指定函数的测试
Array.prototype	some	测试数组中的某些元素是否通过了指定函数的测试
Array.prototype	forEach	让数组的每一项都执行一次给定的函数
Array.prototype	map	返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组
Array.prototype	filter	利用所有通过指定函数测试的元素创建一个新的数组，并返回
Array.prototype	reduce	接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终为一个值
Array.prototype	reduceRight	接受一个函数作为累加器，让每个值（从右到左，亦即从尾到头）缩减为一个值

以上方法都比较有用，注意他有没有返回相应的数组。以上是实例方法，还增加的一个静态方法 Array.isArray。

5、Function.prototype.bind

bind()方法会创建一个新函数,称为绑定函数.当调用这个绑定函数时,绑定函数会以创建它时传入 bind()方法的第一个参数作为 this,传入 bind() 方法的第二个以及以后的参数加上绑定函数运行时本身的参数按照顺序作为原函数的参数来调用原函数。

fun.bind(thisArg[, arg1[, arg2[, ...]]])

this.x = 9; 
var module = {
    x: 81,
    getX: function() {
        return this.x;
    }
};
module.getX(); // 81
var getX = module.getX;
getX(); // 9, 因为在这个例子中，"this"指向全局对象
// 创建一个'this'绑定到module的函数
var boundGetX = getX.bind(module);
boundGetX(); // 81

Javascript中重新绑定 this 变量的语法糖还有 call 和 apply 。不过 bind 显然与它们有着明显的不同。bind 将会返回一个新的函数，而 call 或者 apply 并不会返回一个新的函数，它们将会使用新的 this 指针直接进行函数调用。

6、String.prototpye.trim

去掉字符串两头的空白符和换行符。

7、Date

Date.now 获取当前时间距离1970.1.1 00:00:00的毫秒数。

Date.prototype.toISOString 生成时间字符串

(new Date).toISOString()   //"2016-11-03T08:44:39.469Z"

8、other

放开了关键字不允许作为属性名的限制
getter和setter函数

getter负责查询值，它不带任何参数，setter则负责设置键值，我认为这两个纯粹的属性读写方法。用的很少，下面贴代码简单认识下

var me = {
    name : 'bothyan',
    get sex(){
        return 'man';
    }
};

me.sex = 'woman'; //不能改写，报错
console.log(me.sex); //结果依然是man

var me = {
    name : 'bothyan',
    get sex(){
        if(this.sexx){
            return this.sexx; 
        }else{
           // return 'man'; 
        }
    }, set sex(val){
        this.sexx = val; 
    }
};
console.log(me.sex); //结果man
me.sex = 'woman';
console.log(me.sex); //结果woman

来源：oschina

链接：https://my.oschina.net/u/868067/blog/780688

标签

es5

ECMAScript5 用法总结