对象方法拓展
字符串的拓展
.includes()
检查传入的字符串是否在原来的字符串中。返回布尔值
let str = "qwerdf"
str.includes("er") // true
str.includes("qer") //false
.startWith()
检查是不是以传入字符串开始
let str = "qwert"
str.starWith("q") //true
str.starWith("s") //false
.endWith()
检查是不是以传入字符串结束
let str = "qwert"
str.endWith("t") //true
str.endWith("s") //false
.repeat()
返回一个字符串,重复传入数值的次数
"ha".repeat(5) //"hahahahaha"
"哈".repeat(0) //""
数字的拓展
Number.parseInt()
取整 es6 中被置于Number
对象上(静态方法),原全局函数依然存在
parseInt == Number.parseInt //true
Number.parseFloat()
取浮点数并去掉单位 es6 中被置于Number
对象上,原全局函数依然存在
Number.parseFloat == parseFloat //true
Number.isNaN()
严格判断是不是NaN
isNaN(undefined) //true
Number.isNaN(undefined) //false
Number.isIntrger()
判断是否是整数
关于取整:
Number 对象方法:.toFixed(n)
保留小数点后 n 位数,五舍六入,低版本 IE 也支持
Math 对象静态方法:round(f)
ceil(f)
floor(f)
rinc(f)
全局/Number 对象静态方法:parseInt(f)
位运算符组合: ~~f
f|0
只针对正数
数组的拓展
Array.from()
构造函数的方法,将传入的类数组转换为真正数组
Array.from(document.querySelectorAll("div")) //NodeList对象转数组
//其实[...document.querySelectorAll("div")]效果一样
Array.from(document.getElementsByTagName("div")) //HTMLCollection对象转数组
function foo() {
let arg = Array.from(...arguments) //arguments对象
//其实[...arguments]效果一样
}
参数:
第一个参数:类数组对象
第二个参数:生成数组传入每个参数进行的操作,回调函数,接受一个参数就是传入参数的本身
第三个参数: 指定第二个回调函数内部的 this 的指向
Array.of()
构造函数的方法,将一组数值转数组
主要是统一操作的含义
//原Array功能
Array() //[]
Array(2) //[empty × 2] 这里歧义
Array(1, 2, 3) //[1, 2, 3]
//Array.of方法统一了操作
Array.of() //[]
Array.of(3) //[3]
Array.of(1, 2, 3) //[1, 2, 3]
.every()/.some()
每一项/至少存在一项,判断是否满足返回 true
,接受一个回调函数(以参数形式传入的函数,此函数依次接收数组每一项作为参数,返回 true/false)
let arr = [1, 2, 4]
arr.every(function(i) {
return i > 0
}) //true 返回一个结果,对1,2,4判断,都大于0就返回true
//等价写法
arr.every((i) => i > 0) //true 用箭头函数返回
.filter()
将数组中的元素进行筛选,满足条件的元素以数组的形式返回。原数组不变,传入 l 两个参数第一个函数,函数接受三个参数
- 第一个,传入的每一个元素,
- 第二个,传入的每一个元素的下标
- 第三个,数组的本身
函数返回一个布尔值
第二个后面的参数是函数执行时 this 指向的对象
let arr = [1, 3, 2, 23, 135, 43, 5, 34, 45]
arr.filter(function(item, index, thiarr) {
return item > 10
}) //[23, 135, 43, 34, 45] 返回值大于10的数形成数组
arr.filter((item, index, thisarr) => index > 5)
//[5, 34, 45] //返回序号大于5的元素形成的数组
.forEach()
对数组每个元素执行对应的操作,参数类型和 filter 一致,返回 undefined
let arr = [
function() {
console.log("1" + this.name)
},
function() {
console.log("2" + this.name)
},
]
let obj = {
name: "this obj",
}
arr.forEach(function(item) {
item.call(this)
}, obj) //打印"1this obj" "2this obj"
.map()
将数组中的每一项进行操作,然后返回,改变原数组,格式和filter
一致
const arr = [1, 2, 3, 4, 5]
arr.map((i) => 6 - i) //[5, 4, 3, 2, 1]
.reduce()
将数组的每一个值迭代起来,然后返回迭代结果。
let arr = [1, 2, 3, 4]
arr.reduce((a, b) => a + b) //10 此时将每一个加起来
arr.reduce((a, b) => a + b, 3) //13 3作为叠加的第一项
arr.reduce((a, b) => a + b, "") //"1234" ""作为叠加的第一项
将数组每一个元素叠加处理,转换合并再输出,不改变原数组
reduce
接受两个参数,第一个是回调函数,回调函数接受四个参数
- 第一个: 累加的载体
- 第二个: 当前值
- 第三个: 当前索引
- 第四个: 数组本身
第二个参数时回调函数的主体对象
一行代码统计字符串中的相同字母的个数
"asdasdzxczxcaasdasd"
.split("")
.reduce((x, y) => (x[y] ? x[y]++ : (x[y] = 1), x), {})
逗号运算符再表达式中的意义: 表达式会返回逗号后面的值。
.flat()
扁平化数组 参数 depth 默认 1
对象的拓展
属性名值合并
function createObj(x, y) {
return {
x,
y,
} //等价于return {x: x, y: y}
}
let o = createObj(1, 3) //{x: 1, y: 3}
getter
setter
对象中的get
与set
方法,获取元素的值和设置值的不同操作。
let o = {
_value: 10, //加_表示不必建议访问
get value() {
//获取值或进行的操作。
return this._value++
},
set value(val) {
//设置值会进行的操作
this._value -= val
},
}
o.value //10
o.value //11
o.value = 3 //此时o._value已经从12减3了
o.value //9
Object.is()
ES5 比较相等有==
和===
两种,前者会隐式类型转换,后者对于特殊情况比较结果反直觉
比如:
; + 0 === -0 //true
NaN === NaN //false
//而
Object.is(+0, -0) //false
Object.is(NaN, NaN) //true
Object.keys()
返回对象的所有可枚举属性名的数组
let obj = {
a: 1,
b: 2,
c: 3,
}
Object.keys(obj) //["a", "b", "c"]
Object.values()
和Object.entries()
返回可枚举的值或者键值对的数组
const {
keys,
values,
entries
} = Object
let obj = {
a: 1,
b: 2,
c: 3,
}
values(obj) //[1, 2, 3]
for (let [key, value] of entries(obj)) {
console.log([key, value])
}
Object.assign()
复制可枚举属性到目标对象上。返回目标对象
第一个参数是目标对象
第二个以及以后的参数是要复制属性的对象
let target = {
a: 1,
},
o1 = {
a: 2,
b: 2,
},
o2 = {
b: 3,
c: 4,
}
Object.assign(target, o1, o2)
//{a: 2, b: 3, c: 4},后面的相同的属性会把前面的属性覆盖掉
Object.assign(target) === target //true
Object.assign({}, "asd") //{0: "a", 1: "s", 2: "d"} "asd"会以string对象的形式传进去
使用:简化代码书写,添加属性
function Foo(name, value, x, y, vx, vy) {
构造函数
this.name = name
//...很长
}
//使用assign
function Foo(name, value, x, y, vx, vy) {
Object.assign(this, {
name,
value,
x,
y,
vx,
vy,
})
}
new Foo("name", "yinshi", 100, 200, 2, 3) //...
Object.freeze()
对对象进行浅冻结,使其再也不能被修改。
const obj = {
prop: 42,
}
Object.freeze(obj)
obj.prop = 33
// Throws an error in strict mode
但是其内部的引用类型数据依然可以被修改
Object.defineProperty()
设置属性描述符
Object.getOwnPropertyDescriptors()
获取属性描述符
Object.getPrototypeOf()
获取原型属性
Object.creat()
以原型创建对象
放在面向对象以及描述符的章节