构造函数&数据常用函数

最新推荐文章于 2024-07-19 15:13:24 发布

程序员校花

最新推荐文章于 2024-07-19 15:13:24 发布

阅读量90

点赞数

分类专栏： JavaScript 文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/IPAD2030/article/details/131612775

版权

JavaScript 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

深入对象

创建对象方式

使用对象字面量创建对象

使用 new Object 创建对象，示例代码如下：

const obj = new Object( {age: '18'} )
obj.uname = '校花'
console.log(obj)

使用构造函数创建对象

构造函数

使用场景：通过构造函数快速创建多个类似的对象
本质上是普通函数，不过有 2 个约定：
- 命名以大写字母开头
- 只能由 new 操作符来执行
构造函数内部无需写 return ，返回值即为新创建的对象

示例代码如下：

function Pig(uname, age) {
    this.uname = uname
    this.age = age
}

const p = new Pig('佩奇', 6)
const q = new Pig('乔治', 3)

实例化执行过程

创建新的空对象
构造函数 this 指向新对象
执行构造函数代码，使用 this 追加新的属性
返回新对象

实例成员&静态成员

实例成员：通过构造函数创建的对象称为实例对象，实例对象中的属性和方法称为实例成员
静态成员：构造函数的属性和方法称为静态成员

内置构造函数

在 JavaScript 中最主要的数据类型有 6 种：

基本数据类型：
1. 字符串
2. 数值
3. 布尔
4. undefined
5. null
引用类型：对象

基本数据类型也有专门的构造函数，称为包装类型
在声明赋值一个基本数据类型时，js 底层会自动把它转为包装类型

Object

3 个常用的静态方法（静态方法只有构造函数 Object 可以调用）

keys

Object.keys 静态方法获取对象中所有属性（键）
返回的是一个数组

示例代码如下：

const o = { uname: '校花', age: 18}
// 获得所有的属性名
console.log(Object.keys(o)) // 返回数组

values

Object.values 静态方法获取对象中所有属性值
返回的是一个数组

示例代码如下：

const o = { uname: '校花', age: 18}
console.log(Object.values(o)) // 返回数组

assign

作用：Object. assign 静态方法用于对象拷贝，是浅拷贝
- 如果对象的属性值为基本数据类型，拷贝得到的新对象为深拷贝
- 如果对象的属性为对象，拷贝得到的新对象为浅拷贝
使用场景：给对象添加属性

示例代码如下：

const xh = {uname: '校花', age: 18}
Object.assign( xh, {gender: '男'} )

Array

reduce 实例函数的作用是返回累计处理的结果，经常用于求和等

基本语法如下：

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

参数：初始值可以省略，如果写就作为第一次累计的初始值
执行过程如下：
1. 如果没有初始值，则上一次值为数组第一个元素的值
2. 每一次循环，把返回值给下一次循环的上一次值
3. 如果有初始值，则初始值作为上一次值

示例代码如下：

const arr = [1, 5, 8]

// 没有初始值
const total1 = arr.reduce(function (prev, current) {
    return prev + current
})

console.log(total1) // 14

// 有初始值
const total2 = arr.reduce((prev, current) => prev + current, 10)
console.log(total2) // 24