虽然ECMAScript5早就成为标准推出来了,但之前因为一直用的是ECMAScript3,并且工作中总是要求兼容IE的低版本,所以用的比较少。如今市场上大多数浏览器都能兼容ECMAScript5(IE8除外),逐渐的就用的比较多了。今天主要是把ECMAScript5中新增奶的特性及方法总结一下,已备需要时方便查询。

ECMAScript5的兼容性可参见http://kangax.github.io/compat-table/es5/

严格模式(Strict Mode)是ECMAScript 5的新特性,它允许你把整个程序,或者某个函数,放置在“严格”的操作语境中。这种严格的语境会防止某些特定的操作并抛出更多的异常。严格模式下主要变化有:

  1. 未使用var创建的变量会报错
  2. 函数顶层的this不在指向window,而是undefined
  3. 强制为eval创建新作用域
  4. 禁止用delete删除变量
  5. 禁止使用arguments,callee,caller属性
  6. 禁止使用width语句
  7. 禁止函数参数重名
  8. 禁止对象属性重名
  9. 禁止使用八进制数字
  10. 不允许在非函数的代码块内声明函数。
  11. 新增保留字:implements, interface, let, package, private, protected, public, static, yield。

Object新增方法:

Object.create()

创建一个具有指定原型且可选择性地包含指定属性的对象

Object.create(proto, [ propertiesObject ])

proto:一个对象,作为新创建对象的原型。或者为 null。

propertiesObject:可选。该参数对象是一组属性与值,该对象的属性名称将是新创建的对象的属性名称,值是属性描述符。注意:该参数对象不能是 undefined,另外只有该对象中自身拥有的可枚举的属性才有效,也就是说该对象的原型链上属性是无效的。

示例:

//Shape - superclass
function Shape() {
this.x = 0;
this.y = 0;
} Shape.prototype.move = function(x, y) {
this.x += x;
this.y += y;
console.info("Shape moved.");
}; // Rectangle - subclass
function Rectangle() {
Shape.call(this); //call super constructor.
} Rectangle.prototype = Object.create(Shape.prototype); var rect = new Rectangle();
rect instanceof Rectangle //true.
rect instanceof Shape //true.
rect.move(1, 1); //Outputs, "Shape moved."

Object.getPrototypeOf()

返回该对象的原型(也就是该对象内部属性[[prototype]]的值)

Object.getPrototypeOf(object)

在 ES5 中,如果参数不是一个对象类型,将抛出一个 TypeError 异常。在ES6中,参数被强制转换为Object。

示例:

var proto = {};
var obj = Object.create(proto);
Object.getPrototypeOf(obj) === proto; // true

Object.getOwnPropertyNames()

返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性)组成的数组。

Object.getOwnPropertyNames(obj)

obj:一个对象,其自身的可枚举和不可枚举属性的名称被返回。

示例:

var arr = ["a", "b", "c"];
console.log(Object.getOwnPropertyNames(arr).sort()); // ["0", "1", "2", "length"]

Object.defineProperty()

直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。

Object.defineProperty(obj, prop, descriptor)

obj:需要定义属性的对象。

prop:需定义或修改的属性的名字。

descriptor:将被定义或修改的属性的描述符。

示例:

Object.defineProperty(obj, "key", {
enumerable: false,
configurable: false,
writable: false,
value: "static"
});

Object.defineProperties()

在一个对象上添加或修改一个或者多个自有属性,并返回该对象。

Object.defineProperties(obj, props)

obj:将要被添加属性或修改属性的对象

props:该对象的一个或多个键值对定义了将要为对象添加或修改的属性的具体配置

示例:

var obj = {};
Object.defineProperties(obj, {
"property1": {
value: true,
writable: true
},
"property2": {
value: "Hello",
writable: false
}
});
console.log(obj) //{property1:true,property2:"Hello"}

Object.getOwnPropertyDescriptor()

