1. js 其实是一个非面向对象的语言,通过对象的深浅复制完成继承

2. 继承方法

继承的方法有两种

1)prototype 原型模式

举个例子

var Animal = function () {
this.type = 'animal';
this.tmp = {name:'hehe'};
this.eat = function (tmp) {
console.log('animal eat');
};
this.modifyTmp = function (tmp) {
this.tmp.name = tmp;
}
} var Cat = function (name) {
this.type = 'cat';
this.name = name;
this.eat = function () {
console.log('cat eat:' + this.name);
}
} Cat.prototype = new Animal(); var cat1 = new Cat('cat1');
cat1.eat();
cat1.modifyTmp('lala');
console.log(cat1.tmp); // 输出 lala var cat2 = new Cat('cat2');
cat2.eat();
console.log(cat2.tmp); // 输出lala

注意:此处有坑!!

为什么通过原型继承输出的都是 lala 呢?

因为此时的 tmp 的类型为对象 或者 array, 当进行 prototype 继承时, 实际是通过对象引用完成继承,此时 cat1  cat2 都是指向同一个Animal 对象。如果tmp 为基础类型(string,int)时,不存在引用,可以无需担心。

可以将 tmp 重新定义给外部 cat1 cat2 对象,进行重新复制,将会指向两个不同对象,例子如下:

var Animal = function () {
this.type = 'animal';
this.tmp = {name:'hehe'};
this.eat = function (tmp) {
console.log('animal eat');
};
this.modifyTmp = function (tmp) {
this.tmp.name = tmp;
return this.tmp;
}
} var Cat = function (name) {
this.type = 'cat';
this.name = name;
this.tmp = {};
this.eat = function () {
console.log('cat eat:' + this.name);
this.tmp = this.tmp;
}
} Cat.prototype = new Animal(); var cat1 = new Cat('cat1');
cat1.eat();
cat1.tmp = cat1.modifyTmp('lala');
console.log('cat1',cat1); // lala var cat2 = new Cat('cat2');
cat2.eat();
cat2.tmp = cat2.modifyTmp('miaomiao');
console.log('cat2:',cat2); // miaomiao
console.log('cat1',cat1); // lala

2) call apply 方式

这个是利用this 对象偷天换日。

【javascript】继承的更多相关文章

  1. javascript继承的三种模式

    javascript继承一般有三种模式:组合继承,原型式继承和寄生式继承: 1组合继承:javascript最为广泛的继承方式通过原型链实现对原型属性和方法的继承,通过构造函数实现对实例属性的继承,同 ...

  2. javascript继承机制的设计思想(ryf)

    我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...

  3. 【读书笔记】javascript 继承

    在JavaScript中继承不像C#那么直接,C#中子类继承父类之后马上获得了父类的属性和方法,但JavaScript需要分步进行. 让Brid 继承 Animal,并扩展自己fly的方法. func ...

  4. 图解JavaScript 继承

    JavaScript作为一个面向对象语言,可以实现继承是必不可少的,但是由于本身并没有类的概念(不知道这样说是否严谨,但在js中一切都类皆是对象模拟)所以在JavaScript中的继承也区别于其他的面 ...

  5. JavaScript强化教程——Cocos2d-JS中JavaScript继承

    javaScript语言本身没有提供类,没有其它语言的类继承机制,它的继承是通过对象的原型实现的,但这不能满足Cocos2d-JS引擎的要求.由于Cocos2d-JS引擎是从Cocos2d-x演变而来 ...

  6. [原创]JavaScript继承详解

    原文链接:http://www.cnblogs.com/sanshi/archive/2009/07/08/1519036.html 面向对象与基于对象 几乎每个开发人员都有面向对象语言(比如C++. ...

  7. javascript继承(六)—实现多继承

    在上一篇javascript继承—prototype最优两种继承(空函数和循环拷贝)(3) ,介绍了js较完美继承的两种实现方案,那么下面来探讨一下js里是否有多继承,如何实现多继承.在这里可以看看j ...

  8. javascript继承(五)—prototype最优两种继承(空函数和循环拷贝)

    一.利用空函数实现继承 参考了文章javascript继承—prototype属性介绍(2) 中叶小钗的评论,对这篇文章中的方案二利用一个空函数进行修改,可以解决创建子类对象时,父类实例化的过程中特权 ...

  9. javascript继承(四)—prototype属性介绍

    js里每一个function都有一个prototype属性,而每一个实例都有constructor属性,并且每一个function的prototype都有一个constructor属性,这个属性会指向 ...

  10. 【JavaScript】重温Javascript继承机制

    上段时间,团队内部有过好几次给力的分享,这里对西风师傅分享的继承机制稍作整理一下,适当加了些口语化的描述,留作备案. 一.讲个故事吧 澄清在先,Java和Javascript是雷锋和雷峰塔的关系.Ja ...

随机推荐

  1. rabbitmq 死信邮箱配置(dead-letter)

    DLX,Dead-Letter-Exchange(死信邮箱)利用DLX,当消息在一个队列中变成死信后,它能被重新publish到另一个Exchange,这个Exchange就是DLX.消息变成死信一向 ...

  2. 简单介绍phpcms以及phpcms如何安装?

    一.先大体介绍一下phpcms,及存放位置 1.将phpcms放在www目录下的phpcms,并解压 其中,readme 没什么用,重要的是install_package; 2.打开install_p ...

  3. 两本最近阅读的工具书的记录 关于Python和Linux命令行的 不喜勿喷 只是写给自己用

    <Linux命令行完全技术宝典>读书心得 张栋作者 在学习Linux系统中,我们需要掌握各种管理的方法和技巧,而管理Linux系统最有效的方法就是命令行的控制.而我在图书馆中读到的< ...

  4. none 和 host 网络的适用场景 - 每天5分钟玩转 Docker 容器技术(31)

    本章开始讨论 Docker 网络. 我们会首先学习 Docker 提供的几种原生网络,以及如何创建自定义网络.然后探讨容器之间如何通信,以及容器与外界如何交互. Docker 网络从覆盖范围可分为单个 ...

  5. 使用CoApp创建NuGet C++静态库包

    NuGet是微软开发平台下的包管理软件,使用它你可以非常方便的将一些第三方的库.框架整合进自己的项目中,省去了不少麻烦的配置过程.但是从官方文档上来看,貌似NuGet对C++的支持不是很好,并且在现阶 ...

  6. AospExtended K3 Note最新官方版 Android7.1.2 极速 省电 流畅 Galaxy XIAOMI Moto Lenovo Coolpad 均支持

    AospExtended 最新官方版 Android7.1.2 极速 省电 流畅 Galaxy  XIAOMI Moto  Lenovo  Coolpad  均支持 之前用过1629开发版等,体验了很 ...

  7. 持续集成篇 --Hudson持续集成服务器的安装配置与使用

    样例项目参考视频教程:http://www.roncoo.com/course/view/85d6008fe77c4199b0cdd2885eaeee53 IP:192.168.4.221  8G内存 ...

  8. Apple官方文档译文GitHub框架源码注解

    引导

  9. Itunes制作手机铃声,图文版

    一.下载歌曲,选择歌曲用itunes打开,打开出现下面界面 二.设置歌曲 右键点击歌曲,找到显示简介,点击选项,截取音乐,出现下图: 截取你喜欢的部分,点击确定 点击确定后,选中该歌曲,找到左上方 文 ...

  10. 【Android Developers Training】 31. 序言:共享简单数据

    注:本文翻译自Google官方的Android Developers Training文档,译者技术一般,由于喜爱安卓而产生了翻译的念头,纯属个人兴趣爱好. 原文链接:http://developer ...