学习目标：
- 掌握深入对象
学习内容：
- 创建对象三种方式
- 构造函数
- 实例成员&静态成员
创建对象三种方式：
- 利用对象字面量创建对象
const o = {
name: '佩奇'
}
- 利用
new Object创建对象
const obj = new Object({ uname: '雪碧宝宝' })
console.log(obj)
- 利用构造函数创建对象
<title>自己定义构造函数创建对象</title>
</head>
<body>
<script>
//创建一个猪 构造函数
function Pig(uname, age) {
this.uname = uname
this.age = age
}
// console.log(new Pig('佩奇', 6))
// console.log(new Pig('乔治', 3))
const p = new Pig('佩奇', 6)
console.log(p)
// const pepa = { uname: '佩奇', age: 6 }
// const obj = new Object()
</script>
</body>
构造函数：
构造函数：是一种特殊的函数，主要用来初始化对象。
使用场景：常规的{...}语法允许创建一个对象。比如我们创建了佩奇的对象，继续创建乔治的对象还需要重新写一遍，此时通过构造函数来快速创建多个类似的对象。
//创建一个猪 构造函数
function Pig(uname, age) {
this.uname = uname
this.age = age
}
// console.log(new Pig('佩奇', 6))
// console.log(new Pig('乔治', 3))
const p = new Pig('佩奇', 6)
const Georage = new Pig('乔治', 3)
console.log(p)
注意：
构造函数在技术上是常规函数。
不过有两个约定：
- 它们对的命名以大写字母开头。
- 它们只能由
new操作符来执行。
说明：
3. 使用new关键字调用函数的行为被称为实例化。
4. 实例化构造函数时没有参数时可以省略( )。
5. 构造函数内部无需写return，返回值即为新创建的对象。
6. 构造函数内部的return返回的值无效，所以不要写return。
7. new Object( )、new Date( )也是实例化构造函数。
- 小结：
- 构造函数的作用是什么？怎么写呢？
构造函数是来快速创建多个类似的对象。
大写字母开头的函数。
- new关键字调用函数的行为被称为？
实例化。
- 构造函数内部需要写return吗，返回值是什么？
不需要。
构造函数自动返回创建的新的对象。
- 练习：
<title>练习-利用构造函数创建多个对象</title>
</head>
<body>
<script>
function Goods(name, price, count) {
this.name = name
this.price = price
this.count = count
}
const mi = new Goods('小米', 1999, 20)
console.log(mi)
const hw = new Goods('华为', 3999, 59)
console.log(hw)
const vv = new Goods('vivo', 1888, 100)
console.log(vv)
// const date = new Date('2024-7-9')
// console.log(data)
</script>
</body>
- 实例化执行过程
说明：
- 创建新对象。
- 构造函数
this指向新对象。 - 执行构造函数代码，修改
this，添加新的属性。 - 返回新对象。
//创建一个猪 构造函数
function Pig(uname, age) {
this.uname = uname
this.age = age
}
// console.log(new Pig('佩奇', 6))
// console.log(new Pig('乔治', 3))
const p = new Pig('佩奇', 6)
const Georage = new Pig('乔治', 3)
console.log(p)
实例成员&静态成员：
- 实例成员
通过构造函数创建的对象称为实例对象，实例对象中的属性和方法称为实例成员。
说明：
- 实例对象的属性和方法即为实例成员。
- 为构造函数传入参数，动态创建结构相同但值不同的对象。
- 构造函数创建的实例对象彼此独立互不影响。
//实例成员和静态成员
//1.实例成员：实例对象上的属性和方法属于实例成员
function Pig(name) {
this.name = name
}
const peiqi = new Pig('佩奇')
const qiaozhi = new Pig('乔治')
//构造函数创建的实例对象彼此独立互不影响
peiqi.name = '小猪佩奇' //实例属性
peiqi.sayHi = () => { //实例方法
console.log('hi~')
}
console.log(peiqi)
console.log(qiaozhi)
//为构造函数传入参数，动态创建结构相同但值不同的对象
console.log(peiqi === qiaozhi) //false
- 静态成员
构造函数的属性和方法被称为静态成员（静态属性和静态方法）。
说明：
- 静态成员只能构造函数来访问。
- 静态方法中的
this指向构造函数。
比如Date.now( )、Math.PI、Math.random( )
//2.静态成员：构造函数上的属性和方法称为静态成员
function Pig(name) {
this.name = name
}
Pig.eyes = 2 //静态属性
Pig.sayHi = function () { //静态方法
console.log(this)
}
Pig.sayHi()
console.log(Pig.eyes) //2
- 小结：
- 实例成员（属性和方法）写在谁身上？
实例对象的属性和方法即为实例成员。
实例对象相互独立，实例成员当前实例对象使用。
- 静态成员（属性和方法）写在谁身上？
构造函数的属性和方法被称为静态成员。
静态成员只能构造函数访问。