指定对象上一个自有属性对应的属性描述符(自有属性指的是直接赋予该对象的属性,不需要从原型链上进行查找的属性)。如果指定的属性存在于对象上,则返回其属性描述符(property descriptor),否则返回 undefined。

Object.getOwnPropertyDescriptor(obj, prop)

obj:在该对象上查看属性

prop:一个属性名称,该属性的属性描述符将被返回

示例:

var o, d;
o = { bar: 42 };
d = Object.getOwnPropertyDescriptor(o, "bar");
console.log(d);//{ configurable: true, enumerable: true, value: 42, writable: true }

Object.seal()

可以让一个对象密封,并返回被密封后的对象。密封对象是指那些不能添加新的属性,不能删除已有属性,以及不能修改已有属性的可枚举性、可配置性、可写性,但可能可以修改已有属性的值的对象。

Object.seal(obj)

Object.freeze()

可以冻结一个对象,冻结指的是不能向这个对象添加新的属性,不能修改其已有属性的值,不能删除已有属性,以及不能修改该对象已有属性的可枚举性、可配置性、可写性。也就是说,这个对象永远是不可变的。该方法返回被冻结的对象。

Object.freeze(obj)

Object.preventExtensions()

让一个对象变的不可扩展,也就是永远不能再添加新的属性。

Object.preventExtensions(obj)

Object.isExtrensible()

判断一个对象是否是可扩展的(是否可以在它上面添加新的属性)。

Object.isExtensible(obj)

示例:

// 新对象默认是可扩展的.
var empty = {};
Object.isExtensible(empty); // === true
// ...可以变的不可扩展.
Object.preventExtensions(empty);
Object.isExtensible(empty); // === false

Object.isSealed()

判断一个对象是否是密封的(sealed)。

Object.isSealed(obj)

示例:

// 新建的对象默认不是密封的.
var empty = {};
Object.isSealed(empty); // === false // 如果你把一个空对象变的不可扩展,则它同时也会变成个密封对象.
Object.preventExtensions(empty);
Object.isSealed(empty); // === true

Object.isFrozen()

判断一个对象是否被冻结(frozen)。

Object.isFrozen(obj)

Object.keys()

返回一个由给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for...in 循环遍历该对象时返回的顺序一致 (两者的主要区别是 一个 for-in 循环还会枚举其原型链上的属性)。

Object.keys(obj)

示例:

var arr = ["a", "b", "c"];
console.log(Object.keys(arr));// [ '0', '1', '2' ]

Object.prototype新增方法

Object.prototype.isPrototypeOf()

用于测试一个对象是否存在于另一个对象的原型链上。

Obj.prototype.isPrototypeOf(object)

object:在该对象的原型链上搜寻

示例:

var arr = [];
console.log(arr instanceof Array);//true
console.log(Array.prototype.isPrototypeOf(arr));//true

isPrototypeOf 和 instanceof operator 是不一样的。在表达式 object instanceof AFunction 中,检测的是 AFunction.prototype 是否在object 的原型链中,而不是检测 AFunction 自身。

Object.prototype.propertyIsEnumerable()

返回一个布尔值,表明指定的属性名是否是当前对象可枚举的自身属性。

obj.propertyIsEnumerable(prop)

示例:

var o = {};
o.prop = 'is enumerable';
o.propertyIsEnumerable('prop'); // 返回 true

Function.prototype新增方法

Function.prototype.bind()

bind()方法会创建一个新函数。当这个新函数被调用时,bind()的第一个参数将作为它运行时的 this, 之后的一序列参数将会在传递的实参前传入作为它的参数。

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

thisArg:当绑定函数被调用时,该参数会作为原函数运行时的 this 指向。当使用new 操作符调用绑定函数时,该参数无效。

arg1, arg2, ...:当绑定函数被调用时,这些参数将置于实参之前传递给被绑定的方法。

示例:

this.x = 9;
var module = {
x: 81,
getX: function() { return this.x; }
};
module.getX(); // 返回 81
var retrieveX = module.getX;
retrieveX(); // 返回 9, 在这种情况下,"this"指向全局作用域
// 创建一个新函数,将"this"绑定到module对象
// 新手可能会被全局的x变量和module里的属性x所迷惑
var boundGetX = retrieveX.bind(module);
boundGetX(); // 返回 81

