ECMAScript 2009 - ES5
ES5(ECMAScript 2009) 是 JavaScript 的第一个主要修订版, 本文整理了 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 的浏览器:
Chrome | IE/Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome 23 | IE10 / Edge | Firefox 21 | Safari 6 | Opera 15 |
2012-09 | 2012-09 | 2013-04 | 2012-07 | 2013-07 |