對javascript 這門語言來說，相信大家都不會陌生，但最近發(fā)現(xiàn)其實好多人對JS對象的概念很模糊，甚至?xí)@異于JS竟然也有對象

其實JS是完全基于對象的語言，我們所能看到的都是基于對象，包括 js 方法其實也是一個對象

但是js的面向?qū)ο笈c像java的面向?qū)ο笙啾?又是有著極大的不同，java，C#完全面向?qū)ο蟮恼Z言 中有類這個概念，而js對象則是依靠 構(gòu)造器constructor利用 原型prototype構(gòu)造出來的。

簡單的理解下，類的概念相當(dāng)于 模板，原型相當(dāng)于 各個對象組成新的對象

先來總結(jié)一下創(chuàng)建對象的3種方式

創(chuàng)建對象的三種方式：

1.通過JSON符號創(chuàng)建

var dog = {
    name: 'singledog',
    wangwang: function(){
      console.log(this.name+"旺旺！");
    }
  };
  dog.wangwang();// singledog旺旺！

2.通過new 關(guān)鍵字創(chuàng)建

function Dog(name){
    this.name = name;
  };
  Dog.prototype.wangwang = function() {
    console.log(this.name+"wangwang!!");
  };
  var dog = new Dog("SingleDog:");
  dog.wangwang();//SingleDog:wangwang!!

3.通過 ES5新引進(jìn)的 Object.create() 方法創(chuàng)建

var dog = {
    name: 'singledog',
    wangwang: function(){
      console.log(this.name+"旺旺！");
    }
  };
  var jDog = Object.create(dog);//創(chuàng)建一個新的對象 jDog 并繼承 dog 對象
  jDog.wangwang();//singledog旺旺！

原型（prototype）

prototype（原型）是js面向?qū)ο笾蟹浅Ｖ匾囊粋€概念，是深入學(xué)習(xí)js是必須要理解的一個概念
每個方法 都有一個prototype屬性，我們可以利用這個屬性來大做文章
之前介紹了，我們生成一個需要用到 new 關(guān)鍵字，那么這個new 關(guān)鍵字與JAVA中的new一樣嗎？

答案是完全不一樣

可以看一個例子：

function Car(name){
    this.name = name
  };
  Car.prototype = {//指定 Car的原型 對象
    driver: function(){
      console.log(this.name+" driver!!");
    }
  };

  var obj = new Object();
  obj.__proto__ = Car.prototype;
  Car.call(obj,"Benz");
  obj.driver(); //Benz driver!!

在上面的代碼中，我們發(fā)現(xiàn) var car = new Car();這句被我們替換成了這三句：

var obj = new Object();
obj.__proto__ = Car.prototype;
Car.call(obj,"Benz");

以上代碼中，我們先新建了一個空的Object對象 obj，然后將Car的原型賦給了 obj對象的__proto__，這樣子obj對象就繼承了Car的原型對象，最后一步，在obj對象上執(zhí)行構(gòu)造方法Car，這樣子 obj 對象就相當(dāng)于拿來了 Car方法中 全部this. 屬性或方法

這三步其實等于new 操作

基于原型，我們可以實現(xiàn)原型鏈的繼承，因為每一個 prototype 都是一個對象，每個對象都隱式的擁用一個 prototype 引用 __proto__ 屬性，這樣子當(dāng)調(diào)用一個對象的方法的時候，就會順著__proto__屬性一層一層往上找，直到找到為止。

說起來似乎很難理解，看個例子幫助大家理解：

function Car(){
  };
  Car.prototype = {//指定 Car的原型 對象
    name : 'car',
    driver: function(){
      console.log(this.name+" driver!!");
    }
  };

  function QqCar(){
    this.name = 'QQ'
  };

  QqCar.prototype = new Car(); //指定 QqCar的原型為 new Car()

  var qqCar = new QqCar();//繼承了driver 方法 
  qqCar.driver(); // QQ driver!!

  function BigQqCar(){
    this.name = 'BigQQ'
  };

  BigQqCar.prototype = qqCar; //指定 BigQQCar的原型為 qqCar

  var bigQqCar = new BigQqCar();
  bigQqCar.driver = function(){//重寫了driver方法
    console.log(this.name+" flying!!");
  };
  bigQqCar.driver();//BigQQ flying!!

  console.log(bigQqCar.__proto__===BigQqCar.prototype); //true 
  console.log(BigQqCar.prototype === qqCar); //true
  console.log(BigQqCar.prototype.__proto__ === QqCar.prototype); //true

  // 以上代碼就是一個簡單的原型鏈,每個構(gòu)造方法生成的對象都有一個 __proto__ 指向 其構(gòu)造方法的prototype 屬性

以上也只是個人對JS面向?qū)ο蟮睦斫?，歡迎留言補充

博客原文地址戳這里