js方法继承

  还是原来的味道,原来的配方,我们先来了解你这让你登上山顶的板砖(有些是个人想法和方法)

第一步、我们需要知道的是你定义的方法都会有一个prototype(用来存放公共的属性和方法),而这个原型指向一个原型对象.原型对象中又存在constructor和__proto__、方法(如图一)

                                  图一

  第二步、你需要知道实例化(new)后会产生一个__proto__(可以理解为__proto__取代了prototype的位置并指向了原型对象),如图二

<script>
function a(){

}
var b=new a()
console.log([a],[b])
console.log(a.prototype===b.__proto__)
</script>

  

                                图二

  第三步、现在我们在了解基本知识的情况下开始正式介绍方法继承(你想得到谁的方法就指向谁)

    1、原型继承(指向原型对象,指向原型对象后此原型对象就变成用来存放两人的方法了)Man.prototype = Person.prototype(将Man的原型指向Person的原型,原型变成公有的了);

      

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>

</body>
</html>
<script>
//人类
function Person(name,age,sex){
	this.name = name;
	this.age = age;
	this.sex= sex;
}
Person.prototype.sleep = function(){}
Person.prototype.play = function(){}
Person.prototype.eat = function(){}

function Man(beard,larynx,name,age,sex){

	Person.apply(this,[name,age,sex])
	this.beard = beard;
	this.larynx = larynx;
}

/*
	污染父级

 */
Man.prototype = Person.prototype

Man.prototype.work = function(){}

//实例化
var chenliang = new Man(10,"很大","阿狗","40","男");
console.log(chenliang)
console.log([Man],[Person])
</script>

  结果如图三

  

  从图中我们不难看除Man和Person原型中的方法时一样的,也可以得出其最大的缺点就是污染"父级".

  2、为了解决污染父级的问题我们就不能让子集的原型指向父级的原型,现在我们来观察一下方法中还有哪些属性,这个时候我们发现了arguments(伪数组(nodelist),也可以称它为对象),//方法的名字还没有想好读者可以提喔!

  

Man.prototype.arguments=Person.prototype;在Man.prototype创建一个arguments,再把Person.prototype的方法放入

  

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>

</body>
</html>
<script>
		//人类
function Person(name,age,sex){
	this.name = name;
	this.age = age;
	this.sex= sex;
}

Person.prototype.sleep = function(){}
Person.prototype.play = function(a){
	console.log(a,‘你好‘)
}
Person.prototype.eat = function(){
	console.log("1122")
}

function Man(beard,larynx,name,age,sex){

	Person.apply(this,[name,age,sex])
	this.beard = beard;
	this.larynx = larynx;
}

Man.prototype.arguments=Person.prototype;

Man.prototype.work = function(){}

//实例化
var chenliang = new Man(10,"很大","陈亮","40","男");
chenliang.arguments.play(1);
console.log([Man])

</script>

  结果如题四

  

                            图四

其他的继承方式以后补上.

原文地址:https://www.cnblogs.com/tc-jieke/p/9113893.html

时间: 2024-07-31 16:22:14

js方法继承的相关文章

关于 JS 面向对象继承属性和方法的小例子

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <h1>关于 JS 面向对象继承属性和方法的小例子</h1> </body> </html> <script> //人的构造函

Js实现继承的方法

原型的作用:1.将公共部分放入原型中,这样构造出的多个实例对象的公共部分只会占用一个公共空间,实现数据共享和节省内存空间 2.通过原型实现继承:构造函数模拟 "类"这个面向对象的概念,JS基于对象,基于构造函数的原型对象实现继承 如何实现继承?1.改变原型对象的指向:将子类构造函数(B)的prototype指向父类构造函数(A)的一个实例化对象(a),那么这个子类构造函数构造出的实例化对象(b)就可以访问父类(A)的属性和方法 缺陷:由于B的prototype改变,那么保存在原来的B的

js中继承的几种用法总结(apply,call,prototype)

本篇文章主要介绍了js中继承的几种用法总结(apply,call,prototype) 需要的朋友可以过来参考下,希望对大家有所帮助 一,js中对象继承 js中有三种继承方式 1.js原型(prototype)实现继承 <SPAN style="<SPAN style="FONT-SIZE: 18px"><html>   <body>  <script type="text/javascript"> 

JS对象继承篇

JS对象继承篇 ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的 原型链 其基本思路是利用原型让一个引用类型继承另一个引用类型的属性和方法 function Person(){ this.name = "Person"; } Person.prototype.getName = function(){ return this.name; }; function SuperPerson(name,sex){ this.name = name; this.sex

JS 类继承 原型继承

参考文档:JS原型继承和类继承 <script src="jquery-2.0.3.js"> </script> <script> /*//类继承 var father=function(){ this.age=53; this.say=function(){ console.log("name:"+this.name+",age:"+this.age); } }; var child=function(){

js:深入继承

/** * js实现继承: * 1.基于原型链的方式 * 2.基于伪造的方式 * 3.基于组合的方式 */ 一.基于原型链的方式 function Parent(){ this.pv = "parent"; } Parent.prototype.showParentValue = function(){ console.log(this.pv); } function Child(){ this.cv = "child"; } //让Child的原型链指向Paren

JS组合继承的通用工具函数

此工具函数没实际意义,只是鉴于EXT的extend方法不太好理解,写了一个简化的extend方法,帮助理解. /** * */ E = {}; E.extend = function(sub, sup) { //借用构造函数 sub.prototype = sup; //保留父类的构造函数,以便在子类构造函数中用调用,将父类变量绑定在this下 sub.prototype.superclass = sup.constructor; //因为重写了构造函数所以重新指定constructor,以使i

浅谈JS的继承

JS继承 继承是OO语言中最为人津津乐道的概念,许多OO语言都支持两种方式的继承:接口继承:实现继承. 接口继承:只继承方法签名. 实现继承:继承实际的方法. 由于ES里函数没有签名,所以在ES里面无法实现接口继承,ES只支持实现继承.                                                                                                                                    

js实现继承的5种方式

js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承有以下通用的几种方式1.使用对象冒充实现继承(该种实现方式可以实现多继承)实现原理:让父类的构造函数成为子类的方法,然后调用该子类的方法,通过this关键字给所有的属性和方法赋值 Js代码   function Parent(firstname) { this.fname=firstname; this.age=40; this.sayAge=func