一、JSON拓展
1、JSON.parse(str,fun):将JSON字符串转为js对象
两个参数:str表示要处理的字符串;fun处理函数,函数有两个参数,属性名、属性值
1 // 定义json字符串 2 var str = '{"a": 1, "b": "2", "c": {"d": 3}}' 3 // 转为对象 4 var obj = JSON.parse(str, function(key, value) { 5 // console.log(this, arguments) 6 // 我们要把所有的字符串转为数字 7 if (typeof value === "string") { 8 // 转为数字 9 return +value; 10 } 11 return value; 12 });
2、JSON.stringify(obj,fun)将js对象转为JSON字符串
两个参数:obj表示要处理的对象,fun表示处理函数,函数有两个参数,属性名、属性值
// 定义js对象 var obj = { a: 1, b: "2", c: { d: 3 } } // 将对象转为字符串 var str = JSON.stringify(obj, function(key, value) { // console.log(this, arguments) // 将字符串转为数字 if (typeof value === "string") { return +value } return value })
二、数组拓展
1、forEach()循环数组
用法:arr.forEach(function(key,index,arr){})
接收一个参数,是一个函数
函数有三个参数:第一个key表示成员值,第二个index表示索引值,第三个arr表示原数组
forEach()返回值无效,始终是undefined
var arr = [1,2,3,4,5,6,7,8,9]; arr.forEach(function(key,idx,arr) { console.log(key,idx) })
2、map()循环数组,使用方法和forEach类似,区别是返回值有效
用法:arr.map(function(key,index,arr){})
接收一个参数,是一个函数
函数有三个参数:第一个key表示成员值,第二个index表示索引值,第三个arr表示原数组
返回值:根据函数内部的返回条件,返回新数组
var arr = [1,2,3,4,5,6,7,8,9]; var result = arr.map(function(key,idx,arr) { return key * 3 }) console.log(result)//返回[3,6,9,12,15,18,21,24,27] console.log(arr)
3、some()判断数组中是否有成员满足条件
用法:arr.some(function(key,index,arr){})
接收一个参数,是一个函数
函数有三个参数:第一个key表示成员值,第二个index表示索引值,第三个arr表示原数组
返回值:布尔值
1 var arr = [1,2,3,4,5,6,7,8,9]; 2 var result = arr.some(function(key,idx,arr) { 3 //return key === 2;//检测数组里面是否有数字2 4 return typeof key === "string";//检测数组里面是否有字符串 5 }) 6 console.log(result)
4、every()判断数组中所有成员是否满足条件
用法:arr.every(function(key,index,arr){})
接收一个参数,是一个函数
函数有三个参数:第一个key表示成员值,第二个index表示索引值,第三个arr表示原数组
返回值:布尔值
var arr = [1,2,3,4,5,6,7,8,9]; var result = arr.every(function(key,idx,arr) { return typeof key === "number";//检测数组中所有的值是否都是数字类型 }) console.log(result)
5、fill()填充数组的方法
用法:arr.fill()
返回值:原数组,原数组会发生改变
var arr = new Array(5)//创建一个长度为5的数组 arr.fill(2)//用2填充数组
6、reduce()累加方法
该方法是从前往后累加,对所有成员逐一处理,将结果返回
reduce()从第二个成员开始遍历,第一个成员作为第一次遍历的第一个参数传递
接收一个参数,是一个函数
函数有四个参数:第一个是上次累加的结果,第二个是当前成员值,第三个是当前索引值,第四个是原数组
返回值:累加的结果
累加的结果将会在下一次执行的时候作为第一个参数传递
// 定义数组 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; // 求相加的结果 var result = arr.reduce(function(pre, key, index, arr) { // console.log(arguments)
console.log(pre,key,index)
return pre + key }) // 输出结果 console.log(result)
7、reduceRight()累加方法
该方法是从后往前累加,对所有成员逐一处理,将结果返回
reduceRight()从倒数第二个成员开始遍历,倒数第一个成员作为第一次遍历的第一个参数传递
接收一个参数,是一个函数
函数有四个参数:第一个是上一次的累加结果,第二个是当前成员值,第三个是当前索引值,第四个是原数组
返回值:累加的结果
累加的结果将会在下一次执行的时候作为第一个参数传递
// 定义数组 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; // 求乘积 var result = arr.reduceRight(function(pre, key, index, arr) { //console.log(arguments) console.log(pre,key,index) return pre * key }) // 输出结果 console.log(result)
8、indexOf()检索,获取成员索引值
从前往后查找
参数:要检索的成员
返回值:被查找的成员下标,如果不存在返回-1
var arr1 = [1,2,3,4,5,3,2,4] console.log(arr1.indexOf(2))//从前往后查找,输出1
9、lastIndexOf()检索,获取成员索引值
从后往前查找,下标永远是从左面开始计数,但是查找时是从后面开始找,返回第一个匹配的下标
参数:要检索的成员
返回值:被查找的成员下标,如果不存在返回-1
var arr1 = [1,2,3,4,5,3,2,4] console.log(arr1.lastIndexOf(2))//从后往前查找,输出6
10、filter()过滤
用法:arr.filter(function(key,index,arr){})
接收一个参数,是一个函数
函数有三个参数:第一个key表示成员值,第二个index表示索引值,第三个arr表示原数
返回值:满足条件的数据组成的新数组
// 定义数组 var arr = ["a", "b", "c", "d", 1, 2, 3, 4, 5]; var result = arr.filter(function(value, index, arr) { return typeof value === "string" }) console.log(result)
11、isArray()判断数组
参数:要判断的数组
用法:Array.isArray(arr)
判断数组的几种方式:
①arr instanceOf Array
②arr.constructor ===Array
③Object.prototype.toString.call(arr) === "[object Array]"
④Array.isArray(arr)
三、对象拓展(控制对象状态)
1、取消可拓展性,不能再添加新的属性
Object.preventExtensions(obj)
参数:obj表示要处理的对象
查看对象是否取消了可拓展性
Object.isExtensible(obj)
取消可拓展性之后仍然可以删除、修改属性
2、封闭方法
Object.seal(obj)
参数:obj表示要处理的对象
查看对象是否是封闭状态
Object.isSeal(obj)
封闭之后只能修改,不能添加、删除属性
3、冻结方法
Object.freeze(obj)
参数:obj表示要处理的对象
查看对象是否是冻结状态
Object.isfrozen(obj)
冻结状态的对象,不能添加、修改、删除属性
四、对象特性(控制对象中一个属性的状态)
Object.defineProperty(obj,property,option)
参数:obj:要设置的对象
property:要设置的属性名
option:要设置的属性对象
1、特性——值
定义方式:Object.defineProperty(obj,property,{
value:""
})
var obj = { color: "blue" } // 设置特性 Object.defineProperty(obj, "color", { // 设置属性值 value: "red" })
使用es5定义的属性值的时候,特性对象里面默认是false,
如果使用的es3.1定义的对象, 并且对象中默认已经存在相应属性, 这个时候特性配置对象全部默认是true
2、特性——可修改性
定义方式:Object.defineProperty(obj,property,{
writable:false//不可修改
})
var obj = { color: "blue" } // 定义特性 Object.defineProperty(obj, "color", { // 设置可修改性为false writable: false }) // 尝试修改obj.color obj.color = "red"; // 输出 obj console.log(obj) // 此时,无法改变color的属性值, 因为设置了writable 为false
3、特性——可枚举性
定义方式:Object.defineProperty(obj,property,{
enumerable:false//不可枚举
})
var obj = { color: "blue" } // 设置特性 Object.defineProperty(obj, "color", { // 设置可枚举性为false enumerable: false }) // 循环输出 for (var i in obj) { console.log(i) } // 设置了特性之后, 不能循环显示出color
4、特性——可配置性
定义方式:Object.defineProperty(obj,property,{
configurable:false//不可配置
})
var obj = { color: "blue" } // 定义特性 Object.defineProperty(obj, "color", { // 设置可修改性为false writable: false, // 设置可配置性为false configurable: false }) // 尝试修改obj.color // obj.color = "red" // // 输出 // console.log(obj) // 尝试再次配置 Object.defineProperty(obj, "color", { writable: true })
当配置了configurable为false之后
如果同时设置writable为false, 将不可以再次修改writable为true
如果同时设置writable为true, 将可以再次修改writable为false
不论设不设置enumerable, 都不可以再次修改enumerable
5、get和set
get是一个隐藏函数,在获取属性值时调用。set也是一个隐藏函数,在设置属性值时调用,它们的默认值都是undefined。Object.definedProperty()中的get和set对应于对象字面量中get和set方法。
一般get和set成对出现
var obj = { color: "red" } Object.defineProperty(obj, "color", { get: function() { // 备份属性值 console.log("读取完成") return this._color; }, set: function(value) { // 设置备份属性值 console.log("设置完成") return this._color = value; } })