JavaScript面向对象-3

最新推荐文章于 2023-02-12 05:28:13 发布

代码浪人

最新推荐文章于 2023-02-12 05:28:13 发布

阅读量137

点赞数

分类专栏： java-web 文章标签： js javascript 多态 html

版权归博客所有，仅供学习！

本文链接：https://blog.csdn.net/huiguo_/article/details/109129762

版权

java-web 专栏收录该内容

29 篇文章 0 订阅

订阅专栏

文章目录

对象的继承

对象的继承

1.定义

JavaScript是没有明确的继承机制，也是通过模仿实现的。

首先父类和子类的构造函数是使用this关键字给所有属性和方法
赋值。为了实现继承，我们可以让父类的构造函数成为子类的方法。然后调用该子类的方法通过this关键字给的属性和方法赋值。这样子类就拥有父类的方法与属性了。

2.使用

方法一：使用函数来实现继承

第一步：在子类里面和父类进行关联

this.子类属性=父类构造函数名；

第二步;调用子类.关联函数名（【参数】）；//这一步就是把父类的函数和方法加入到子类里面

this.子类属性（【参数】）；

第三步删除关联delete this.子类属性//这个时候父类的方法和属性已经父之过来了

调用函数的时候无论是那种方式都要有小括号

方法二：使用call或者apply来实现继承

call方法:

语法: obj.call(thisObj, arg1, arg2, …

apply方法: .

语法: obj.apply(thisObj, [arg1, arg2, …);

解释：就是把object的参数复制到了thisobject里面，this代表所有的参数；

相同点:都是把obj(即this)绑定到 thisObj, 这时候thisObj具备
了obj的属性和方法。或者说thisObj继承了obj的属性和方法。
区别: apply接收的是数组参数, call接收的是连续参数。


<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>对象冒充方法</title>
		<script type="text/javascript">
			function add(a, b) {
				alert(a + b);
			}

			function sub(a, b) {
				alert(a - b);
			}

			add.call(sub, 8, 5);//这里的对象是sub一般书this

		</script>
	</head>
	<body></body>
</html>

显示是13

这个例子中改变sub对象的指向，sub指向了add,从而执行add
对象(函数)的操怍“8+5”。
。
注意: js 中的函数其实是对象，函数名是对Function对象的引
用。

再举一个例子

function Animal() {
	this.species = "动物";
  	this.species1 = "动物1";
}
//实现继承
function Cat(name, color) {
	this.name = name;
	this.color = color;
    Animal.call(this,this);
}

var cat = new Cat("猫", "白色");
document.write(cat.species); 
document.write(cat.species1);

在这里插入图片描述

call和apply的缺点

这种办法只能继承父类的实例属性，因而找不到方法。

方法三：原型链继承方法

首先回顾下原型的概念 : Javascript规定，每一个构造函数都有一prototype属性，指向另一个对象。这个对象的所有属性和方法，都会被构造函数的实例继承。那么我们可以将子类的prototype属性指向父类对象，继承父类的所有属性和方法从而实现继承。

JavaScript对象有一个特性，假设读取某个对象的属性x，首先会在这个对象的自身属性中查找。若没有找到，将会在此对象所处的原型链中查找属性x，一直到找到属性x或者无原型为止。

  对象属性分类：

  ① 自有属性：也可叫实例属性，指对象自身的属性。

  ② 继承属性：也可叫原型属性，指对象从原型中继承的属性。

凡是通过 new Function() 创建的对象都是函数对象，其他的都是普通对象。

在这里插入图片描述

举个例子

function Person (name, age) {
    this.name = name;
    this.age = age;
  Person.prototype.say = function(){
    document.write('hello, my name is ' + this.name);
};
}

//在此添加代码
function Man() {}
Man.prototype = new Person('Jack',30);//直接让这个构造函数成为他的原型
var man = new Man();
man.say();
document.write("<br>"+man.name);

在这里插入图片描述

原型链继承的缺点

因为是公用的一个，函数或者是属性值，相当于java的final一个函数对象改变他，其他的对象在调用他的时候，用的是改变过后的

解决办法组合继承

用借用构造函数模式来定义实例的属性，而原型模式用于定义方法和共享的属性

function Polygon(side) {
	this.side = side;
};

Polygon.prototype.getSize= function() {
	return 0;
};
//请修改Rectangle
function Rectangle(width, height) {
	this.width = width;
	this.height = height;
    Polygon.call(this,4);
};
Rectangle.prototype=new Polygon();
Rectangle.prototype.getSize=function()
{
  return this.width+"-"+this.height;//重点
  
};
var r = new Rectangle(3, 5);
document.write(r.side+"</br>");
document.write(r.getSize());

代码浪人

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
JavaScript面向对象-3

文章目录对象的继承1.定义2.使用方法一：使用函数来实现继承方法二：使用call或者apply来实现继承call和apply的缺点方法三：原型链继承方法原型链继承的缺点解决办法组合继承对象的继承1.定义JavaScript是没有明确的继承机制，也是通过模仿实现的。首先父类和子类的构造函数是使用this关键字给所有属性和方法赋值。为了实现继承，我们可以让父类的构造函数成为子类的方法。然后调用该子类的方法通过this关键字给的属性和方法赋值。这样子类就拥有父类的方法与属性了。2.使用方法一：使用
复制链接

扫一扫