[筆記] JavaScript 的基本觀念 – 17 – 內建函數建構子 @地瓜大的飛翔旅程

章節連結

課程對應章節
內容
JavaScript 全攻略系列文章

當你使用 new 這個關鍵字時，於 JavaScript 中相當於你建立了一個函數物件，內含有各種可供操作的方式。這樣的內建函數建構子，在 JavaScript 中有 String, Array, Object, String, Number…等。跟基本型別(Primitive Types)相較之下似乎沒有太大區別，不過在某些操作下會有造成誤解的可能，例如像 a === b 之類的回傳值。

課程對應章節

Course 60 ~ Course 64 (全部一共有 85 Courses)

請注意：本系列文章為個人對應課程的消化吸收後，所整理出來的內容。換言之，並不一定會包含全部的課程內容，也有可能會添加其他資源來說明。課程連結網址：http://tinyurl.com/w7vrql6

內容

1. 若你使用 for in 來呼叫 Array 的函式時，要記得它本身是個物件。當你輸出物件的 props 時，有機會將所有 object chain 上的 props 全部輸出。
2. Object.create 和 class 是 ES5, ES6 新增用來創建物件的方法。class 是語法糖，本質上還是原型繼承，也就是用物件建立一個新物件。

/*Example1*/
let a = new Number(3)
let b = 3
console.log(a.toFixed(2)) // 3.00
console.log(typeof(a)) // Object
console.log(a==b) // true
console.log(a===b) // false

/*Example2*/
let a = ['Andy','Wendy','Sandy']
Array.prototype.myCustomFeature = 'cool'

for(var prop in a){
  console..log(prop+':'+arr[prop]) 
} 
// 0: Andy 1:Wendy 2:Sandy myCUstomFeature:cool

/*Example3*/
let Person = {
	firstname: 'default',
	lastname: 'default',
	gretting: function(){
		return 'Hi, I am' + this.firstname + ' this.lastname';
	}
}
var Tom = Object.create(Person)
console.log(Tom)
console.log(Tom.firstname)
console.log(Tom.lastname) 
// {}, default, default
// 若要覆蓋原有設定，只要自行將值帶入。
Tom.firstname = 'Tom'
Tom.lastname = 'Wu'
console.log(Tom()) // Hi, I am Tom Wu.

/*Example 4.*/
class Person{
    constructor(firstname,lastname){
          this.firstname = firstname
          this.lastname = lastname
    }
    greeting(){
         return 'Hi, I am' + this.firstname + ' this.lastname';
    }
}

let Tom = new Person('Tom','Wu')
console.log(Tom) // Person{firstname:'Tom', lastname:'Wu'}