JavaScript的继承和超级

问题描述

我正在学习JavaScript的第3天.我碰到了这段代码:

I am on Day 3 of learning JavaScript. I cames across this code:

class B {
    constructor(name) {
        this.name = name;
    }

    printn() {
        return this.name;
    }
}

class A extends B {
    constructor(name, age) {
        super(name);
        this._age = age;
    }

    get age() {
        return this._age;
    }

    printName(){
        return super.printn();
    }
}

let c = new A("Testing", "37");
Console.log(c.printn());

任何人都可以解释此代码的作用.什么是构造函数和super()关键字.我相信这是为了继承?我在Google上找到了一些小毛笔，但这似乎是最简单的例子，但解释得很少.

Can anybody explain what does this code do. What is the constructor and super() keyword. I believe it is for inheritance? I did Google to find some tuts but this seems to be the simplest example, but came with very little expalantion.

我无法使用此代码.

推荐答案

是的.上面的代码设置了类B，然后将其作为类A的子类. constructor是在创建类的新实例时调用的函数，如代码中的let c = new A("Testing", "37");行.与其他一些语言不同，在JavaScript中，一个类只能有一个构造函数.

That's right. The above sets up class B and then has class A subclass it. The constructor is the function called when you create a new instance of the class, as in the let c = new A("Testing", "37"); line in the code. Unlike some other languages, in JavaScript there can only be one constructor for a class.

super在子类中用于引用超类.在构造函数中，您调用 super就好像它是一个函数一样，它会调用超类的构造函数，从而使它有机会对由new创建的新对象进行初始化. .例如，在A的constructor中，super()调用B的constructor.

super is used in subclasses to refer to the superclass. In a constructor, you call super as though it were a function, and that calls the superclass's constructor function, giving it a chance to do its initialization of the new object that was created by new. So for instance, in A's constructor, super() calls B's constructor.

您还可以将super用作属性访问器表达式的源，以访问超类上的属性(包括方法).这就是A的printName方法中发生的事情，它使用super.printName()来调用B的printName方法. (这会失败，因为B没有printName方法； B的方法称为printn.)

You can also use super as the source of a property accessor expression to access properties (including methods) on the superclass. That's what's happening in A's printName method, where it uses super.printName() to call B's printName method. (Which will fail, because B doesn't have a printName method; B's method is called printn.)

如果我不指出这一点，我会很失落，尽管这看起来很像Java或C#中基于类的OOP，但事实并非如此.它是语法糖(一种很好的糖)，用于使用构造函数来设置JavaScript的常规原型继承.它极大地简化了使用构造函数创建原型继承层次结构的过程.如果我没有指出使用构造函数进行原型继承不是必需的，那么您无需通过Object.create使用构造函数就可以进行原型继承.

I'd be remiss if I didn't point out that although this looks a lot like the class-based OOP in, say, Java or C#, it isn't. It's syntactic sugar (the good kind of sugar) for setting up JavaScript's normal prototypical inheritance using constructor functions. It hugely simplifies setting up prototypical inheritance hierarchies using constructor functions. I'd also be remiss if I didn't point out that using constructor functions to do prototypical inheritance is not necessary, you can do prototypical inheritance without using constructor functions via Object.create.

还有更多值得探索的地方. MDN 可能是一个不错的起点.

There's a lot more to explore. MDN is probably a good starting point.

Console.log中的C不应大写，因此请更改

The C in Console.log shouldn't be capitalized, so change

Console.log(c.printn());

到

console.log(c.printn());

除此之外，如果您使用支持class的JavaScript引擎(例如Google Chrome或Mozilla Firefox中的那个)，则该代码可以正常工作，尽管再次注意A似乎期望B有一个printName方法，但是没有，最后的代码正在调用只有B拥有的printn(这很好，这只是意味着A的代码并没有真正涉及).

Other than that, if you're using a JavaScript engine that supports class (such as the one in Google Chrome or Mozilla Firefox), that code works fine although note again that A seems to expect B to have a printName method, but it doesn't, and the code at the end is calling printn which only B has (which is fine, it just means A's code isn't really involved).

class B {
    constructor(name) {
        this.name = name;
    }

    printn() {
        return this.name;
    }
}

class A extends B {
    constructor(name, age) {
        super(name);
        this._age = age;
    }

    get age() {
        return this._age;
    }

    printName(){
        return super.printName();
    }
}

let c = new A("Testing", "37");
console.log(c.printn());

这篇关于JavaScript的继承和超级的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！