继承方式有四种:

1、call

2、apply

3、prototype

4、for in

call 和 apply 的主要区别:

call 传参数只能一个一个的传,

apply 因为是用数组,所以可以用arguments 获取所有的实参。当参数多时,就用apply更方便。

arguments = 返回参数集合

call 和 apply 继承

已打飞机游戏为例:

创建飞机时有很多重复的步骤

以创建玩家飞机 用call 继承 和用applay 创建boss飞机为例:

/*父模板*/
/*x,y,节点,blood,speed
* move
* shoot XXX
* init
* */
   /*通用的父模板*/
function Plane(x,y){
console.log("plane构造函数")
console.log(this);
this.x = x;
this.y = y;
this.imgNode = document.createElement("img")
this.imgsrc="";
this.blood=5;
this.speed=10;
this.move=function(){
console.log("Plane的move方法");
}
this.init=function(){}
this.init();
}
/*1.call*/
function PlayerPlane(px,py){
console.log(this); //new PlayerPlane()
// call传递参数,参数依次写上
Plane.call(this,px,py); //写在代码第一行
// 重写 ==》多态 同一个方法,不同的实现方式
this.x=1000;
this.move=function(){
console.log("Player Plane 的move方法")
}
this.shoot=function(){}
} var playerplane = new PlayerPlane(200,300);
console.log(playerplane.hasOwnProperty("x")); //true
console.log(playerplane.x)
playerplane.move();
 /*2.apply*/

    function BossPlane(bx,by){
console.log(arguments); //参数数组
Plane.apply(this,arguments);
this.move=function(){
console.log("Boss飞机的移动");
}
} var bossplane = new BossPlane(100,200);
console.log(bossplane.x,bossplane.y);
bossplane.move()

原型继承

    /*通用的手机模板*/
function Phone(name,price){
this.phoneName = name;
this.price = price;
this.color="red";
this.callPhone=function(){ }
} function IPhone(){
this.color="blue";
this.music=function(){
console.log("听音乐");
}
this.news=function(){
console.log("看新闻");
}
} var iphone1 = new IPhone();
console.log(iphone1.color); //原型链继承
IPhone.prototype = new Phone("苹果",6000);
var iphone2 = new IPhone();
console.log(iphone2.color); console.log(iphone1.__proto__); //原本的Iphone.prototype, 空对象
console.log(iphone2.__proto__); //new Phone()
console.log(iphone1.__proto__===iphone2.__proto__); //false IPhone.prototype.newfunc=function(){
console.log("新添加的功能");
}
iphone1.__proto__.newfunc2=function(){
console.log("另外一个新添加的功能");
}
// iphone1.newfunc2();
// iphone2.newfunc();
console.log("color" in iphone2); //true
console.log(iphone2.hasOwnProperty("color")); //false
区别与前两种方法:

通过原型链继承的属性不是自己的,

只是存在于原型链上。
 
 Phone.country="中国";
// var p = new Phone();
// console.log(p.country) //undefined 原型链上并没有
// console.log("country" in p) //false
/*p = 实例化对象
* Phone = 函数 --- 函数也是一个对象*/
// console.log(Phone.country); //只有Phone函数才能调用country // var iphone1 = new IPhone();
// console.log(iphone1.country); IPhone.prototype = new Phone();
var iphone2 = new IPhone();
console.log(iphone2.country); //undefined
console.log(iphone2.color); IPhone.prototype = Phone;
var iphone3 = new IPhone();
console.log(iphone3.country); // 打印得出来了
console.log(iphone3.color); // undefined
console.log(iphone3.__proto__.__proto__.__proto__) //prototype 指向一个对象就行了,可以是自己创建的新对象。
IPhone.prototype={
newAttr1:"新属性1",
newAttr2:"新属性2"
}
var iphone4 = new IPhone();
console.log(iphone4.newAttr1);
 

