首页 > 代码库 > ES5_6_7(1)——ES5
ES5_6_7(1)——ES5
1. ECMA简述
ECMA是脚本语言规范,是由ECMA国际组织制定和发布的脚本语言规范。而 JavaScript 就是其规范的一种实现。当然了,类似的还有其它脚本语言。但习惯性的把术语 ECMAScript 和 JavaScript 表达为同一意思。
2. ECMA5
ECMA5的兼容性对于各个常用浏览器都是兼容的,除了最恶心的IE浏览器。
IE8: 只支持defineProperty,getOwnPropertyDescriptor部分特性及JSON新特性
IE9: 不支持严格模式,其余都可以
IE10:IE10和其它主流浏览器均支持
总结:PC端开发需要注意IE9以下的兼容,但移动端开发时不需要
2.1 严格模式(strict mode)
顾名思义 :使得 JavaScript 在更严格的语法条件下运行。
目的/作用:
消除JavaScript语法的一些不合理、不严谨之处,减少怪异行为
消除代码运行的一些不安全之处,保证代码运行的安全
为未来新版本 JavaScript 做好铺垫
使用:在全局或函数的第一条语句定义为 ‘use strict‘; 如果浏览器不支持,只简析为一条简单的语句,没有任何副作用
全局使用:
‘use scrict‘;
// code...
function scrict() {
‘use scrict‘;
// code...
}
语法和行为改变:
1. 变量的生命必须使用 var 关键字
2. 创建 eval 函数作用域
3. 禁止 this 执行 window 对象
4. 对象不能用重复属性
5. 函数不能有重名的形参
2.2 JSON对象扩展
JSON对象:JSON对象或数组是一个字符串,console.info(json)会打印出字符串
JS对象:JS对象是Object或Array,console.info(obj/arr)会打印出 > Object/Array[]
JSON对象:
JSON.stringify(obj/arr): js对象(或数组)转换为json对象(或数组)
JSON.parse(json): json对象(或数组)转换为js对象(或数组)
2.3 Object对象扩展
ES5给Object扩展了好几个方一些静态方法,举例两个:
Object.create(prototype[, descriptors]):创建一个新对象
1. 以指定对象为原型创建新的对象
2. 指定新的属性,并对属性进行描述
value: 指定值
writable: 标识当前属性是否可修改,默认 true
set: 监视设置当前属性值变化的回调
get: 监视获取当前属性值的回调
var obj = {name: ‘Tom‘, setName: function(name) { this.name = name; }};
var new = Object.create(obj, {
age: {
value: 12,
writable: false,
set: function() { //... },
get: function() { //... }
}
});
Object.defineProperty(object, descriptors):为指定对象定义扩展多个属性
2.4 Array对象扩展
ES5给Array扩展了好几个常用又便捷的方法,常用的有5个:
1. Array.prototype.indexOf(value): 得到值在数组中的第一个下标
2. Array.prototype.lastIndexOf(value): 得到值在数组中的最后一个下标
3. Array.prototype.forEach(function(item, index) {}): 数组遍历
4. Array.prototype.map(function(item, index) {}): 遍历数组,返回一个新的数组
5. Array.prototype.filter(function() {}): 遍历过滤出一个新的子数组
6. Array.prototype.reduce(function() {}[, initialVal]): 将数组的每个值(从左到右)将其降低到一个值
场景: 统计一个数组中有多少个不重复的单词 Reduce方法之前: var arr = ["apple","orange","apple","orange","pear","orange"]; function getWordCnt(){ var obj = {}; for(var i= 0, l = arr.length; i< l; i++){ var item = arr[i]; obj[item] = (obj[item] +1 ) || 1; } return obj; } console.log(getWordCnt()); Reduce方法之后: var arr = ["apple","orange","apple","orange","pear","orange"]; function getWordCnt(){ return arr.reduce(function(prev,next){ prev[next] = (prev[next] + 1) || 1; return prev; },{}); } console.log(getWordCnt()); |
2.5 函数扩展
Function.prototype.bind(obj): 将函数内的 this 绑定为 obj,并将函数返回。
场景: 统计一个数组中有多少个不重复的单词 var name = ‘Window‘; var obj = {name: ‘Tom‘}; setTimeout(function() { console.info(this.name); // Window }, 100); setTimeout(function() { console.info(this.name); // Tom }.bind(obj), 100); |
ES5_6_7(1)——ES5