JavaScript 构造函数(基于构造函数创建对象,理解实例化过程)&& 深入对象 (对象数组字符数字等类型的常见属性和方法)

深入对象

• 创建对象三种方式:

1. 利用对象字面量创建对象

  <script>

    const i ={

      name:'佩奇'

    }

  </script>

2. 利用 new Object 创建对象

 <script>

   const i = new Object({name:'佩奇'})

   console.log(i); //{name:'佩奇'}

  </script>

3. 利用构造函数创建对象

这里首先要明白构造函数是什么:构造函数 :是一种特殊的函数,主要用来初始化对象

构造函数的使用场景:常规的 {...} 语法允许创建一个对象。比如我们创建了佩奇的对象,继续创建乔治的对象还需要重新写一 遍,此时可以通过构造函数来快速创建多个类似的对象

 <script>

    function Pig(name, age, gender) {

      this.name = name

      this.age = age

      this.gender = gender

    }

    // 创建佩奇对象

    const Peppa = new Pig('佩奇',6,'女')

    // 创建乔治对象

    const George = new Pig('乔治',3,'男')

    // 创建猪妈妈对象

    const Mum = new Pig('猪妈妈',30,'女')

    // 创建猪爸爸对象

    const Dad = new Pig('猪爸爸',32,'男')

    console.log(Peppa); //age: 6, gender: "女", name: "佩奇"

  </script>

构造函数在技术上是常规函数。 不过有两个约定:

1. 它们的命名以大写字母开头。

2. 它们只能由 "new" 操作符来执行

说明:

1. 使用 new 关键字调用函数的行为被称为实例化

2. 实例化构造函数时没有参数时可以省略 ()

3. 构造函数内部无需写return,返回值即为新创建的对象

4. 构造函数内部的 return 返回的值无效,所以不要写return

5. new Object() new Date() 也是实例化构造函数

构造函数的实例化执行过程:

 1. 创建新对象

2. 构造函数this指向新对象

3. 执行构造函数代码,修改this,添加新的属性

4. 返回新对象

构造函数的实例成员: 通过构造函数创建的对象称为实例对象,实例对象中的属性和方法称为实例成员。

1. 实例对象的属性和方法即为实例成员

2. 为构造函数传入参数,动态创建结构相同但值不同的对象

3. 构造函数创建的实例对象彼此独立互不影响

构造函数的静态成员: 构造函数的属性和方法被称为静态成员

1. 构造函数的属性和方法被称为静态成员

2. 一般公共特征的属性或方法静态成员设置为静态成员

3. 静态成员方法中的 this 指向构造函数本身

 内置构造函数

在 JavaScript 中最主要的数据类型有 6 种: 基本数据类型:字符串、数值、布尔、undefined、null 引用类型:  对象 但是,我们会发现有些特殊情况:

  <script>

  //  普通字符串

  const str = 'andy'

  console.log(str.length); //4

  </script>

其实字符串、数值、布尔、等基本类型也都有专门的构造函数,这些我们称为包装类型。 JS中几乎所有的数据都可以基于构成函数创建

引用类型 : Object,Array,RegExp,Date 等

包装类型 : String,Number,Boolean 等

Object:

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

  <script>

// 通过构造函数创建普通对象

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

  </script>

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

Array

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

  <script>

const arr = new Array(3,5)

console.log(arr); //[3,5]

  </script>

创建数组建议使用字面量创建,不用 Array构造函数创建

String

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

  <script>

// 字符串类型

const str ='hello'

// 统计字符的长度(字符数量)

console.log(str.length);

// 数值类型

const price = 12.345

// 保留两位小数

price.toFixed(2)

  </script>

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

Number

Number 是内置的构造函数,用于创建数值 常用方法: toFixed() 设置保留小数位的长度

<script>

// 数值类型

const price = 12.345

// 保留两位小数 四舍五入

console.log(price.toFixed(2)); //12.35

  </script>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值