文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Javascript继承-无法访问方法

JavaScript继承是一种面向对象编程的概念，它允许一个对象（子类）继承另一个对象（父类）的属性和方法。在JavaScript中，继承可以通过原型链和构造函数来实现。

  1. 原型链继承：
    • 概念：原型链继承是通过将子类的原型对象指向父类的实例来实现继承。
    • 分类：属于原型式继承。
    • 优势：简单易用，可以继承父类的属性和方法。
    • 应用场景：适用于单层继承关系，不适用于多层继承关系。
    • 示例代码：function Parent() { this.name = "Parent"; }
代码语言：txt
复制
 Parent.prototype.sayHello = function() {
代码语言：txt
复制
   console.log("Hello, I am " + this.name);
代码语言：txt
复制
 }
代码语言：txt
复制
 function Child() {
代码语言：txt
复制
   this.name = "Child";
代码语言：txt
复制
 }
代码语言：txt
复制
 Child.prototype = new Parent();
代码语言：txt
复制
 var child = new Child();
代码语言：txt
复制
 child.sayHello(); // 输出：Hello, I am Child
代码语言：txt
复制
 ```
  1. 构造函数继承：
    • 概念：构造函数继承是通过在子类的构造函数中调用父类的构造函数来实现继承。
    • 分类：属于经典继承。
    • 优势：可以继承父类的属性，避免了引用类型属性共享的问题。
    • 应用场景：适用于单个子类继承单个父类的情况。
    • 示例代码：function Parent() { this.name = "Parent"; }
代码语言：txt
复制
 Parent.prototype.sayHello = function() {
代码语言：txt
复制
   console.log("Hello, I am " + this.name);
代码语言：txt
复制
 }
代码语言：txt
复制
 function Child() {
代码语言：txt
复制
   Parent.call(this); // 调用父类的构造函数
代码语言：txt
复制
   this.name = "Child";
代码语言：txt
复制
 }
代码语言：txt
复制
 var child = new Child();
代码语言：txt
复制
 child.sayHello(); // 报错：child.sayHello is not a function
代码语言：txt
复制
 ```
  1. 组合继承：
    • 概念：组合继承是将原型链继承和构造函数继承结合起来的一种继承方式。
    • 分类：属于经典继承。
    • 优势：既可以继承父类的属性，又可以继承父类的方法。
    • 应用场景：适用于单个子类继承单个父类的情况。
    • 示例代码：function Parent() { this.name = "Parent"; }
代码语言：txt
复制
 Parent.prototype.sayHello = function() {
代码语言：txt
复制
   console.log("Hello, I am " + this.name);
代码语言：txt
复制
 }
代码语言：txt
复制
 function Child() {
代码语言：txt
复制
   Parent.call(this); // 调用父类的构造函数
代码语言：txt
复制
   this.name = "Child";
代码语言：txt
复制
 }
代码语言：txt
复制
 Child.prototype = new Parent(); // 继承父类的方法
代码语言：txt
复制
 var child = new Child();
代码语言：txt
复制
 child.sayHello(); // 输出：Hello, I am Child
代码语言：txt
复制
 ```
  1. 原型式继承：
    • 概念：原型式继承是通过创建一个临时的构造函数，将父类的实例作为新对象的原型来实现继承。
    • 分类：属于原型式继承。
    • 优势：简单易用，可以继承父类的属性和方法。
    • 应用场景：适用于需要快速创建对象并继承父类的情况。
    • 示例代码：function createObject(obj) { function F() {} F.prototype = obj; return new F(); }
代码语言：txt
复制
 var parent = {
代码语言：txt
复制
   name: "Parent",
代码语言：txt
复制
   sayHello: function() {
代码语言：txt
复制
     console.log("Hello, I am " + this.name);
代码语言：txt
复制
   }
代码语言：txt
复制
 };
代码语言：txt
复制
 var child = createObject(parent);
代码语言：txt
复制
 child.name = "Child";
代码语言：txt
复制
 child.sayHello(); // 输出：Hello, I am Child
代码语言：txt
复制
 ```
  1. 寄生式继承：
    • 概念：寄生式继承是在原型式继承的基础上，增强对象，返回一个新对象。
    • 分类：属于原型式继承。
    • 优势：可以在继承父类的同时，对新对象进行增强。
    • 应用场景：适用于需要在继承父类的基础上进行扩展的情况。
    • 示例代码：function createObject(obj) { var clone = Object.create(obj); clone.sayHello = function() { console.log("Hello, I am " + this.name); }; return clone; }
代码语言：txt
复制
 var parent = {
代码语言：txt
复制
   name: "Parent"
代码语言：txt
复制
 };
