ECMAScript 2009 - ES5

ECMAScript 2009，也称为 ES5，是 JavaScript 的第一个主要修订版。

本章描述了 ES5 最重要的特性。

ES5 特性

• "use strict"
• String.trim()
• Array.isArray()
• Array.forEach()
• Array.map()
• Array.filter()
• Array.reduce()
• Array.reduceRight()
• Array.every()
• Array.some()
• Array.indexOf()
• Array.lastIndexOf()
• JSON.parse()
• JSON.stringify()
• Date.now()
• 访问器属性 Getter 和 Setter
• 新的对象属性方法

ES5 语法变化

• 字符串上的属性访问 []
• 数组字面量和对象字面量的最后一个元素可以尾随逗号
• 多行字符串文字

“严格模式”指令

"use strict" 定义 JavaScript 代码应该在“严格模式”下执行。

例如，在严格模式下，您不可以使用未声明的变量。

您可以在所有程序中使用严格模式。它可以帮助您编写更清晰的代码，例如防止您使用未声明的变量。

"use strict" 只是一个字符串表达式。旧浏览器如果不理解它不会抛出错误。

转到JavaScript 严格模式章节中阅读更多内容。

String.trim()

trim() 方法删除字符串两侧的空格，并作为新串返回。

var str = "       Hello World!        ";
alert(str.trim());

请转到 JavaScript 字符串方法章节阅读更多内容。

Array.isArray()

Array.isArray() 方法检查对象是否为数组。

function myFunction() {
  var fruits = ["Banana", "Orange", "Apple", "Mango"];
  var x = document.getElementById("demo");
  x.innerHTML = Array.isArray(fruits);
}

请转到 JavaScript 数组中阅读更多内容。

Array.forEach()

Array.forEach() 方法为每个数组元素调用一次指定的回调函数。

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value) {
  txt = txt + value + "<br>";
}

请转到在 JavaScript 数组遍历章节了解更多信息。

Array.map()

此示例将每个数组值乘以 2：

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);

function myFunction(value) {
  return value * 2;
}

请转到在 JavaScript 数组遍历章节了解更多信息。

Array.filter()

此示例从值大于 18 的元素创建一个新数组：

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);

function myFunction(value) {
  return value > 18;
}

请转到在 JavaScript 数组遍历章节了解更多信息。

数组.reduce()

此示例汇总数组中所有数字的总和：

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value) {
  return total + value;
}

请转到在 JavaScript 数组遍历章节了解更多信息。

Array.reduceRight()

此示例还查找数组中所有数字的总和：

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);

function myFunction(total, value) {
  return total + value;
}

请转到在 JavaScript 数组遍历章节了解更多信息。

Array.every()

此示例检查所有值是否都超过 18：

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);

function myFunction(value) {
  return value > 18;
}

请转到在 JavaScript 数组遍历章节了解更多信息。

数组.some()

此示例检查某些值是否超过 18：

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.some(myFunction);

function myFunction(value) {
  return value > 18;
}

请转到在 JavaScript 数组遍历章节了解更多信息。

Array.indexOf()

在数组中搜索元素值并返回其位置。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");

请转到在 JavaScript 数组遍历章节了解更多信息。

Array.lastIndexOf()

Array.lastIndexOf() 与 相同 Array.indexOf() ，但从数组末尾开始搜索。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");

请转到在 JavaScript 数组遍历章节了解更多信息。

JSON.parse()

JSON 的一个常见用途是作为网页和 Web 服务器之间数据交换的数据格式，我们需要将从服务器接受的 json 字符串转为 JavaScript 对象。

假设您从 Web 服务器收到此文本字符串：

'{"name":"John", "age":30, "city":"New York"}';

函数 JSON.parse() 用于将文本转换为 JavaScript 对象：

var obj = JSON.parse('{"name":"John", "age":30, "city":"New York"}');

请转到在 JavaScript JSON章节了解更多信息。

JSON.stringify()

JSON 的一个常见用途是作为网页和 Web 服务器之间数据交换的数据格式，我们需要将 JavaScript 对象转为 json 字符串发送到服务器。

