inheritance - How to use polymorphism in Javascript - Stack Overflow

admin管理员组

文章数量:1310385

Most languages use single inheritance for classes. And it's fairly obvious the pattern to do this (for example in Swift code below). I am still trying to wrap my head around the pattern in JavaScript to create a object hierarchy and re-use class functions and override class functions

class animal {
    func talk() {
        print ("?")
    }
}

class bird : animal {
    override func talk() {
        print("tweet tweet")
    }
    func fly() {
        print("flap flap")
    }
}

class parrot : bird {
    override func talk() {
        print("polly want a cracker")
    }
}

var a = animal()
var b = bird()
var p = parrot()

a.talk()  /// ?
b.talk()  /// tweet tweet
b.fly()   /// flap flap
p.talk()  /// polly want a cracker
p.fly()   /// flap flap

I think my problem is the Javascript code looks nothing like this. What is the equivalent Javascript code so I can figure out the pattern?

Most languages use single inheritance for classes. And it's fairly obvious the pattern to do this (for example in Swift code below). I am still trying to wrap my head around the pattern in JavaScript to create a object hierarchy and re-use class functions and override class functions

class animal {
    func talk() {
        print ("?")
    }
}

class bird : animal {
    override func talk() {
        print("tweet tweet")
    }
    func fly() {
        print("flap flap")
    }
}

class parrot : bird {
    override func talk() {
        print("polly want a cracker")
    }
}

var a = animal()
var b = bird()
var p = parrot()

a.talk()  /// ?
b.talk()  /// tweet tweet
b.fly()   /// flap flap
p.talk()  /// polly want a cracker
p.fly()   /// flap flap

I think my problem is the Javascript code looks nothing like this. What is the equivalent Javascript code so I can figure out the pattern?

• javascript
• inheritance
• polymorphism

Share Improve this question Follow asked Jun 28, 2016 at 21:53 swdevswdev 3,08122 gold badges2727 silver badges3838 bronze badges 2

• Possible duplicate of what is polymorphism in Javascript – Heretic Monkey Commented Jun 28, 2016 at 21:59
• Well, not to nitpik but that question was sort of cluttered with the "what is" part of the question. I have no problem with that just need a clean one-to-one parison of "how" to convert it. – swdev Commented Jun 28, 2016 at 22:05

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 8

You pretty much answered your own question. You just have to learn JavaScript's syntax for it.

I think my problem is the Javascript code looks nothing like this.

1. It's not a "problem" for you if a language looks different from another one

2. The Swift code you provided is syntactically very close to the JavaScript (ES6) you'd need to write to express the same hierarchy of classes

class Animal {
  talk() {
    console.log('?')
  }
}

class Bird extends Animal {
  talk() {
    console.log('tweet tweet')
  }
  fly() {
    console.log('flap flap')
  }
}

class Parrot extends Bird {
  talk() {
    console.log('polly want a cracker')
  }
}

var a = new Animal()
var b = new Bird()
var p = new Parrot()

a.talk()
b.talk()
b.fly()
p.talk()
p.fly()

---

If you want to setup a "class" inheritance in ES5, you can do this

// Animal "class"
function Animal() {}

// Animal methods
Animal.prototype.talk = function talk() {
  console.log('?')
}

// ------------------------------
// Bird "class"
function Bird() {
  // if you want to call the parent constructor, you can do that here
  // Animal.call(this, arg1, arg2, ... argN)
}

// Bird inherits from Animal
Bird.prototype = Object.create(Animal.prototype)
Bird.prototype.constructor = Bird

// Bird methods
Bird.prototype.talk = function() {
  console.log('tweet tweet')
}
Bird.prototype.fly = function() {
  console.log('flap flap')
}

// ------------------------------
// Parrot "class"
function Parrot() {
  // if you want to call the parent constructor, you can do that here
  // Bird.call(this, arg1, arg2, ... argN)
}

// Parrot inherits from Bird
Parrot.prototype = Object.create(Bird.prototype)
Parrot.prototype.constructor = Parrot

// Parrot methods
Parrot.prototype.talk = function() {
  console.log('polly want a cracker')
}

var a = new Animal()
var b = new Bird()
var p = new Parrot()

a.talk()
b.talk()
b.fly()
p.talk()
p.fly()

There are two answers, ES6:

class animal {
    talk() {
        console.log("?")
    }
}

class bird extends animal {
    talk() {
        console.log("tweet tweet")
    }
    fly() {
        console.log("flap flap")
    }
}

class parrot extends bird {
    talk() {
        console.log("polly want a cracker")
    }
}

var a = new animal()
var b = new bird()
var p = new parrot()

a.talk()  /// ?
b.talk()  /// tweet tweet
b.fly()   /// flap flap
p.talk()  /// polly want a cracker
p.fly()   /// flap flap

and ES5:

function animal() {

}

animal.prototype.talk = function () {
    console.log("?")
};

function bird() {
    animal.call(this)
}

bird.prototype = Object.create(
    animal.prototype,
    {constructor: {value: bird}}
);

bird.prototype.talk = function () {
    console.log("tweet tweet")
};

bird.prototype.fly = function () {
    console.log("flap flap")
};

function parrot() {
    bird.call(this);
}

parrot.prototype = Object.create(
    bird.prototype,
    {constructor: {value: parrot}}
);

parrot.prototype.talk = function () {
    console.log("polly want a cracker")
};


var a = new animal()
var b = new bird()
var p = new parrot()

a.talk()  /// ?
b.talk()  /// tweet tweet
b.fly()   /// flap flap
p.talk()  /// polly want a cracker
p.fly()   /// flap flap

本文标签： inheritanceHow to use polymorphism in JavascriptStack Overflow