資訊專欄INFORMATION COLUMN
摘要：原型鏈理解第一件事你不用管其他語言，一句話，你只要記住里面的對象包含一個原型，原型是啥，就是另外一個對象。原型就相當于你家的車棚子，而你的那個自行車就是對象。萬事萬物皆對象有啥用一句話，擴展原型方法，給大家一到面試題，數組去重自己體會下。
概述
通過上節課的學習，大家已經會用一種json的方式定義對象了，其實這個就是傳說中的單體模式，當然這個大家不用記，關于設計模式暫時不用了解。但是總感覺哪里跟你平常用的或者聽到的不一樣吧，比如好像js聽說有什么原型繼承，還有它的對象好像跟傳統的js對象不一樣什么的。好，今天我就讓你徹底明白里面的花花草草。
1.原型鏈理解第一件事你不用管其他語言，一句話，你只要記住js里面的對象包含一個原型，原型是啥，就是另外一個對象。
舉個例子：
你每天騎著自行車去上學，然后你車子壞了咋弄，要么去自己家的車棚子里推一輛繼續騎，要么從車棚子里找到工具修修。
原型就相當于你家的車棚子，而你的那個自行車就是對象。
自行車上的書包是你人為加上去的，而螺絲刀、和輪胎有些是你自行車必須有的東西，有些是修理你自行車的東西。好，我們回到代碼表示一下。
var bike = {
車筐:"書包"
};
console.log(bike);//Object {車筐: "書包"}
//怎么看車棚子，也就是原型，里面放著各種方法和屬性
console.log(bike.__proto__)
記住，這個車棚里面有各種工具和零件，很拽，還能生產自行車。理解到這個程度就行了，有一天你放學回家了到家發現你的書包不見了，你怎么辦，肯定是先看看自己的車子上有么有，沒有咋弄，去車棚找，車棚子沒有，車棚子很拽，上面還有個生產車棚子的__proto_proto逐層向上查找就是原型鏈查找。如圖。
圖片描述
2.原型的用途? 我知道這個有什么用？好我們看一個實際的情況，https://docs.angularjs.org/ap...
? angular的merge函數，簡單的說，有一個對象a,還有一個對象b，我想把兩個對象合并成一個對象怎么實現？注意要求只是合并人加的，原型上的不算。
? 直接上源碼，簡單的讓人發指，這個就是angular的架構（1.6.2）我粗糙的實現了一下。
(function(window) {
var angular = window.angular || (window.angular = {});
angular.merge=function(dst,src){
for(var prop in src){
if(src.hasOwnProperty(prop)){
dst[prop] =src[prop];
}
}
return dst;
}
})(window);
var person = {
name:"leo",
age:18
};
var person2 = {
job:"教前端的"
};
console.log(angular.merge(person,person2));
// https://docs.angularjs.org/api/ng/function/angular.merge
hasOwnProperty這個用來判斷只是自己直接添加的對象，現在知道用途了吧？理解了js原理，能看懂和實現angular的庫，你還發愁自己不會用angular嗎？
2.萬事萬物皆對象? 經常聽人說，js萬事萬物皆對象
? 怎么證明，不墨跡上代碼
?
var num = 12;
console.log(num.__proto__);
var str = "abc";
console.log(str.__proto__);
var arr = [];
console.log(arr.__proto__.__proto__);
var json = {};
console.log(json.__proto__.__proto__);
不解釋，一句話，所有對象都有一個祖宗對象Object。
3.萬事萬物皆對象有啥用？? 一句話，擴展原型方法，給大家一到面試題，數組去重自己體會下。
思路，判斷某個值出現的位置是否等于當前循環的i,
比如,
arr[1]的下標是1，而arr.indexOf(arr[1])返回是0 說明 1在 i = 1的位置之前出現過了，所以重復。上代碼：
var arr = [1,1,12,5,8,7,8,7,21,5,0,0];
var arr2 = [];
for(var i = 0;i
那么問題就來了 如何實現讓indexOf方法兼容低版本瀏覽器，這里就體現萬事萬物皆對象的好處了。
上代碼：
Array.prototype.indexOf=function(item){
for(var i=0;i
有同學可能會想，不對啊，我們不講new關鍵字那些嗎？放心，這些下節課就講了。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/82668.html
摘要：面向過程函數式編程面向對象編程第二個并不是大家理解的那樣，我們先說舉個現實例子就明白了。多說一句函數是編程是非常強大也是我最喜歡的，以后再說，我們先說面向對象編程。 概述 當大家已經把js的語言基礎理解了，然后能夠寫出一些簡單的例子了，這個時候基本上達到了一年工作經驗的水平，而自己能夠獨立的寫一些小功能，完成一些小效果，或者臨摹修改一些比較復雜的插件的時候差不多就是兩年工作經驗的水平，...
摘要：概述到這里我們講說面向對象的系列部分的最后一個課程，面向對象必須掌握兩個東西一個是對象的創建一個是繼承。只需要記住一句話，屬性放在構造函數里面，方法放在原型上。 概述 到這里我們講說js面向對象的系列部分的最后一個課程，面向對象必須掌握兩個東西一個是對象的創建一個是繼承。這節課我們重點說說這兩個問題最后我們說下在ES6里面面向對象怎么玩。 1對象的創建 我們第一節課已經就會用了，單體模...
摘要：原型鏈和構造函數是一種面向對象的語言，并且可以進行原型繼承。來了極大的支持了工程化，它的標準讓瀏覽器內部實現類和類的繼承構造函數構造函數調用父類構造函數現在瀏覽器對其支持程度還不高。 原型鏈 原型鏈比作用域鏈要好理解的多。 JavaScript中的每個對象，都有一個內置的_proto_屬性。這個屬性是編程不可見的（雖然ES6標準中開放了這個屬性，然而瀏覽器對這個屬性的可見性的支持不同）...
閱讀 1193·2021-11-15 18:00
閱讀 1789·2021-10-08 10:15
閱讀 752·2021-09-04 16:48
閱讀 2373·2021-09-04 16:48
閱讀 1313·2019-08-29 18:40
閱讀 965·2019-08-29 13:08
閱讀 2987·2019-08-26 14:06
閱讀 1111·2019-08-26 13:35
