宽屏
1. 创建对象三种方式
1. 利用对象字面量创建对象
const o = {
name: '佩奇'
}2. 利用 new Object 创建对象
const o = new Object({name: '佩奇'})
console.log(o)3. 利用构造函数创建对象
2. 构造函数
构造函数 :是一种特殊的函数,主要用来初始化对象
使用场景:常规的 {...} 语法允许创建一个对象。比如我们创建了佩奇的对象,继续创建乔治的对象还需要重新写一遍,此时可以通过构造函数来快速创建多个类似的对象。
// 创建佩奇对象
const Peppa = {
name: '佩奇',
age: 6,
gender: '女'
}
// 创建乔治对象
const George = {
name: '乔治',
age: 3,
gender: '男'
}
// 创建猪妈妈的对象
const Mum = {
name: '猪妈妈',
age: 30,
gender: '女'
}
// 创建猪爸爸的对象
const Dad = {
name: '猪爸爸',
age: 32,
gender: '男'
}构造函数在技术上是常规函数。
不过有两个约定:
1. 它们的命名以大写字母开头。
2. 它们只能由 "new" 操作符来执行。
function Pig(name, age, gender) {
this.name = name
this.age = age
this.gener = gender
}
// 创建佩奇对象
const Peppa = new Pig('佩奇', 6, '女')
// 创建乔治对象
const George = new Pig('乔治', 3, '男')
// 创建猪妈妈对象
const Mum = new Pig('猪妈妈', 30, '女')
// 创建猪爸爸对象
const Dad = new Pig('猪爸爸', 32, '女')构造函数语法:大写字母开头的函数
创建构造函数:
// 1、创建构造函数
function Pig(name) {
this.name = name
}
// 2、new 关键字调用函数
// new Pig('佩奇')
// 接受创建的对象
const peppa = new Pig('佩奇')
console.log(peppa)说明:
1. 使用 new 关键字调用函数的行为被称为实例化
2. 实例化构造函数时没有参数时可以省略 ()
3. 构造函数内部无需写return,返回值即为新创建的对象
4. 构造函数内部的 return 返回的值无效,所以不要写return
5. new Object() new Date() 也是实例化构造函数
实例化执行过程
1. 创建新对象
2. 构造函数this指向新对象
3. 执行构造函数代码,修改this,添加新的属性
4. 返回新对象
3. 实例成员&静态成员
实例成员:
通过构造函数创建的对象称为实例对象,实例对象中的属性和方法称为实例成员。
// 构造函数
function Person() {
// 构造函数内部的 this 就是实例对象
// 实例对象中动态添加属性
this.name = '小明'
//实例对象动态添加方法
this.sayHi = function () {
console.log('大家好~')
}
}
// 实例化,p1 是实例对象
// p1 实际就是 构造函数内部的 this
const p1 = new Person( )
console.log(p1)
console.log(p1.name) // 访问实例属性
p1.sayHi() // 调用实例方法说明:
1. 实例对象的属性和方法即为实例成员
2. 为构造函数传入参数,动态创建结构相同但值不同的对象
3. 构造函数创建的实例对象彼此独立互不影响。
静态成员:
构造函数的属性和方法被称为静态成员
//构造函数
function Person(name, age) {
// 省略实例成员
}
// 静态属性
Person.eyes = 2
Person.arms = 2
// 静态方法
Person.walk = function () {
console.log('^^人都会走路...')
// this 指向 Person
console.log(this.eyes)
}
Person.walk()说明:
1. 构造函数的属性和方法被称为静态成员
2. 一般公共特征的属性或方法静态成员设置为静态成员
3. 静态成员方法中的 this 指向构造函数本身