【JS】内置函数

60 阅读3分钟

本文所列举函数为常用函数,分别隶属 ES5 或 ES6(特别是数组相关函数),且“成对”情况下会忽略,如:lastIndexOf()。(PS:一般情况下,lastIndexOf()会与indexOf()共同存在)

一、全局函数

// 将字符串中的数字部分转换成数字,以字符截止。
// 可用于去除小数。若首字符不是数字,得 NaN
parseInt(str)
​
// 将字符串转换成数字。若字符串中包含非数字,得`NaN`
Number(str)
​
str.slice(i)    // 截取字符串
eval(str)   // 将字符串作为JS脚本执行
type(a)     // 返回变量类型。同指令`type a`// 对URL进行编码或解码。作用于不属于URI的特殊字符,如:特殊符号、汉字
encodeURI/decodeURI(url)
// 对URL进行编码或解码。作用对象于任何非标准字符(即非字母)
encodeURIComponent/decodeURIComponent(url)

三、数组相关函数

注:以下函数中,i代表索引,e代表元素。

Array.of(a, b, ...)     // 类似Java中的 Arrays.asList()
Array.from(obj)     // 将 obj 按照一定规则转化成数组。obj 可以是数组、对象// 增强for
for(let i in arr)   // arr 可以是数组或对象
for(let e of arr)   // arr 只能是数组
arr.forEach((e, i) => {})
​
// 返回匹配的第一个元素的下标
arr.indexOf(x)
arr.findIndex(e => {})
arr.find(e => {})   // 返回满足条件的第一个元素,条件由函数内自定义,找不到返回 undefined
arr.includes(xx)    // 类似 indexOf()
​
arr.copyWithin(a, b, c)     // 将arr中,[b,c) 的元素复制到arr的 a 位置

Array.from(obj)

1:转化数组。

let arr = Array.from([1, 2, 3])
console.log(arr);// [ 1, 2, 3 ]

2:转化对象。

let obj = {
    id: 1,
    name: 'yc'
}
obj = Array.from(obj)
console.log(obj);// []
​
obj = {
    0: 1,
    1: 'yc',
    length: 2
}
obj = Array.from(obj)
console.log(obj);// [ 1, 'yc' ]

由于数组的打印结果与对象相似,在满足以下两个条件的情况下,Array.from()可将对象转化成数组:

  1. 对象属性名改为下标;
  2. 添加属性length,值为属性数。

满足条件的对象一般称为“对象数组”。

3:转化标签数组。

有5个按钮:

在这里插入图片描述

获取并遍历:

let tags = document.getElementsByTagName('button')
for(let i in tags)
    console.log(tags[i])

打印结果:

在这里插入图片描述

可见,多出了最后两个“额外”信息,这是标签数组本身自带的,与遍历无关。可是,若遍历中存在“标签操作”(如:设置标签属性),则会报错。

解决方案:

let tags = document.getElementsByTagName('button')
tags = Array.from(tags)
for(let i in tags)
    console.log(tags[i])

打印结果:

在这里插入图片描述

这样就可以去掉“额外”信息。

arr.find(item => {})

业务:返回满足条件的第一个元素,条件由函数内自定义。遍历时以true(满足条件)作为结束,若数组中无满足条件的元素或使用了return false,返回undefined。(注:item 是数组元素,遍历时作为参数传入函数,并作为返回值)

1:查找普通数组。

let arr = Array.of(10, 20, 30)
let e = arr.find(item => {
    return item > '10'
})
console.log(e);// 20

可见,JS中在比较时忽略数据类型。

2:查找对象数组。

var platform = [{
    id: 1,
    name: 'C站'
}, {
    id: 2,
    name: 'B站'
}]
​
var e = platform.find(item => {
    if(item.id == '1')
        return true
})
console.log(e)// { id: 1, name: 'C站' }
​
e = platform.find(item => {
    if (item.id == '1')
        return false
})
console.log(e)// undefined

arr.copyWithin(a, b, c)

示例:

let arr1 = Array.of(2, 3, 4, 5, 6)
arr1.copyWithin(1, 3, 5)
console.log(arr1)// [ 2, 5, 6, 5, 6 ]
let arr1 = Array.of(2, 3, 4, 5, 6)
arr1.copyWithin(1, 3, 4)
console.log(arr1)// [ 2, 5, 4, 5, 6 ]

本文持续更新中。。。