Renee's Blog

Coding life

0%

JS核心-(51)-繼承與原型練-課後練習

نُشر في عُدل في في

前言

課後練習題目

第一題

我們了解原型的概念，那麼請問在 JavaScript 中是否所有「物件」、「陣列」以及「函式」都有原型屬性?

  1. 全都有
  2. 全都沒有
  3. 只有 「物件」、「陣列」 有
  4. 我不確定
點我看答案 

答案: 1

第二題

請問 console.log( ) 將會出現什麼？

  1. 王小明
  2. 隔壁老王
  3. daddyName is not defined
  4. undefined
點我看答案 

答案: 2  
這個問題主要與 this 的指向與呼叫有關係，因此當我們在 person.returnName.daddy 其實是在 returnName: function() {} 底下新增一個屬性叫做隔壁老王  
接下來 daddyName() 是在 returnName 呼叫的，因此 this 會指向到 returnName 剛剛新增的隔壁老王唷~

第三題

請問 console.log( ) 將會出現什麼？

  1. Casper
  2. Hello
  3. hello is not defined
  4. undefined
  5. sayHi
點我看答案 

答案: 1  
這一題真的是一個很陷阱的陷阱題，透過 var name = 'Hello'; 讓你誤解，此外這一題還有一個陰險處在於，因為 name 這個變數其實是瀏覽器的變數，所以你可以在瀏覽器上面直接輸入 name 你會發現出現一個空字串。  


因此 name 在瀏覽器的初始環境下就是一個空字串，才會導致 console.log(name) 不是一個 undeinfed。  


function sayHi (name){
 var name = ‘Casper’;
 this.name = name;
 return this.name;
}


sayHi.proto.hello = function(name) {
 console.log(name); // 空字串
 console.log(typeof name) // string
 return this(name);
}
console.log(sayHi.hello(name));
var name = ‘Hello’;  


最後 name 這個屬性還有一個很大的問題在於它不會因為你重新整理瀏覽器而釋放掉，因為這個變數本身就是瀏覽器的變數，所以當你執行兩次時，就會發生原本的空字串變成有值而且無法清除該變數，只有完整關閉瀏覽器才能夠清除，因此助教這邊會建議不要使用 name 當作變數名稱。

第四題

一般狀況下我們執行 person.getName( ) 會得到 HexSchool 1&& HexSchool 2 

var person = {
 firstName:'HexSchool 1',
 lastName:'HexSchool 2',
 getName: function() {
  return this.firstName + ' && '+ this.lastName;
 }
}

但如果將 person 加入原型並透過 protoName 來呼叫 person 的原型會得到什麼結果？ 

var protoName = {
 firstName: 'John',
 lastName: 'Doe',
}
protoName.__proto__ = person;
protoName.getName(); // 答案是甚麼?
console.log(protoName, protoName.getName());
  1. HexSchool 1 && HexSchool 2
  2. John && HexSchool 2
  3. HexSchool 1 && Doe
  4. John && Doe
點我看答案 

答案: 4  


因為這題 protoName 裡面的原型 proto 和 protoName 物件屬性是一樣名
 firstName 和 lastName ，也就是「如果原型與物件內的屬性同名」，那麼會以物件內的屬性優先，原型的屬性權重則較低
若把 protoName 物件內屬性註解則會得到 “HexSchool 1 && HexSchool 2”

第五題

我們可以利用建構式原型來建立家人與年齡，請問 console.log( ) 將會出現什麼？

  1. {name: “漂亮阿姨”, age: “25”}
  2. {name: “媽媽”, age: “30”}
  3. {name: “爸爸”, age: “45”}
  4. mom is not defined
點我看答案 

答案: 1

第六題

我們可以利用建構式原型來建立家人與年齡，請問 console.log( ) 將會出現什麼？

  1. undefined
  2. joun
  3. default
  4. 以上皆非
點我看答案 

答案: 3

第七題

請問 console.log( ) 將會出現什麼？

  1. 你呼叫了我
  2. TypeError: Cannot set property ‘callFu’ of undefined
  3. 100
  4. b.callFu is not a function
點我看答案 

答案: 1

第八題

請問 console.log( ) 將會出現什麼？

  1. { name: ‘爸爸’, age: 28 }
  2. { }
  3. undefined
  4. 以上皆非
點我看答案 

答案: 2

第九題

承上題，當若變成 family.name 請問 console會出現什麼？

  1. 爸爸
  2. undefined
  3. name is not define
  4. { }
點我看答案 

答案: 1

第十題

當執行該原型函式後將會回傳什麼？

  1. Casper
  2. Mark
  3. sayHi
  4. hello
點我看答案 

答案: 3