Javascript是一門函數式編程語言，Javascript當中函數是核心，在Javascript中函數也是對象，函數對象在創建的時候會被添加屬性和方法。
在Javascript中函數對象有兩種調用方式，一種是new關鍵字的調用，另一種是沒有new關鍵字的調用，前者會返回一個對象，后者會返回return語句中的內容。
function Obj (name) { this.name = name; return name;}用new關鍵字來調用如下：
var obj = new Obj('張三') // 返回 { 'name': '張三' }不用new關鍵字調用如下：
var obj = Obj('張三') // 返回 '張三'說完了js當中的對象和調用方式，那讓我們來理解下什么是對象。
什么是對象？
對象是類的一個實例（對象可不是女朋友），有狀態和行為。例如：一個電腦就是一個對象，它的狀態有：大小、顏色、品牌等，他的行為有：播視頻、聽音樂、聊天等。
而類是對象的抽象，可以理解為類是一個模板，它來描述一類對象的狀態和行為。軟件對象也有狀態和行為，軟件對象的狀態就是屬性，行為就是方法。在軟件開發中，在方法中可以操作對象的內部狀態，對象的相互調用也是通過方法來完成。
類既然可以理解為一個模板，我們通過一個Person的簡單例子來理解下：
function Person (name, age, sex) { this.name = name; this.age = age; this.sex = sex; run = function () { console.log('Run') }}在這個類中name,age,sex為這個類的屬性,而run為這個類的方法；Person的職責是構造對象，進行對象的初始化。
接下來我們看下在js中如何聲明并調用對象。
對象的創建（多種方法）
塊級對象
var person = { name: '王小端coder', age: 29}console.log(person.name); // 王小端coder構造函數 --- 系統自帶
var obj = new Object();obj.name = '王小端coder'console.log(obj.name); // 王小端coder
系統自帶的對象有：Object、Array、Number、Boolean、Date等
構造函數 --- 自定義
function Obj (name) { this.name = name;}var obj = new Obj('王小端coder');console.log(obj.name); // 王小端coder對象的增刪改查
增：為對象添加一個屬性
var person = {};person.name = '王小端coder';console.log(person.name);刪：通過delete操作符刪除一個對象的屬性
var person = { name: '王小端coder'};console.log(person.name); // 王小端coderdelete person.name;console.log(person.name); // undefined改：直接通過賦值來修改一個對象的屬性
var person = { name: '王小端coder'};console.log(person.name); // 王小端coderperson.name = '王小端JS'console.log(person.name); // 王小端JS查：查詢對象的屬性，有兩種方法
var person = { name: '王小端coder'};console.log(person['name']); // 第一種方法console.log(person.name); // 第二種方法原型的定義
原型是function對象的一個屬性，它定義了構造函數制造出的對象的公共祖先。通過構造函數產生的對象，可以繼承該原型的屬性和方法，原型也是對象。
function Person (name, age) { this.name = name; this.age = age;}Person.prototype = { eat: function (food) { console.log('eat ' + food); }, sleep: function () { console.log('sleeping'); }}var person = new Person ('王小端coder', 29);console.log(person.name); // 王小端coderperson.eat('apple') // eat apple我們定義了一個Person構造函數，而屬于Person構造對象共有的方法，則定義到了Person原型上。
查看構造函數原型的接口：隱士屬性__proto__（其實我們能夠訪問原型的屬性，或者說繼承原型，靠的就是__proto__屬性連接著構造函數和原型，可以說沒有__proto__屬性的存在，就無法實現原型的繼承）直接通過new操作符創建的對象訪問__proto__屬性即可查看到原型。
原型鏈
原型鏈就是將一個個原型串聯起來，形成一條原型繼承的鏈子。Child繼承Parent, Parent繼承GrandParent, 而GrandParent沒有自定義原型，所以默認為原型鏈的最頂端new Object();
對象的繼承（多種方式）
創建的子類將繼承超類的所有屬性和方法，包括構造函數及方法的實現。記住，所有屬性和方法都是公用的，因此子類可直接訪問這些方法。子類還可添加超類中沒有的新屬性和方法，也可以覆蓋超類的屬性和方法。和其他功能一樣，JavaScript實現繼承的方式不止一種。這是因為JavaScript中的繼承機制并不是明確規定的，而是通過模仿實現的。這意味著所有的繼承細節并非完全由解釋程序處理。作為開發者，你有權決定最適用的繼承方式。
我們先定義一個父類
// 定義一個父類function Person (name) { this.name = name; this.sleep = function () { console.log('朕正在睡覺!'); }}// 在父類原型上面增加一個方法Person.prototype.eat = function (food) { console.log('朕現在吃的食物是：' + food);}下面為您介紹幾種具體的繼承方式：
原型鏈繼承
// 定義一個嬰兒來繼承人的父類function Baby () {}Baby.prototype = new Person();Baby.prototype.name = '小端';var baby = new Baby()console.log(baby.name); // 小端baby.eat('milk'); // 朕現在吃的食物是：milk優點： 簡單、易于實現；父類新增的原型方法和屬性子類都能訪問到；
缺點： 無法實現多繼承；來自原型的對象的所有屬性被所有實例共享；如果為子類增加屬性和方法，無法放倒構造器中；創建子類實例時無法向父類構造函數傳參；
構造繼承
// 定義一個嬰兒來繼承人的父類function Baby (name) { Person.call(this); this.name = name || 'Coder'}let baby = new Baby();console.log(baby.name); // Coderbaby.sleep(); // 朕正在睡覺!console.log(baby instanceof Person); // falseconsole.log(baby instanceof Baby); // true優點： 可以實現多繼承；創建子類時可以向父類傳遞參數；子類可以共享父類引用的屬性；
缺點： 實例不是父類的實例；只能繼承父類的實例屬性和方法；無法實現函數復用，每個子類都有父類實例函數的副本，影響性能；
實例繼承
function Baby (name) { var instance = new Person(); instance.name = name || 'Coder'; return instance;}let baby = new Baby();console.log(baby.name); // Coderbaby.sleep() // 朕正在睡覺!優點： 不限制調用方式，返回的對象具有相同的效果；
缺點： 不支持多繼承；實例是父類的實例，不是子類的實例；
拷貝繼承
// 定義一個嬰兒來繼承人的父類function Baby (name) { var person = new Person(); for (let p in person){ Baby.prototype[p] = person[p]; } Baby.prototype.name = name || 'Coder';}let baby = new Baby();console.log(baby.name); // Coderbaby.sleep() // 朕正在睡覺!優點： 支持多繼承；
缺點： 效率較低，內存占用高；無法獲取父類不可枚舉的方法；
注意：不可枚舉的方法是不能使用for in訪問到的方法
組合繼承
// 定義一個嬰兒來繼承人的父類function Baby (name) { Person.call(this); this.name = name || 'Coder';}Baby.prototype = new Person();Baby.prototype.constructor = Baby;let baby = new Baby();console.log(baby.name); // Coderbaby.eat('milk'); // 朕現在吃的食物是：milk優點： 不存在引用屬性共享問題，可以傳參，函數可復用；
缺點： 調用兩次構造函數，生成了兩份實例；
寄生組合繼承
// 定義一個嬰兒來繼承人的父類function Baby (name) { Person.call(this); this.name = name || 'Coder';}(function () { let Super = function () {}; Super.prototype = Person.prototype; Baby.prototype = new Super();})();let baby = new Baby();console.log(baby.name); // Coderbaby.eat('milk'); // 朕現在吃的食物是：milk優點： 整合了以上幾種繼承的優點；
缺點： 實現復雜；
ES6的class
ES6 提供了更接近傳統語言的寫法，引入了 Class（類）這個概念，作為對象的模板。通過class關鍵字，可以定義類?；旧?，ES6的class可以看作只是一個語法糖，它的絕大部分功能，ES5 都可以做到，新的class寫法只是讓對象原型的寫法更加清晰、更像面向對象編程的語法而已。
可以像如下定義：
class Person { constructor (name) { this.name = name; } sleep () { console.log('朕正在睡覺!'); } eat (food) { console.log('朕現在吃的食物是：' + food); }}let person = new Person('小端');console.log(person.name); // 小端person.eat('milk'); // 朕現在吃的食物是：milkES6 class的繼承
// 定義一個嬰兒來繼承人的父類class Baby extends Person { constructor(name){ super(name); }}let baby = new Baby('小端');console.log(baby.name); // 小端baby.eat('milk'); // 朕現在吃的食物是：milk我們可以看到Class可以通過extends關鍵字實現繼承，這比ES5的通過修改原型鏈實現繼承，要清晰和方便很多。
我之后會單獨用一章來詳細講ES6中的Class和繼承。
以上所述是小編給大家介紹的Javascript中的對象和繼承詳解整合，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對VeVb武林網網站的支持！
新聞熱點
疑難解答
