javascript 中对象的继承〔转贴〕

yizhihongxing

以下是javascript中对象的继承攻略:

1. 继承的概念

在Javascript中,可以通过继承的方式来实现代码的复用性。继承是一种以已有类(或对象)为基础,创建新类(或对象)的技术,新创建的类或对象具有已有类(或对象)的属性和行为。

2. 原型链继承

原型链继承是Javascript中最基础的继承方式,它的原理就是通过让一个构造函数的原型指向另一个构造函数的实例来实现继承。

下面是一个通过原型链继承实现的示例:

function Person(name, age) {
    this.name = name;
    this.age = age;
}

Person.prototype.sayName = function() {
    console.log("My name is " + this.name);
}

function Student(name, age, score) {
    this.score = score;
}

Student.prototype = new Person();

var tom = new Student("Tom", 18, 90);
tom.sayName(); // 输出 "My name is Tom"

在上面的例子中,我们定义了两个构造函数:PersonStudentPerson表示人员基类,拥有nameage两个属性,以及sayName方法。StudentPerson的子类,同时拥有score属性,通过原型链从Person中继承了属性和方法。其中,通过将Student.prototype指向一个Person实例来实现继承。

3. 借用构造函数继承

借用构造函数继承又称为经典继承,它的实现原理是在子类构造函数中调用父类构造函数,通过callapply方法改变上下文,从而实现属性的继承。

下面是一个通过借用构造函数继承实现的示例:

function Person(name, age) {
    this.name = name;
    this.age = age;
}

function Student(name, age, score) {
    Person.call(this, name, age);
    this.score = score;
}

var tom = new Student("Tom", 18, 90);
console.log(tom.name); // 输出 "Tom"
console.log(tom.age);  // 输出 18
console.log(tom.score);// 输出 90

在上面的例子中,我们同样定义了PersonStudent这两个构造函数,但是在Student中调用了Person的构造函数,并且将this指向了当前的Student实例,这样就实现了属性的继承。

总结

在Javascript中,继承是实现代码复用的重要方法,可以通过原型链继承和借用构造函数继承两种方式来实现。其中,原型链继承适合通过实例方法和原型属性实现继承,而借用构造函数继承适合通过实例属性和方法实现继承。我们可以根据具体的情况选择不同的继承方式来实现代码的复用。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:javascript 中对象的继承〔转贴〕 - Python技术站

(0)
上一篇 2023年5月27日
下一篇 2023年5月27日

相关文章

  • 20行js代码实现的贪吃蛇小游戏

    20行js代码实现的贪吃蛇小游戏攻略 1. 实现思路 该贪吃蛇小游戏的实现思路非常简单,主要分为以下两步: 初始化游戏BOSS。 在游戏中添加监听事件,监听玩家的操作,并处理游戏逻辑。 2. 代码实现 游戏的实现代码如下: with(document){ a = appendChild(createElement("canvas")).g…

    JavaScript 2023年5月27日
    00
  • js实现轮播图效果 纯js实现图片自动切换

    下面我将为您详细讲解如何使用纯js实现轮播图效果,并提供两个示例。 轮播图效果的实现 核心思路 实现轮播图效果,主要的核心思路是使用定时器(setInterval)对图片进行自动切换,并且在用户触发左右切换按钮时进行图片的手动切换。 具体来说,实现图片的自动切换需要以下步骤: 获取图片容器和图片列表的宽度、当前图片的索引 使用定时器不断地切换图片,每隔一定的…

    JavaScript 2023年6月11日
    00
  • 用JS写了一个30分钟倒计时器的实现示例

    以下是用JS写一个30分钟倒计时器的实现示例的完整攻略: 步骤1:HTML结构 首先,在HTML文件中添加以下结构: <div id="timer">30:00</div> 这是倒计时器的外框,其中数字部分即为倒计时器的显示区域。 步骤2:CSS样式 接着,为倒计时器添加样式: #timer { font-size…

    JavaScript 2023年6月11日
    00
  • javascript实现获取字符串hash值

    获取字符串的哈希值实际上是将字符串转换为一个数字,这个数字唯一地代表了该字符串。JavaScript中可以使用哈希算法来获取字符串的哈希值,下面是获取字符串哈希值的完整攻略。 步骤1:选定哈希函数 JavaScript中常用的字符串哈希函数有很多,比如BKDRHash、APHash、JSHash等。这里以BKDRHash为例,其实现代码如下: functio…

    JavaScript 2023年5月28日
    00
  • javascript实现字符串反转的方法

    JavaScript实现字符串反转的方法 在JavaScript中,我们可以使用以下几种方式来实现字符串反转。 1. 利用split()和reverse()方法 使用JavaScript中的split()方法可以将字符串转换为一个字符数组,而数组中可以使用reverse()方法来反转字符数组,最后再使用join()方法将字符数组转成字符串。 function…

    JavaScript 2023年5月28日
    00
  • JavaScript实现cookie的写入、读取、删除功能

    当一个web页面被加载到浏览器中时,浏览器会为它分配一个cookie的存储区域。此时,开发者可以通过JavaScript代码来操作cookie的写入、读取和删除等功能。 写入cookie 可以使用document.cookie来写入cookie。document.cookie是一个字符串,它存储着当前网页的所有cookie。写入cookie的格式如下: do…

    JavaScript 2023年6月11日
    00
  • 谈谈JavaScript数组常用方法总结

    谈谈JavaScript数组常用方法总结 1. 什么是JavaScript数组 JavaScript数组可以理解为一组有序的数据集合,可以存储任意类型的数据,包括数字、字符串、对象、函数等等。数组是JavaScript中最常用的数据结构之一,因为它能够快速方便地对数据进行排序、搜索、过滤、截取等操作。 2. JavaScript数组常用方法 下面列举了一些常…

    JavaScript 2023年5月18日
    00
  • js 获取本周、上周、本月、上月、本季度、上季度的开始结束日期

    先来解释一下获取日期的方式:可以通过 JS 内置对象 Date() 进行日期的获取,以下是获取日期的方法: getFullYear():获取年份 getMonth():获取月份(注意:返回值是0-11,0代表一月,11代表十二月) getDate():获取日(注意:返回值是1-31之间的整数) getDay():获取星期几(注意:返回值是0-6,0代表星期日…

    JavaScript 2023年5月27日
    00
合作推广
合作推广
分享本页
返回顶部