代码语言：txt
复制
 var child = createObject(parent);
代码语言：txt
复制
 child.name = "Child";
代码语言：txt
复制
 child.sayHello(); // 输出：Hello, I am Child
代码语言：txt
复制
 ```
  1. 寄生组合式继承：
    • 概念：寄生组合式继承是在组合继承的基础上，通过优化父类的实例创建过程，避免了重复调用父类的构造函数。
    • 分类：属于经典继承。
    • 优势：既可以继承父类的属性，又可以继承父类的方法，避免了重复调用父类的构造函数。
    • 应用场景：适用于单个子类继承单个父类的情况。
    • 示例代码：function Parent() { this.name = "Parent"; }
代码语言：txt
复制
 Parent.prototype.sayHello = function() {
代码语言：txt
复制
   console.log("Hello, I am " + this.name);
代码语言：txt
复制
 }
代码语言：txt
复制
 function Child() {
代码语言：txt
复制
   Parent.call(this); // 调用父类的构造函数
代码语言：txt
复制
   this.name = "Child";
代码语言：txt
复制
 }
代码语言：txt
复制
 // 优化父类的实例创建过程
代码语言：txt
复制
 Child.prototype = Object.create(Parent.prototype);
代码语言：txt
复制
 Child.prototype.constructor = Child;
代码语言：txt
复制
 var child = new Child();
代码语言：txt
复制
 child.sayHello(); // 输出：Hello, I am Child
代码语言：txt
复制
 ```

推荐的腾讯云相关产品和产品介绍链接地址：

相关搜索:JavaScript原型继承解决方法javascript继承无法访问Javascript中的对象方法继承期间无法访问基址javascript对象继承Javascript实现继承javascript继承详解Javascript继承资料Javascript Prototypal继承？javascript的继承Javascript继承对象Javascript继承(超级)Javascript继承链Javascript类，继承原型继承如何影响JavaScript中的方法覆盖？继承时无法访问类字段js 继承 方法js 继承方法java继承 方法方法注释继承
相关搜索:
页面内容是否对你有帮助？
有帮助
没帮助

相关·内容

JavaScript 继承

创建的子类将继承超类的所有属性和方法，包括构造函数及方法的实现。记住，所有属性和方法都是公用的，因此子类可直接访问这些方法。子类还可添加超类中没有的新属性和方法，也可以覆盖超类的属性和方法。...继承的方式 和其他功能一样，ECMAScript 实现继承的方式不止一种。这是因为 JavaScript 中的继承机制并不是明确规定的，而是通过模仿实现的。...由于这种继承方法的流行，ECMAScript 的第三版为 Function 对象加入了两个方法，即 call() 和 apply()。...创建类的最好方式是 用构造函数定义属性，用原型定义方法。这种方式同样适用于继承机制，用对象冒充继承构造函数的属性，用原型链继承 prototype 对象的方法。...ES6 的继承机制完全不同，实质是先将父类实例对象的属性和方法，加到 this 上面（所以必须先调用 super 方法），然后再用子类的构造函数修饰 this,使得父类的所有行为都可以继承。

31620

【说站】javascript继承中方法的使用

javascript继承中方法的使用 1、当子类想要覆盖父类的方法，或者增加父类没有的方法时，通过直接给子类的原型添加这种方法。 如果此时父类有这种方法，就会覆盖父类继承的现有方法。...我们通常不使用这种方法，因此我们不能继承父亲构造函数的原型。...// 继承SuperType SubType.prototype = new SuperType(); // 通过对象字面量添加新方法 SubType.prototype = {     fn1() {...             }     fn2() {              } } 以上就是javascript继承中方法的使用，希望对大家有所帮助。...更多Javascript学习指路：Javascript 推荐操作环境：windows7系统、jquery3.2.1版本，DELL G3电脑。 收藏 | 0点赞 | 0打赏