js 面向对象 继承的更多相关文章

  1. js面向对象继承

    前言 最近看到js面向对象这章节了,主要学习了原型和面向对象继承关系,为了梳理自己的知识逻辑,特此记录. js的面向对象 先说说我目前了解的js创建对象方法 1.写一个函数,然后通过new创建对象 2 ...

  2. js面向对象 继承

    1.类的声明 2.生成实例 3.如何实现继承 4.继承的几种方式 1.类的声明有哪些方式 <script type="text/javascript"> //类的声明 ...

  3. 关于JS面向对象继承问题

    1.原型继承(是JS中很常用的一种继承方式) 子类children想要继承父类father中的所有的属性和方法(私有+公有),只需要让children.prototype=new father;即可. ...

  4. JS 面向对象 ~ 继承的7种方式

    前言: 继承 是 OO 语言中的一个最为人津津乐道的概念.许多 OO 语言都支持两种继承方式:接口继承 和 实现继承.接口继承只继承方法签名,而实现继承则继承实际的方法.如前所述,由于函数没有签名,在 ...

  5. js 面向对象 继承机制

    根据w3cschool上的描述:共有3种继承方法(对象冒充,原型链,混合) 1.对象冒充:构造函数ClassA使用this关键字给所有属性和方法赋值,使ClassA构造函数成为ClassB的方法,调用 ...

  6. JS面向对象(3) -- Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  7. JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链

    相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...

  8. js面向对象之继承那点事儿根本就不是事

    继承 说道这个继承,了解object-oriented的朋友都知道,大多oo语言都有两种,一种是接口继承(只继承方法签名):一种是实现继承(继承实际的方法) 奈何js中没有签名,因而只有实现继承,而且 ...

  9. 捋一捋js面向对象的继承问题

    说到面向对象这个破玩意,曾经一度我都处于很懵逼的状态,那么面向对象究竟是什么呢?其实说白了,所谓面向对象,就是基于类这个概念,来实现封装.继承和多态的一种编程思想罢了.今天我们就来说一下这其中继承的问 ...

随机推荐

  1. hihoCoder #1082 : 然而沼跃鱼早就看穿了一切(字符串处理)

    #1082 : 然而沼跃鱼早就看穿了一切 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描述 fjxmlhx每天都在被沼跃鱼刷屏,因此他急切的找到了你希望你写一个程序屏蔽所有句 ...

  2. 51Nod 1003 阶乘后面0的数量(数学,思维题)

    1003 阶乘后面0的数量 基准时间限制:1 秒 空间限制:131072 KB 分值: 5         难度:1级算法题 n的阶乘后面有多少个0? 6的阶乘 = 1*2*3*4*5*6 = 720 ...

  3. 配置ubuntu网络

    第一步:找到ubuntu中的网络标志,点击Edit connection 第二步:点击Add会出来一行配置网络的提示 第三步:选中Wired connectiong 1 然后点击Edit 第四步:选中 ...

  4. python数据类型(二)

    一.List(列表) List(列表) 是 Python 中使用最频繁的数据类型. 列表可以完成大多数集合类的数据结构实现.列表中元素的类型可以不相同,它支持数字,字符串甚至可以包含列表(所谓嵌套). ...

  5. Oracle实战笔记(第三天)

    导读 今天的主要内容有:java连接Oracle.事务.Oracle中的事务处理.Oracle函数. 一.Java连接Oracle的两种方式 第一种:桥连接(JDBC_ODBC)(不推荐) 1.准备工 ...

  6. [国嵌笔记][028][Bootloader设计蓝图]

    Bootloader的作用就是启动Linux内核 U-Boot简介 1.U-Boot是用于多种嵌入式CPU(ARM.x86.MIPS等)的bootloader程序,U-Boot不仅支持嵌入式Linux ...

  7. 微信小程序实现淡入淡出效果(页面跳转)

    //目前小程序没有fadeIn(),fadeOut()方法所以还是本方法手写  <!--wxml--><!--蒙版(渐出淡去效果)--><view class=" ...

  8. 97、爬虫框架scrapy

    本篇导航: 介绍与安装 命令行工具 项目结构以及爬虫应用简介 Spiders 其它介绍 爬取亚马逊商品信息   一.介绍与安装 Scrapy一个开源和协作的框架,其最初是为了页面抓取 (更确切来说, ...

  9. 如何动态修改网页的标题(title)?

    有时候我们需要复用一个页面,但是又希望他们拥有各自的标题,这时候就需要动态的去更改页面的title了,不然所有页面都是一个标题. 这时候就会想到使用js或jQuery去实现了. 1.js方式. 首先, ...

  10. 最小生成树之Prim算法

    描述 最近,小Hi很喜欢玩的一款游戏模拟城市开放出了新Mod,在这个Mod中,玩家可以拥有不止一个城市了! 但是,问题也接踵而来--小Hi现在手上拥有N座城市,且已知这N座城市中任意两座城市之间建造道 ...