JavaScript常用的内置构造函数

青青青青草地

于 2024-06-11 16:42:01 发布

阅读量817

点赞数 28

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/2301_79614379/article/details/139602166

版权

内置构造函数

JavaScript底层会把简单数据类型包装为引用数据类型，所以简单数据类型也可以使用属性和方法方法。

const str = 'lily' // 相当于const str = new String('lily')
console.log(str.length) // 4

引用类型：Object，Array，RegExp，Date等
包装类型：String，Number，Boolean等

Object

Object是内置的构造函数，用于创建普通对象。

const user = new Object({name: 'lily', age: 18})

推荐使用字面量方式声明对象，而不是Object构造函数。

常用静态方法——Object.keys

作用：Object.keys静态方法获取对象中所有属性名

语法：

const obj = {name: 'lily', age: 19}
console.log(Object.keys(obj)) // ['name', 'age']

注意：返回的是一个数组。

常用静态方法——Object.values

作用：Object.values静态方法获取对象中所有属性值

语法：

const obj = {name: 'lily', age: 19}
console.log(Object.keys(obj)) // ['lily', '19']

注意：返回的是一个数组。

常用静态方法——Object.assign

作用：Object.assign静态方法常用于对象拷贝

使用：经常使用的场景给对象添加属性

const obj = {name: 'lily', age: 19}
Object.assign(obj, {gender: '女'})
console.log(o) // {name: 'lily', age: 19, gender: '女'}

Array

Array是内置的构造函数，用于创建数组。

const arr = new Array(3, 5)
console.log(arr) // [3, 5]

创建数组建议使用字面量创建。

数组常见示例方法——核心方法

方法	作用	说明
forEach	遍历数组	不返回数组，经常用于查找遍历数组元素
filter	过滤数组	返回新数组，返回的是筛选满足条件的数组元素
map	迭代数组	返回新数组，返回的是处理之后的数组元素，想要使用返回的新数组
reduce	累计器	返回累计处理的结果，经常用于求和等

reduce方法

基本语法：

arr.reduce(function(上一次值, 当前值){}, 初始值)

参数：如果有起始值，则把初始值累加到里面

// 没有初始值
const arr = [1, 5, 8]
const total1 = arr.reduce(function(p, q) {
    return p + q
})
console.log(total1) // 14
// 有初始值
const total2 = arr.reduce(function(p, q) {
    return p + q
}, 10)
console.log(total2) // 24

reduce执行过程：

如果没有起始值，则上一次值以数组的第一个数组元素的值
每一次循环，把返回值给作为下一次循环的上一次值
如果有起始值，则起始值作为上一次值

案例——计算薪资

	const obj = [
      {
        name: 'lily',
        salary: 1000
      },
      {
        name: 'Tom',
        salary: 1200
      },
      {
        name: 'Jack',
        salary: 1300
      },
      {
        name: 'Amy',
        salary: 1060
      },
      {
        name: 'Lisa',
        salary: 1500
      }
    ]
    const total = obj.reduce((p, q) => p + q.salary, 0)
    console.log(total)

数组常见示例方法——其他方法

方法	说明
join	将数组元素拼接为字符串，返回字符串
find	查找元素，返回符合测试条件的第一个数组元素值，如果没有符合条件的返回undefined
every	检测数组所有元素都是否符合指定条件，如果所有元素都通过检测返回true，否则返回false
some	检测数组中是否有元素满足指定条件，有则返回true，否则返回false
concat	合并两个数组，返回生成新的数组
sort	对原数组单元值排序
splice	删除或替换原数组单元
reverse	反转数组
findIndex	查找元素的索引值

find方法

    const obj = [
      {
        name: 'lily',
        salary: 1000
      },
      {
        name: 'Tom',
        salary: 1200
      },
      {
        name: 'Jack',
        salary: 1300
      },
      {
        name: 'Amy',
        salary: 1060
      },
      {
        name: 'Lisa',
        salary: 1500
      }
    ]
    console.log(obj.find((item) => item.name === 'Lisa')) // 用来查找对象

every方法

const arr1 = [10, 20, 30]
console.log(arr1.every((item) => item >= 10)) // true
console.log(arr1.every((item) => item > 10)) // false

静态方法——Array.from()

作用：将伪数组转化为真数组

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <ul>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
  </ul>
  <script>
    const li = document.querySelectorAll('li') // 获得一个伪数组
    const list = Array.from(li)
    list.pop() // 伪数组没有这个方法
    console.log(list)
  </script>
</body>

</html>

String

在JavaScript中的字符串、数字、布尔具有对象的使用特征，如具有属性和方法。

之所以具有对象特征的原因是字符串、数字、布尔类型数据是JavaScript底层使用Object构造函数“包装”来的，被称为包装类型。

常见实例方法

方法	作用
实例方法toUpperCase()	用于将字母转换成大写
实例方法toLowerCase()	用于将字母转换成小写
实例方法indexOf()	检测是否包含某字符
实例方法endsWith()	检测是否以某字符结尾
实例方法replace()	用于替换字符串，支持正则匹配
实例方法match()	用于查找字符串，支持正则匹配

split()方法

作用：用来将字符串拆分成数组。

语法：split('分隔符')

const str = 'red,blue'
const arr = str.split(',')
console.log(arr) // ['red', 'blue']
const str1 = '2024-6-7'
const arr1 = str1.split('-')
console.log(arr1) // ['2024', '6', '7']

substring()方法

作用：用于字符串截取。

语法：substring(需要截取的第一个字符的索引, 结束的索引)，如果省略结束的索引，默认取到最后，截取的索引号不包含想要截取的部分。

startsWith()方法

作用：判断是不是以某个字符开头。

const str = 'let go'
console.log(str.startsWith('let')) // true

includes()方法

作用：判断一个字符串是否包含在另一个字符串当中。

const str = 'To be, or not to be, that is the question.'
console.log(str.includes('To be')) // true
console.log(str.includes('To bE')) // false 严格区分大小写
console.log(str.includes('To be', 1)) // false 从第二个字符起开始寻找，不存在该字符串

Number

Number是内置的构造函数，用于创建数值。

常用方法——toFixed()

作用：设置保留小数位的长度。

const num = 10.825
console.log(num.toFixed(2)) // 10.83 四舍五入
console.log(num.toFixed(4)) // 10.8250 补零