※ Object(物件) & Constructor Function(建構式函式)
Object(物件)是什麼？
物件是一種「可以將資料、程式碼包含在其中」的資料結構。
Object(物件)的兩種創造方式：
- 匿名物件：直接使用"{}"。沒有特別的名字，直接從Object中繼承過來的一個物件。
- 具有名字的物件。
Constructor Function(建構式函式)是什麼？
- Constructor Function是一個建構函式，本質是就是一個函式。
- 目的在創造物件時，作一些基礎和初始化的設定。
- 就是一個專門用來建立物件的function。
Constructor Function(建構式函式)的功能：
- 利用Constructor(建構子)為Object(物件)設定initial(初始化)要做的事情。initial(初始化)要做的事情的意思是，創造一個Object(物件)時，當下就要建立內容給它，接著利用Constructor Function完成任務。
- 利用"this"關鍵字給予「將要創建的Object(物件)」設定新的屬性和方法。意思是利用Constructor Function讓Object(物件)獲得具有"this"的功能
- 利用Constructor(建構子)建立Object(物件)。
- Constructor Function跟一般的Function相比，在本質上並沒有區別。真正的區別在於"New"這個關鍵字。當我們使用"New"關鍵字去對Function時，Javascript會將Function理解成Constructor Function，並且利用Constructor Function創造出具有名字的Object(物件)。
Constructor Function(建構式函式)的例子(一)：
//創建物件
function ShibaInu(name, color) {
this.name = name,
this.color = color,
this.showMoeMeo = function () {
console.log("我會賣萌")
},
this.giveMeSomeCaress = function () {
console.log("快來摸摸我~")
},
this.coquettish = function () {
console.log("我會撒嬌")
},
this.playDumb = function () {
console.log("我什麼都不知道")
},
this.playWith = function (someone) {
console.log(this.name + "跟" + someone.name + "一起玩")
}
}
function Cat(name) {
this.name = name
}
const dog = new ShibaInu("小柴", "米色")
const cat = new Cat("凱蒂")
dog.playWith(cat) // 印出"小柴跟凱蒂一起玩"
Constructor Function(建構式函式)的例子(二)：
條件:
媽媽請小強去買東西 : 「請買2個蘋果回來，如果雞蛋特價的話，就買1打。」
背景：
* 雞蛋一個5元，特價3元。
* 蘋果一個60元。
題目：
* 請將「請買2個蘋果，如果雞蛋特價的話，就買一打。」這段話，以OPP實現。
* 提示:
* 你應該會需要「小強」的物件，並且具有「購買東西」的方法。
* 你應該會需要「雞蛋」、「蘋果」的物件，並且能夠知道是否特價。
(function main() {
// 蘋果的建構函數
function Apple(quantity) {
this.quantity = quantity,
this.price = 60, // 蘋果的價格固定為60元
this.getTotalPrice = function () {
return this.quantity * this.price
}
}
// 雞蛋的建構函數
function Egg(quantity, isOnsale) {
this.quantity = quantity,
this.price = isOnsale ? 3 : 5, // 根據是否特價來設定價格
this.getTotalPrice = function () {
return this.quantity * this.price
}
}
// 定義購買函數
function buy(item) {
return item.getTotalPrice()
}
// 定義 Person 類別
function Person(name, wallet) {
this.name = name
this.wallet = wallet
this.buy = function (item) {
const cost = item.getTotalPrice()
if (this.wallet >= cost) {
this.wallet -= cost //使用複合賦值運算符，將變數的當前值中減去一個數值，並將結果賦給該變數。
console.log(`${this.name} 購買了 ${item.quantity} 個 ${item.constructor.name}，花費了 ${cost} 元，剩餘 ${this.wallet} 元`)
} else {
console.log(`${this.name} 的錢包不足，無法購買 ${item.quantity} 個 ${item.constructor.name}`)
}
}
}
//創建小強物件並進行購買
const xiaoQiang = new Person("小強", 300)
// 購買兩個蘋果
const apples = new Apple(2)
xiaoQiang.buy(apples)
// 如果雞蛋特價，購買一打雞蛋
const isEggOnSale = true // 假設雞蛋特價
if (isEggOnSale) {
const eggs = new Egg(12, isEggOnSale) // 一打雞蛋
xiaoQiang.buy(eggs)
}
//小強的剩餘錢包金額
console.log(`小強剩餘的錢包金額: ${xiaoQiang.wallet}元`)
})()
//輸出結果
//小強 購買了 2 個 Apple，花費了 120 元，剩餘 180 元
//小強 購買了 12 個 Egg，花費了 36 元，剩餘 144 元
//小強剩餘的錢包金額: 144元