Array新增方法:

Array.isArray()

该方法适用于确定传递的值是否为Array。

Array.isArray(obj)

示例:

Array.isArray([1, 2, 3]);  // true
Array.isArray({foo: 123}); // false
Array.isArray("foobar"); // false
Array.isArray(undefined); // false

位置方法:

Array.prototype.indexOf()

返回在数组中可以找到给定元素的第一个索引,如果不存在,则返回-1。

arr.indexOf(searchElement)

示例:

var a = [2, 9, 9];
a.indexOf(2); // 0

Array.prototype.lastIndexOf()

返回指定元素(也即有效的 JavaScript 值或变量)在数组中的最后一个的索引,如果不存在则返回 -1。从数组的后面向前查找,从 fromIndex 处开始。

arr.lastIndexOf(searchElement[, fromIndex = arr.length - 1])

searchElement:被查找的元素。

fromIndex:从此位置开始逆向查找。默认为数组的长度减 1,即整个数组都被查找。如果该值大于或等于数组的长度,则整个数组会被查找。如果为负值,将其视为从数组末尾向前的偏移。即使该值为负,数组仍然会被从后向前查找。如果该值为负时,其绝对值大于数组长度,则方法返回 -1,即数组不会被查找。

示例:

var array = [2, 5, 9, 2];
var index = array.lastIndexOf(2);//3

迭代方法:

Array.prototype.every()

测试数组的所有元素是否都通过了指定函数的测试。

every 方法为数组中的每个元素执行一次 callback 函数,直到它找到一个使 callback 返回 false(表示可转换为布尔值 false 的值)的元素。如果发现了一个这样的元素,every 方法将会立即返回 false。否则,callback 为每一个元素返回 true,every 就会返回 true。

arr.every(callback[, thisArg])

callback:用来测试每个元素的函数。

thisArg:执行 callback 时使用的 this 值。

示例:

function isBigEnough(element, index, array) {
return (element >= 10);
}
var passed = [12, 5, 8, 130, 44].every(isBigEnough);// false
passed = [12, 54, 18, 130, 44].every(isBigEnough);// true

Array.prototype.some()

测试数组中的某些元素是否通过了指定函数的测试。

some 为数组中的每一个元素执行一次 callback 函数,直到找到一个使得 callback 返回一个“真值”(即可转换为布尔值 true 的值)。如果找到了这样一个值,some 将会立即返回 true。否则,some 返回 false。

arr.some(callback[, thisArg])

示例:

function isBigEnough(element, index, array) {
return (element >= 10);
}
var passed = [2, 5, 8, 1, 4].some(isBigEnough);
// passed is false
passed = [12, 5, 8, 1, 4].some(isBigEnough);
// passed is true

Array.prototype.filter()

使用指定的函数测试所有元素,并创建一个包含所有通过测试的元素的新数组。

filter 为数组中的每个元素调用一次 callback 函数,并利用所有使得 callback 返回 true 或 等价于 true 的值 的元素创建一个新数组。

var new_arrary = arr.filter(callback[, thisArg])

示例:

function isBigEnough(value) {
return value >= 10;
} var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);//[12, 130, 44]

Array.prototype.forEach()

方法对数组的每个元素执行一次提供的函数。

array.forEach(callback[, thisArg])

示例:

var a = ['a', 'b', 'c'];

a.forEach(function(element) {
console.log(element);
});
// a
// b
// c

forEach() 为每个数组元素执行callback函数;不像map() 或者reduce() ,它总是返回 undefined值,并且不可链式调用。

Array.prototype.map()

创建一个新数组,其结果是该数组中的每个元素调用一个提供的函数。

map 方法会给原数组中的每个元素都按顺序调用一次 callback 函数。callback 每次执行后的返回值(包括 undefined)组合起来形成一个新数组。

