1.首先看一道題目

1 function Cat(name,age){
2      this.name=name;
3      this.age=age;
4 }
5 console.log(new Cat(‘miaomiao‘,18));  
6 //Cat {name: "miaomiao", age: 18}

2.那麽這裏面的this指的是什麽呢

1 function Cat(name,age){
2       console.log(this);//Cat {}
3       this.name=name;
4       this.age=age;
5 }
6 new Cat(‘miaomiao‘,18);
 

3.我們發現this是一個名為Cat的空對象，那麽後兩句（this.name=name;this.age=age）就相當於var Cat={};Cat.name=name;Cat.age=age;是這樣的麽我們來試一下

1 function Cat(name,age){
2       var Cat = {};
3       Cat.name=name;
4       Cat.age=age;
5 }
6 console.log(new Cat(‘miaomiao‘,18));  
7 //Cat {}

4.發現並不是那麽回事，這是為什麽，在javascript中如果沒有return 那麽函數就會默認return this為了驗證我們在函數最後面return Cat即可

1 function Cat(name,age){
2       var Cat = {};
3       Cat.name=name;
4       Cat.age=age;
5       return Cat;
6 }
7 console.log(new Cat(‘miaomiao‘,18));  
8 //Object {name: "miaomiao", age: 18}

5.好像成功了，我們和之前對比一下

1 function Cat(name,age){
2       this.name=name;
3       this.age=age;
4  }
5  console.log(new
 
 Cat(‘miaomiao‘,18));  
6 //Cat {name: "miaomiao", age: 18}

6.函數的作用我們理解的差不多，下面開始探索NEW，試想如果我們不返回對象而是返回null或者其他類型的會是什麽效果呢

1 function Cat(name,age){
2        var Cat = {};
3        Cat.name=name;
4        Cat.age=age;
5        return undefined//或者null 123 ‘123‘等非對象;
6 }
7 console.log(new Cat(‘miaomiao‘,18));//Cat{}

7.其他的一律輸出空對象

那麽我們試著寫一個類似new的函數功能

 1 function Cat(name,age){
 2    this.name=name;
 3    this.age=age;
 4 }
 5 function New(){
 6     var obj={};
 7     var res=Cat.apply(obj,arguments);
 8     return typeof res===‘object‘?res:obj
 9 }
10 console.log(New(‘mimi‘,18))
11 //Object {name: "mimi", age: 18}

8.這樣就大功告成了麽 當然不是，我們接著往下看

 1  function Cat(name,age){
 2      this.name=name;
 3      this.age=age;
 4   }
 5   Cat.prototype.sayHi=function(){
 6        console.log(‘hi‘)
 7   }
 8   function New(){
 9       var obj={};
10       var res=Cat.apply(obj,arguments);
11       return typeof res===‘object‘?res:obj
12   }
13 
14  console.log(new Cat(‘mimi‘,18).sayHi())
15  console.log(‘-------------‘);
16 console.log(New(‘mimi‘,18).sayHi());
17 
18 VM841:7 hi
19 VM841:15 undefined
20 VM841:16 -------------
21 VM841:17 Uncaught TypeError: New(...).sayHi is not a function(…)

9.紅色的事報錯，說明new操作不僅僅關註函數的本身 還關心他的原型 prototype

上面分析了那麽多，現在進入正題。

　　普通對象是沒有prototype屬性的,只有隱藏屬性__proto__（IE上也有該隱藏屬性，但是使用obj.__proto__不能輸出東西，所以建議不要使用__proto__屬性）。而函數對象則兩者兼有。prototype屬性指向的是函數對象的原型對象，對象的__proto__屬性是創建實例對象的時候對應的函數對象的原型對象。

 1  function Cat(name,age){
 2      this.name=name;
 3      this.age=age;
 4   }
 5   Cat.prototype.sayHi=function(){
 6        console.log(‘hi‘)
 7   }
 8   function New(){
 9       var obj={};
10       obj.__proto__=Cat.prototype;
11       var res=Cat.apply(obj,arguments);
12       return typeof res===‘object‘?res:obj
13   }
14 
15  console.log(new Cat(‘mimi‘,18).sayHi())
16  console.log(‘-------------‘);console.log(New(‘mimi‘,18).sayHi());
17 
18 VM844:7 hi
19 VM844:16 undefined
20 VM844:17 -------------
21 VM844:7 hi
22 VM844:17 undefined
23 undefined

10.ok大功告成

通過例子深入理解javascript中的new操作符