29640

    • Javascript继承，再谈

    说到Javascript的继承，相信只要是前端开发者都有所了解或应用，因为这是太基础的知识了。但不知各位有没有深入去理解其中的玄机与奥秘。...上述实现为寄生组合继承在，算比较通用且完美的一种方案了。 object.create实现继承 这是一个升级版本的类式继承，需要了解object.create方法。...我们还需要了解的方法：Object.setPrototypeOf（内部原型的写方法）；Object.getPrototypeOf（内部原型的读方法）。...原因摘录来源于MDN: 由于现代 JavaScript 引擎优化属性访问所带来的特性的关系，更改对象的 [[Prototype]]在各个浏览器和 JavaScript 引擎上都是一个很慢的操作。...es6对类继承提供了原生的支持，这让Javascript更像后端语言了，简单使用如下： class Animate{ constructor(name){ this.name

    801110

    JavaScript组合继承

    组合继承（Combination Inheritance）是 JavaScript 中一种常用的继承模式，它结合了原型链继承和构造函数继承的优点。...通过组合继承，我们可以使用构造函数继承来继承实例属性，并通过原型链继承来继承共享的方法和属性。原理组合继承的原理是结合使用构造函数和原型链。...通过构造函数来继承实例属性和方法，通过原型链来继承共享的属性和方法。具体步骤如下：定义一个父类（基类），它包含一些共享的属性和方法。我们可以使用构造函数来定义这些属性和方法。...定义一个子类（派生类），它继承了父类的属性和方法。我们可以使用构造函数继承来继承父类的实例属性和方法。将子类的原型设置为一个新创建的父类的实例。这样子类就能够通过原型链继承父类的共享属性和方法。...这种组合继承的方法能够实现子类既能够继承父类的实例属性和方法，又能够继承父类的共享属性和方法。它是 JavaScript 中常用的一种继承方式。

    26610

    JavaScript实现继承

    组合继承是原型链继承+构造函数继承，原型链继承的属性，构造函数继承方法。...age) { Parent.call(this, name); this.age = age; } function prototype(Child,Parent){ //获得父类型原型上的方法...prototype.constructor = Child Child.prototype = prototype } prototype(Child,Parent) //必须执行这个函数，才能进行给子类型原型写方法...构造函数继承解决了上述问题，但无法实现函数的复用，方法在构造函数中定义，每次创建子类实例都会创建一个新方法，占用内存。...组合继承解决了上述问题，使用原型继承继承父类的属性Parent.call(this)，使用构造函数继承父类的方法new Parent()。但子类调用了两次父类构造函数，生成了两个父类实例。

    40541

    JavaScript实现继承

    简介 本文不准备深入细节，主要是对《JavaScript高级程序设计中》介绍的JS如何实现继承做一个总结，毕竟好记性不如烂笔头。文末会附带一张神图，搞清楚这张图，原型链也就没有什么问题了。...ES5实现继承的六种方式 1. 原型链 基本思想： 利用原型链让一个引用类型继承另一个引用类型的属性和方法。...使用原型链实现对原型属性和方法的继承，而通过借用构造函数来实现对实例属性的继承。...组合继承是JavaScript最常用的继承模式，它最大的问题就是无论在什么情况下，都会调用两次父类构造函数：一次是在创建子类原型的时候，另一次是在子类构造函数内部。...总结 ES5实现继承有6种方式： 原型链继承 借用构造函数继承 组合继承 原型式继承 寄生式继承 寄生组合式继承 寄生组合式继承是大家公认的最好的实现引用类型继承的方法。

    65530

    JavaScript实现继承

    众所周知，JavaScript 这门语言在 ES6 出来之前是没有类（class）这一概念的，所以 JavaScript 中的类都是通过原型链来实现的。...同样，使用 JavaScript 也能实现面向对象的实现继承。以下是《高程》（第三版）的读书笔记。 原型链 通过原型链实现继承很容易理解，也很简单。将子类的原型指向父类的实例即可。...注意： 如果想要给子类添加原型上的方法，需要在子类继承了父类后添加，否则会被父类实例所覆盖。 也不要用对象字面量的方式给子类原型添加新方法，这会使得之前的继承失效。...寄生组合式继承 通过借用构造函数来继承属性，通过原型链的混成形式来继承方法。寄生组合模式使用寄生模式来实现对父类原型的继承，再将结果指定给子类的原型。...---- 往期精选文章 ES6中一些超级好用的内置方法 浅谈web自适应 使用Three.js制作酷炫无比的无穷隧道特效 一个治愈JavaScript疲劳的学习计划 全栈工程师技能大全 WEB前端性能优化常见方法

    51020

    JavaScript原型与继承

    几乎所有 JavaScript 中的对象都是位于原型链顶端的 Object 的实例。 尽管这种原型继承通常被认为是 JavaScript 的弱点之一，但是原型继承模型本身实际上比经典模型更强大。...---- 基于原型链的继承 继承属性 JavaScript 对象是动态的属性“包”（指其自己的属性）。JavaScript 对象有一个指向一个原型对象的链。...[[Prototype]] 为 null，停止搜索 // 找不到 d 属性，返回 undefined 继承方法 JavaScript 并没有其他基于类的语言所定义的“方法”。...在 JavaScript 里，任何函数都可以添加到对象上作为对象的属性。函数的继承与其他的属性继承没有差别，包括上面的“属性遮蔽”（这种情况相当于其他语言的方法重写）。...要检查对象是否具有自己定义的属性，而不是其原型链上的某个属性，则必须使用所有对象从 Object.prototype 继承的 hasOwnProperty 方法。

    52510

    JavaScript继承与聚合

    一，继承 第一种方式：类与被继承类直接耦合度高 1，首先，准备一个可以被继承的类（父类），例如 //创建一个人员类 function Person(name) {//现在Person里面的域是由...;//确保继承后任然是Teacher自己的构造函数  （步骤2）为子类扩展一些方法，用于访问从父类继承的内容 Teacher.prototype.getBook=function () {...return this.name+" "+this.books; } （步骤3）使用已经继承好的类 var jim=new Teacher("Jim","Javascript");...//继承 extend(Author,Person);//（子类，父类） 5，使用已经继承好的类 var peter=new Author("Peter","Javascript")...__proto__[methodName]=givingClass[methodName];//直接获得类中的方法，因为方法是直接写在方法内部的。

    71240

    简单的JavaScript继承

    为了正在写的这本书（译者注：这本书是《忍者秘籍》），我最近做了许多关于JavaScript继承的工作，并在此基础上研究了几种不同的JavaScript经典继承模拟技术。...所有的“类”都继承于一个祖先：Class。因此，如果要创建一个新类，它必须是Class的子类。 该语法最大的挑战是访问被覆盖的方法，而且有时这些方法的上下文也有可能被修改了。通过 this...._super()调用 Person超类的原始 init()和 dance()方法 本例的代码使我很愉快：它使得“类”的概念作为一种结构，保持继承简单，并且允许调用超类方法。...保留父级方法 当你正在实例化的时候，创建一个类并且继承超类的方法，我们保留了访问被覆盖方法的能力，最后在这个特别的实现中，使用了一个新的临时方法( ....我认为这个简单的代码可以说明很多的事情(更容易去学习，去继承，更少的下载)，因此我认为这个实现是开始和学习JavaScript类构造和继承的基础的好地方。

    59220

    Javascript 的继承总结

    类式继承（原型链继承） 类式继承非常简单，总结来说就是：子类的原型的 prototype 被赋予父类的实例，从而继承父类的属性和方法。...复制代码 可以看出，构造函数继承已经完美解决了类式继承的两个问题，但是出现了一个新的问题，即：构造函数继承只继承父类属性，父类中方法不会被子类继承。...组合继承 一看上面两个方式都或多或少有些问题，这就需要用到组合继承，也是JavaScript中最常见的继承方式。总结来说就是一句话，类式继承 + 构造函数继承。...，不会继承父类方法，每次创建对象时都需要创建一次方法。.../#docs/class… 参考 《JavaScript设计模式》 《JavaScript高级程序设计（第二版）》

    26820

    JavaScript对象的继承

    JavaScript 对象的继承 1. 原型链继承 基于原型链，即把一个对象的原型设置为另一个对象的实例，那么这个对象实例也就拥有了另一个对象上的属性。...组合继承模式 结合原型链和构造函数，原型链实现对原型属性和方法的基础，构造函数实现实例方法的继承： function Father(name) {  this.name = name;  this.nationality...在子类的构造函数中调用父类构造函数_  Father.call(this,name) } Son.prototype = new Father() Son.prototype.constructor = Son; 这种方法也是推荐的实现继承的方式...当继承的父对象不是自定义类型和构造函数的情况下，可以采用寄生继承模式。 5. 寄生组合式继承 组合继承模式是最常用的模式，但也不是完美的。组合继承会执行两次父类构造函数。...ES6 中类的继承 在 es6 中，有了 class(JavaScript 的 class 只是一种语法糖，覆盖在基于构造函数和原型的模式上)，我们就可以使用 extends 来实现类的继承了： class

    70620

    JavaScript原型链继承

    什么是原型链继承？在JavaScript中，每个对象都有一个原型（prototype），原型本身也是一个对象。...当我们访问一个对象的属性或方法时，如果该对象本身没有该属性或方法，JavaScript会自动去它的原型对象中查找。...如果原型对象也没有找到，JavaScript会继续在原型对象的原型上查找，这样形成了一个原型链。原型链继承是基于原型链的继承机制。通过将一个对象的原型指向另一个对象，从而实现对属性和方法的继承。...当我们在一个对象上调用属性或方法时，如果该对象本身没有该属性或方法，JavaScript会在原型链上继续向上查找，直到找到对应的属性或方法或者到达原型链的末尾。...原型链继承的特点原型链继承具有以下特点：属性和方法的继承：通过原型链继承，子对象可以继承父对象的属性和方法。

    39410
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券