var new_array = arr.map(callback[, thisArg])

示例:

var numbers = [1, 5, 10, 15];
var roots = numbers.map(function(x) {
return x * 2;
});
// roots is now [2, 10, 20, 30]
// numbers is still [1, 5, 10, 15]

归并方法:

Array.prototype.reduce()

对累加器和数组的每个值 (从左到右)应用一个函数,以将其减少为单个值。

arr.reduce(callback,[initialValue])

callback:执行数组中每个值的函数,包含四个参数

accumulator:上一次调用回调返回的值,或者是提供的初始值(initialValue)

currentValue:数组中正在处理的元素

currentIndex:数据中正在处理的元素索引,如果提供了 initialValue ,从0开始;否则从1开始

array:调用 reduce 的数组

initialValue:可选项,其值用于第一次调用 callback 的第一个参数。

示例:

var sum = [0, 1, 2, 3].reduce(function(acc, val) {
return acc + val;
}, 0); console.log(sum);// 6

Array.prototype.reduceRight();

reduceRight() 方法接受一个函数作为累加器(accumulator),让每个值(从右到左,亦即从尾到头)缩减为一个值。(与 reduce() 的执行方向相反)

arr.reduceRight(callback[, initialValue])

示例:

var flattened = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) {
return a.concat(b);
}, []);
// flattened is [4, 5, 2, 3, 0, 1]

String

String.trim()

会删除一个字符串两端的空白字符。

var newStr = str.trim()

示例:

var orig = '   foo  ';
console.log(orig.trim()); // 'foo'

Date

Date.now()

返回自1970年1月1日 00:00:00 UTC到当前时间的毫秒数。

var timeInMs = Date.now();

IE8及以下可以用以下代码来兼容:

if (!Date.now) {
Date.now = function now() {
return new Date().getTime();
};
}

Date.prototype.toISOString()

返回一个 ISO(ISO 8601 Extended Format)格式的字符串: YYYY-MM-DDTHH:mm:ss.sssZ。时区总是UTC(协调世界时),加一个后缀“Z”标识。

dateObj.toISOString()

示例:

var today = new Date("05 October 2011 14:48 UTC");
console.log(today.toISOString()); // 返回2011-10-05T14:48:00.000Z

JSON

JSON.parse()

解析一个JSON字符串,构造由字符串描述的JavaScript值或对象。可以提供可选的reviver函数以在返回之前对所得到的对象执行变换。

JSON.parse(text[, reviver])

text:要被解析成JavaSctipt值的字符串,查看 JSON 对象学习的JSON 语法的说明。

reviver: 可选,如果是一个函数,则规定了原始值如何被解析改造,在被返回之前。

示例:

JSON.parse('{"name" : "jesse","age":25 }');//{ name: 'jesse', age: 25 }

JSON.stringfy()

JSON.stringify() 方法将JavaScript值转换为JSON字符串

JSON.stringify(value[, replacer [, space]])

示例:

JSON.stringify({ name: 'jesse', age: 25 });//{"name":"jesse","age":25}