想象一下我们在 JavaScript 中有这个对象：

var obj = { name: "John", age: 30, city: "New York" };

使用 JSON.stringify() 将其转换为字符串。

var myJSON = JSON.stringify(obj);

结果将是一个 JSON 格式的字符串。

myJSON 现在是一个字符串，可以发送到服务器：

var obj = { name: "John", age: 30, city: "New York" };
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;

请转到在 JavaScript JSON章节了解更多信息。

Date.now()

Date.now() 返回自零时间（UTC 时间 1970 年 1 月 1 日 00:00:00）以来的毫秒数。

var timInMSs = Date.now();

请转到在 JavaScript 日期章节了解更多信息。

访问器属性

ES5 允许您使用 get 和 set 关键字为对象增加访问器属性。

本示例创建一个读取属性 fullName：

var person = {
  firstName: "John",
  lastName: "Doe",
  get fullName() {
    return this.firstName + " " + this.lastName;
  },
};

document.getElementById("demo").innerHTML = person.fullName;

此示例为 language 属性创建一个访问器属性 lang：

var person = {
  firstName: "John",
  lastName: "Doe",
  language: "NO",
  get lang() {
    return this.language;
  },
  set lang(value) {
    this.language = value;
  },
};

person.lang = "en";

document.getElementById("demo").innerHTML = person.lang;

此示例使用 setter 来保证语言的值都是大写的：

var person = {
  firstName: "John",
  lastName: "Doe",
  language: "NO",
  set lang(value) {
    this.language = value.toUpperCase();
  },
};

person.lang = "en";

document.getElementById("demo").innerHTML = person.language;

请转到在 JavaScript 对象访问器属性章节了解更多信息。

ES5 新对象方法

ES5 为 JavaScript 添加了很多新的对象方法：

• Object.defineProperty(object, property, descriptor): 添加或修改一个对象属性
• Object.defineProperties(object, descriptors): 添加或修改多个对象属性
• Object.getOwnPropertyDescriptor(object, property): 返回对象上一个自有属性对应的属性描述符
• Object.getOwnPropertyNames(object): 返回一个包含所有自身属性的数组
• Object.keys(object): 返回对象的自身可枚举属性组成的数组
• Object.getPrototypeOf(object): 返回指定对象的原型
• Object.preventExtensions(object): 让一个对象不可扩展，也就是不能再添加新的属性
• Object.isExtensible(object): 判断一个对象是否是可扩展的
• Object.seal(object): 封闭一个对象，阻止添加新属性并将所有现有属性标记为不可配置
• Object.isSealed(object): 判断一个对象是否被封闭
• Object.freeze(object): 冻结一个对象，一个被冻结的对象再也不能被修改
• Object.isFrozen(object): 判断一个对象是否被冻结

请转到在 JavaScript Object 方法章节了解更多信息。

字符串的属性访问

charAt() 方法返回字符串中指定索引（位置）处的字符：

var str = "HELLO WORLD";
str.charAt(0); // 返回 H

ES5 允许对字符串进行属性访问：

var str = "HELLO WORLD";
str[0]; // 返回 H

请转到在 JavaScript 字符串方法章节了解更多信息。

尾随逗号

ES5 允许在对象和数组定义中使用尾随逗号：

对象示例：

person = {
  firstName: "John",
  lastName: " Doe",
  age: 46,
};

数组示例：

points = [1, 5, 10, 25, 40, 100,];

!! 警告：JSON 不允许尾随逗号。

多行字符串

如果用反斜杠转义，ES5 允许多行字符串文字：

"Hello \
Dolly!";

较旧的浏览器可能会以不同的方式处理反斜杠周围的空格。一些较旧的浏览器不允许 \ 后面有空格。

分解字符串文字的一种更安全的方法是使用字符串拼接：

"Hello " + 
"Dolly!";

保留字作为属性名称

ES5 允许使用关键字作为属性名称：

var obj = { name: "John", new: "yes" };

ES5 的浏览器支持

Chrome 23、IE 10 和 Safari 6 是首批完全支持 ES5 的浏览器：