学Js之prototype

 

每个Javascript对象(Object.prototype和null除外)都从原型里继承属性

初看这句话并没有什么很深的感触，所以拆分一下，Js对象 <--属性-- 原型


1、Js对象

1. <script>
   
2.         var dog = {};
   
3. </script>

这是一只刚出生的小狗，小风还没有来得及为他起名，当然，这个小家伙自己，也是迷迷糊糊，懵懵懂懂

2、属性
新生的喜悦总会让人怀旧，主人想起了儿时的动画片，那只像棉花糖一般的可爱小狗，起了一个好听的名字

1. <script>
   
2.         dog.name = '小白';
   
3. </script>

是时候教他唱一首熟悉的歌谣了，小风默默地想到

1. <script>
   
2.         dog.song = '大象，大象，你的鼻子为什么那么长？！';
   
3. </script>

费了九牛二虎加吃奶的努力，小白终于get了新技能

1. <script>
   
2.         dog.sing = function(){
   
3.                 console.log(this.song);
   
4.         };
   
5. </script>

复制代码

3、原型
时光总是把人抛，小白生了小小白，小小白生了小小小白，每次都要教他们唱歌，实在是太累了

1. <script>
   
2.         function Dog(name){
   
3.                 this.name = name;
   
4.                 this.song = '大象，大象，你的鼻子为什么那么长？！';
   
5.         }
   
6.         Dog.prototype.sing = function(){
   
7.                 console.log(this.song);
   
8.         }
   
9. </script>

对象可以从原型中继承属性，

所以小小白们在出生时，

1. <script>
   
2.         var dogn = new Dog('我也不知道是第多少只小白了');
   
3. </script>

便get了sing这个新技能。

1. <script>
   
2.         dogn.sing(); //console.log('大象，大象，你的鼻子为什么那么长？！');
   
3. </script>

复制代码

而且只要他们愿意，他们可以自由的歌唱

1. <script>
   
2.         dogn.song = '想唱就唱，我就是我，不一样的烟火~~~~';
   
3.         dogn.sing();
   
4. </script>

复制代码