如何在JavaScript中创建一个抽象基类?如何在JavaScript中创建一个抽象基类?(How

2019-05-12 19:24发布

是否有可能以模拟在JavaScript中抽象基类? 什么是最优雅的方式来做到这一点?

再说了,我想要做的事,如: -

var cat = new Animal('cat');
var dog = new Animal('dog');

cat.say();
dog.say();

它应该输出:“树皮”,“喵喵”

Answer 1:

一个简单的方法来创建一个抽象类是这样的:

/**
 @constructor
 @abstract
 */
var Animal = function() {
    if (this.constructor === Animal) {
      throw new Error("Can't instantiate abstract class!");
    }
    // Animal initialization...
};

/**
 @abstract
 */
Animal.prototype.say = function() {
    throw new Error("Abstract method!");
}

Animal “类”和say方法都是抽象的。

创建一个实例将引发错误:

new Animal(); // throws

这是你如何从中“继承”:

var Cat = function() {
    Animal.apply(this, arguments);
    // Cat initialization...
};
Cat.prototype = Object.create(Animal.prototype);
Cat.prototype.constructor = Cat;

Cat.prototype.say = function() {
    console.log('meow');
}

Dog看起来就像它。

这是你的情况下如何发挥出来:

var cat = new Cat();
var dog = new Dog();

cat.say();
dog.say();

小提琴这里 (看控制台输出)。



Answer 2:

你的意思是这样的:

function Animal() {
  //Initialization for all Animals
}

//Function and properties shared by all instances of Animal
Animal.prototype.init=function(name){
  this.name=name;
}
Animal.prototype.say=function(){
    alert(this.name + " who is a " + this.type + " says " + this.whattosay);
}
Animal.prototype.type="unknown";

function Cat(name) {
    this.init(name);

    //Make a cat somewhat unique
    var s="";
    for (var i=Math.ceil(Math.random()*7); i>=0; --i) s+="e";
    this.whattosay="Me" + s +"ow";
}
//Function and properties shared by all instances of Cat    
Cat.prototype=new Animal();
Cat.prototype.type="cat";
Cat.prototype.whattosay="meow";


function Dog() {
    //Call init with same arguments as Dog was called with
    this.init.apply(this,arguments);
}

Dog.prototype=new Animal();
Dog.prototype.type="Dog";
Dog.prototype.whattosay="bark";
//Override say.
Dog.prototype.say = function() {
        this.openMouth();
        //Call the original with the exact same arguments
        Animal.prototype.say.apply(this,arguments);
        //or with other arguments
        //Animal.prototype.say.call(this,"some","other","arguments");
        this.closeMouth();
}

Dog.prototype.openMouth=function() {
   //Code
}
Dog.prototype.closeMouth=function() {
   //Code
}

var dog = new Dog("Fido");
var cat1 = new Cat("Dash");
var cat2 = new Cat("Dot");


dog.say(); // Fido the Dog says bark
cat1.say(); //Dash the Cat says M[e]+ow
cat2.say(); //Dot the Cat says M[e]+ow


alert(cat instanceof Cat) // True
alert(cat instanceof Dog) // False
alert(cat instanceof Animal) // True


Answer 3:

JavaScript类和继承(ES6)

据ES6,您可以使用JavaScript类和继承来完成你所需要的。

JavaScript类,在ECMAScript中介绍了2015年,有超过JavaScript的现有的基于原型的继承主要是语法糖。

参考: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes

首先,我们定义抽象类。 这个类不能被实例化,但可以延长。 我们也可以定义必须在扩展这一个所有类实现的功能。

/**
 * Abstract Class Animal.
 *
 * @class Animal
 */
class Animal {

  constructor() {
    if (this.constructor == Animal) {
      throw new Error("Abstract classes can't be instantiated.");
    }
  }

  say() {
    throw new Error("Method 'say()' must be implemented.");
  }

  eat() {
    console.log("eating");
  }
}

在此之后,我们可以创建具体的类。 这些类将继承抽象类的所有功能和特性。

/**
 * Dog.
 *
 * @class Dog
 * @extends {Animal}
 */
class Dog extends Animal {
  say() {
    console.log("bark");
  }
}

/**
 * Cat.
 *
 * @class Cat
 * @extends {Animal}
 */
class Cat extends Animal {
  say() {
    console.log("meow");
  }
}

/**
 * Horse.
 *
 * @class Horse
 * @extends {Animal}
 */
class Horse extends Animal {}

而结果...

// RESULTS

new Dog().eat(); // eating
new Cat().eat(); // eating
new Horse().eat(); // eating

new Dog().say(); // bark
new Cat().say(); // meow
new Horse().say(); // Error: Method say() must be implemented.

new Animal(); // Error: Abstract classes can't be instantiated.


Answer 4:

你可能想看看院长爱德华兹的基类: http://dean.edwards.name/weblog/2006/03/base/

另外,还有在JavaScript这个例子/条由Douglas Crockford的经典传承: http://www.crockford.com/javascript/inheritance.html



Answer 5:

是否有可能以模拟在JavaScript中抽象基类?

当然。 大约有一千种方式来实现类/实例系统中的JavaScript。 这里是一个:

// Classes magic. Define a new class with var C= Object.subclass(isabstract),
// add class members to C.prototype,
// provide optional C.prototype._init() method to initialise from constructor args,
// call base class methods using Base.prototype.call(this, ...).
//
Function.prototype.subclass= function(isabstract) {
    if (isabstract) {
        var c= new Function(
            'if (arguments[0]!==Function.prototype.subclass.FLAG) throw(\'Abstract class may not be constructed\'); '
        );
    } else {
        var c= new Function(
            'if (!(this instanceof arguments.callee)) throw(\'Constructor called without "new"\'); '+
            'if (arguments[0]!==Function.prototype.subclass.FLAG && this._init) this._init.apply(this, arguments); '
        );
    }
    if (this!==Object)
        c.prototype= new this(Function.prototype.subclass.FLAG);
    return c;
}
Function.prototype.subclass.FLAG= new Object();

VAR =猫新动物( '猫');

这是不是一个真正的抽象基类课程。 你的意思是这样的:

var Animal= Object.subclass(true); // is abstract
Animal.prototype.say= function() {
    window.alert(this._noise);
};

// concrete classes
var Cat= Animal.subclass();
Cat.prototype._noise= 'meow';
var Dog= Animal.subclass();
Dog.prototype._noise= 'bark';

// usage
var mycat= new Cat();
mycat.say(); // meow!
var mygiraffe= new Animal(); // error!


Answer 6:

Animal = function () { throw "abstract class!" }
Animal.prototype.name = "This animal";
Animal.prototype.sound = "...";
Animal.prototype.say = function() {
    console.log( this.name + " says: " + this.sound );
}

Cat = function () {
    this.name = "Cat";
    this.sound = "meow";
}

Dog = function() {
    this.name = "Dog";
    this.sound  = "woof";
}

Cat.prototype = Object.create(Animal.prototype);
Dog.prototype = Object.create(Animal.prototype);

new Cat().say();    //Cat says: meow
new Dog().say();    //Dog says: woof 
new Animal().say(); //Uncaught abstract class! 


Answer 7:

您可以通过使用对象的原型创建抽象类,一个简单的例子可以如下:

var SampleInterface = {
   addItem : function(item){}  
}

你可以改变上面的方法还是不行,它是由你,当你实现它。 有关详细的观察,你可能要访问这里 。



Answer 8:

问题是很老,但我创造了一些可能的解决方案如何创造抽象的“类”和对象的块创建该类型。

 //our Abstract class var Animal=function(){ this.name="Animal"; this.fullname=this.name; //check if we have abstract paramater in prototype if (Object.getPrototypeOf(this).hasOwnProperty("abstract")){ throw new Error("Can't instantiate abstract class!"); } }; //very important - Animal prototype has property abstract Animal.prototype.abstract=true; Animal.prototype.hello=function(){ console.log("Hello from "+this.name); }; Animal.prototype.fullHello=function(){ console.log("Hello from "+this.fullname); }; //first inheritans var Cat=function(){ Animal.call(this);//run constructor of animal this.name="Cat"; this.fullname=this.fullname+" - "+this.name; }; Cat.prototype=Object.create(Animal.prototype); //second inheritans var Tiger=function(){ Cat.call(this);//run constructor of animal this.name="Tiger"; this.fullname=this.fullname+" - "+this.name; }; Tiger.prototype=Object.create(Cat.prototype); //cat can be used console.log("WE CREATE CAT:"); var cat=new Cat(); cat.hello(); cat.fullHello(); //tiger can be used console.log("WE CREATE TIGER:"); var tiger=new Tiger(); tiger.hello(); tiger.fullHello(); console.log("WE CREATE ANIMAL ( IT IS ABSTRACT ):"); //animal is abstract, cannot be used - see error in console var animal=new Animal(); animal=animal.fullHello(); 

正如你所看到的最后一个对象给我们的错误,这是因为动物在原型属性abstract 。 可以肯定的是动物不是具有Animal.prototype在原型链中我做的:

Object.getPrototypeOf(this).hasOwnProperty("abstract")

所以,我确认我最亲近的原型对象具有abstract财产,只有直接从创建的对象Animal原型会对真正的这个条件。 功能hasOwnProperty只检查当前对象的属性不是他的原型,所以这给了我们肯定属性这里声明没有原型链100%。

从对象的后代中的每个对象继承了hasOwnProperty方法。 这种方法可以被用来确定对象是否具有指定的属性作为该对象的直接属性; 不像在运营商,这种方法不检查下来对象的原型链。 更多关于它:

在我的建议,我们没有改变constructor后,每一次Object.create喜欢它是由@Jordão酒店目前最好的答案。

解决方案还使层次结构创建许多抽象类,我们只需要创建一个abstract的原型属性。



Answer 9:

function Animal(type) {
    if (type == "cat") {
        this.__proto__ = Cat.prototype;
    } else if (type == "dog") {
        this.__proto__ = Dog.prototype;
    } else if (type == "fish") {
        this.__proto__ = Fish.prototype;
    }
}
Animal.prototype.say = function() {
    alert("This animal can't speak!");
}

function Cat() {
    // init cat
}
Cat.prototype = new Animal();
Cat.prototype.say = function() {
    alert("Meow!");
}

function Dog() {
    // init dog
}
Dog.prototype = new Animal();
Dog.prototype.say = function() {
    alert("Bark!");
}

function Fish() {
    // init fish
}
Fish.prototype = new Animal();

var newAnimal = new Animal("dog");
newAnimal.say();

这是不能保证工作的__proto__不是一个标准的变量,但它的作品至少在Firefox和Safari。

如果你不明白它是如何工作的,了解原型链。



Answer 10:

JavaScript可以有继承,看看下面的网址:

http://www.webreference.com/js/column79/

安德鲁



Answer 11:

您可能要执行的另一件事情就是确保您的抽象类不是实例。 您可以通过定义充当设置为抽象类的构造函数FLAG那些功能做到这一点。 于是,这将试图建立,它将调用抛出其含有异常的构造标志。 实施例下面:

(function(){

var FLAG_ABSTRACT = function(__class){

    throw "Error: Trying to instantiate an abstract class:"+__class
}

var Class = function (){

    Class.prototype.constructor = new FLAG_ABSTRACT("Class");       
}

    //will throw exception
var  foo = new Class();

})()



Answer 12:

我们可以利用Factory在这种情况下设计模式。 JavaScript中使用prototype继承父成员。

定义父类的构造。

var Animal = function() {
  this.type = 'animal';
  return this;
}
Animal.prototype.tired = function() {
  console.log('sleeping: zzzZZZ ~');
}

然后创建儿童类。

// These are the child classes
Animal.cat = function() {
  this.type = 'cat';
  this.says = function() {
    console.log('says: meow');
  }
}

然后定义儿童类的构造函数。

// Define the child class constructor -- Factory Design Pattern.
Animal.born = function(type) {
  // Inherit all members and methods from parent class,
  // and also keep its own members.
  Animal[type].prototype = new Animal();
  // Square bracket notation can deal with variable object.
  creature = new Animal[type]();
  return creature;
}

测试它。

var timmy = Animal.born('cat');
console.log(timmy.type) // cat
timmy.says(); // meow
timmy.tired(); // zzzZZZ~

这里的Codepen环节的完整的例子编码。



Answer 13:

//Your Abstract class Animal
function Animal(type) {
    this.say = type.say;
}

function catClass() {
    this.say = function () {
        console.log("I am a cat!")
    }
}
function dogClass() {
    this.say = function () {
        console.log("I am a dog!")
    }
}
var cat = new Animal(new catClass());
var dog = new Animal(new dogClass());

cat.say(); //I am a cat!
dog.say(); //I am a dog!


Answer 14:

我认为所有这些问题的答案特地前两个(由一些和Jordão酒店 )与传统的原型基础JS概念清楚地回答这个问题。
现在,只要你想,动物类的构造函数根据传递的参数以施工行为,我认为这是非常相似的基本行为Creational Patterns ,例如工厂模式 。

在这里,我做了一个小方法,使其工作方式。

var Animal = function(type) {
    this.type=type;
    if(type=='dog')
    {
        return new Dog();
    }
    else if(type=="cat")
    {
        return new Cat();
    }
};



Animal.prototype.whoAreYou=function()
{
    console.log("I am a "+this.type);
}

Animal.prototype.say = function(){
    console.log("Not implemented");
};




var Cat =function () {
    Animal.call(this);
    this.type="cat";
};

Cat.prototype=Object.create(Animal.prototype);
Cat.prototype.constructor = Cat;

Cat.prototype.say=function()
{
    console.log("meow");
}



var Dog =function () {
    Animal.call(this);
    this.type="dog";
};

Dog.prototype=Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

Dog.prototype.say=function()
{
    console.log("bark");
}


var animal=new Animal();


var dog = new Animal('dog');
var cat=new Animal('cat');

animal.whoAreYou(); //I am a undefined
animal.say(); //Not implemented


dog.whoAreYou(); //I am a dog
dog.say(); //bark

cat.whoAreYou(); //I am a cat
cat.say(); //meow


Answer 15:

/****************************************/
/* version 1                            */
/****************************************/

var Animal = function(params) {
    this.say = function()
    {
        console.log(params);
    }
};
var Cat = function() {
    Animal.call(this, "moes");
};

var Dog = function() {
    Animal.call(this, "vewa");
};


var cat = new Cat();
var dog = new Dog();

cat.say();
dog.say();


/****************************************/
/* version 2                            */
/****************************************/

var Cat = function(params) {
    this.say = function()
    {
        console.log(params);
    }
};

var Dog = function(params) {
    this.say = function()
    {
        console.log(params);
    }
};

var Animal = function(type) {
    var obj;

    var factory = function()
    {
        switch(type)
        {
            case "cat":
                obj = new Cat("bark");
                break;
            case "dog":
                obj = new Dog("meow");
                break;
        }
    }

    var init = function()
    {
        factory();
        return obj;
    }

    return init();
};


var cat = new Animal('cat');
var dog = new Animal('dog');

cat.say();
dog.say();


Answer 16:

如果你想确保你的基类及其成员在这里严格抽象的是,这是否给你一个基类:

class AbstractBase{
    constructor(){}
    checkConstructor(c){
        if(this.constructor!=c) return;
        throw new Error(`Abstract class ${this.constructor.name} cannot be instantiated`);
    }
    throwAbstract(){
        throw new Error(`${this.constructor.name} must implement abstract member`);}    
}

class FooBase extends AbstractBase{
    constructor(){
        super();
        this.checkConstructor(FooBase)}
    doStuff(){this.throwAbstract();}
    doOtherStuff(){this.throwAbstract();}
}

class FooBar extends FooBase{
    constructor(){
        super();}
    doOtherStuff(){/*some code here*/;}
}

var fooBase = new FooBase(); //<- Error: Abstract class FooBase cannot be instantiated
var fooBar = new FooBar(); //<- OK
fooBar.doStuff(); //<- Error: FooBar must implement abstract member
fooBar.doOtherStuff(); //<- OK

严格模式使其无法登录呼叫者在throwAbstract方法,但应该发生在调试环境中,将显示堆栈跟踪误差。



文章来源: How do I create an abstract base class in JavaScript?