ECMAScript5新特性总结的更多相关文章

  1. ECMASCRIPT5新特性(转载)

    Function 1: Object.create 这是一个很重要的改动,现在我们终于可以得到一个原型链干净的对象了.以前要创建一个类 function Cat(name) { this.name   ...

  2. ECMAScript5新特性之获取对象特有的属性

    'use strict'; // 父类 function Fruit(){ } Fruit.prototype.name = '水果'; // 子类 function Apple(desc){ thi ...

  3. ECMAScript5新特性之isFrozen、freeze

    对象被冻结后: 1 不能添加属性. 2 不能删除属性. 3 不能修改属性.(赋值) 4 不能修改属性描述符.(会抛异常) var fruit = { name : '苹果', desc : '红富士' ...

  4. ECMAScript5新特性之isSealed、seal

    封闭对象后: 1 不能增加属性. 2 不能删除属性. 3 可以修改属性.(赋值) 4 不能修改属性描述符.(抛异常) var fruit = { name : '苹果', desc : '红富士' } ...

  5. ECMAScript5新特性之Object.isExtensible、Object.preventExtensions

    阻止对象扩展后: 1 不能添加属性. 2 可以修改属性的值. 3 可以删除属性. 4 可以修改属性描述符. var fruit = { name : '苹果', desc : '红富士' }; // ...

  6. Atitit js版本es5 es6新特性

    Atitit js版本es5 es6新特性 Es5( es5 其实就是adobe action script的标准化)1 es6新特性1 Es5( es5 其实就是adobe action scrip ...

  7. ECMAScript和JavaScript的区别,ECMAScript发展更新历史,ECMAScript5和ECMAScript6的新特性及浏览器支持情况,ECMAScript 5/ECMAScript 2015正式发布

    ECMAScript和JavaScript的区别 ECMA是European Computer Manufacturers Association的缩写,即欧洲计算机制造商协会.欧洲计算机制造商协会是 ...

  8. ECMAScript 5和ECMAScript6的新特性以及浏览器支持情况

    ECMAScript简介: 它是一种由Ecma国际(前身为欧洲计算机制造商协会)制定和发布的脚本语言规范,javascript在它基础上经行了自己的封装.但通常来说,术语ECMAScript和java ...

  9. javascript004_ECMA5数组新特性

    •对于ECMAscript5这个版本的Array新特性补充: –位置方法:indexOf      lastIndexOf –迭代方法:every  filter   forEach   some   ...

随机推荐

  1. Mac 下使用 brew 安装软件

    官网:http://brew.sh/安装 ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/m ...

  2. 一口一口吃掉Hexo(四)

    如果你想得到更好的阅读效果,请访问我的个人网站 ,版权所有,未经许可不得转载! 人总是不会满足于现状,接下来我们就可以让我们的朋友们通过独立域名访问我们的网站了,但是这肯定是要花点钱的,所以这篇文章难 ...

  3. GO入门——3. 控制语句

    1 if 条件表达式没有括号 支持一个初始化表达式(可以是并行方式) 左大括号必须和条件语句或else在同一行 支持单行模式 初始化语句中的变量为block级别,同时隐藏外部同名变量 a := 1 i ...

  4. CVPR2019 | Mask Scoring R-CNN 论文解读

    Mask Scoring R-CNN CVPR2019 | Mask Scoring R-CNN 论文解读 作者 | 文永亮 研究方向 | 目标检测.GAN 推荐理由: 本文解读的是一篇发表于CVPR ...

  5. css text-align文字两端对齐

    text-align:start | end | left | right | center | justify | match-parent | justify-all justify: 内容两端对 ...

  6. 牛X的规则引擎urule2

    牛X的规则引擎urule2 教程:http://wiki.bsdn.org/pages/viewpage.action?pageId=75071499

  7. ffplay源码分析3-代码框架

    ffplay是FFmpeg工程自带的简单播放器,使用FFmpeg提供的解码器和SDL库进行视频播放.本文基于FFmpeg工程4.1版本进行分析,其中ffplay源码清单如下: https://gith ...

  8. HDU 3613 Best Reward(拓展KMP算法求解)

    题目链接: https://cn.vjudge.net/problem/HDU-3613 After an uphill battle, General Li won a great victory. ...

  9. CentOS6.x服务器OpenSSH平滑升级到7.3p版本——拒绝服务器漏洞攻击

    对于新安装的Linux服务器,默认OpenSSH及OpenSSL都不是最新的,需要进行升级以拒绝服务器漏洞攻击.本次介绍的是升级生产环境下CentOS6.x系列服务器平滑升级OpenSSL及OpenS ...

  10. Angular2-组件间数据传递的两种方式

    Angular2组件间数据传递有多种方式,其中最常用的有两种,一种是配置元数据(或者标签装饰),一种是用单例模块传递:有两个元数据具有传递数据的功能:inputs和outputs. 一.元数据传递 1 ...