2015-09-17 16 views
71

ES6, Node 4'te tam olarak kullanılabilir. MyClass implements MyInterface'da olduğu gibi yöntem sözleşmelerini tanımlamak için bir arabirim kavramı içerip içermediğini merak ediyordum.ES6/Düğüm 4'te arayüz oluşturmak için bir yol var mı?

Googling'imle pek fazla şey bulamıyorum, ancak belki de iyi bir hile veya geçici çözüm var.

+2

Tam? [Bugüne kadar] (https://kangax.github.io/compat-table/es6/) – Bergi

+1

JS hala [ördek yazarak] kullanır (https://en.wikipedia.org/wiki/Duck_typing). Statik olarak uygulanan "yöntem sözleşmeleri" yoktur. Dinamik olarak test etmek isterseniz, kendi arayüz kontrol cihazınızı kolaylıkla yazabilirsiniz. – Bergi

+0

Zaten ES6'da epeyce kitap var, ör. [bu bir] (https://github.com/getify/You-Dont-Know-JS/blob/master/es6%20&%20beyond/README.md#you-dont-know-js-es6--beyond) . Bunlardan birini okuyorsanız, ES6'da hangi özelliklerin mevcut olmadığını ve mevcut olmadığını merak etmeniz gerekmeyecektir. En kötüsü, durumda [spesifikasyona bakınız] (http://www.ecma-international.org/ecma-262/6.0/index.html). "Arayüz" terimi 12 kez görünür. Lütfen bir dilin sahip olabileceği her özellik için bir soru oluşturmayın. –

cevap

52

Arabirimler, ES6'nın bir parçası değil, sınıflardır.

Gerçekten bunlara ihtiyacınız varsa, bunları destekleyen TypeScript ürününe bakmalısınız. maddesinde aşağıda belirtilen yazdı yorumlar debiasej olarak

+0

"onlar" arayüzler. FWIW Yukarıda sağlanan transpiler bağlantısının dikkatlice düşünülmesi gerekebilir. Tam olarak beklediğimden değil, ama yakın. – Berniev

9

tasarım desenleri hakkında daha fazla açıklıyor (arayüzleri dayalı sınıflar): sizin için yararlı olabilir kitabı javascript

http://loredanacirstea.github.io/es6-design-patterns/

Tasarım desenleri:

http://addyosmani.com/resources/essentialjsdesignpatterns/book/

tasarım modeli = sınıfları + ara yüz ya da birden çok devralma

ES6 JS'de fabrika modelinin bir örneği (çalıştırılmak üzere: node example.js):

"use strict"; 

// Types.js - Constructors used behind the scenes 

// A constructor for defining new cars 
class Car { 
    constructor(options){ 
    console.log("Creating Car...\n"); 
    // some defaults 
    this.doors = options.doors || 4; 
    this.state = options.state || "brand new"; 
    this.color = options.color || "silver"; 
    } 
} 

// A constructor for defining new trucks 
class Truck { 
    constructor(options){ 
    console.log("Creating Truck...\n"); 
    this.state = options.state || "used"; 
    this.wheelSize = options.wheelSize || "large"; 
    this.color = options.color || "blue"; 
    } 
} 


// FactoryExample.js 

// Define a skeleton vehicle factory 
class VehicleFactory {} 

// Define the prototypes and utilities for this factory 

// Our default vehicleClass is Car 
VehicleFactory.prototype.vehicleClass = Car; 

// Our Factory method for creating new Vehicle instances 
VehicleFactory.prototype.createVehicle = function (options) { 

    switch(options.vehicleType){ 
    case "car": 
     this.vehicleClass = Car; 
     break; 
    case "truck": 
     this.vehicleClass = Truck; 
     break; 
    //defaults to VehicleFactory.prototype.vehicleClass (Car) 
    } 

    return new this.vehicleClass(options); 

}; 

// Create an instance of our factory that makes cars 
var carFactory = new VehicleFactory(); 
var car = carFactory.createVehicle({ 
      vehicleType: "car", 
      color: "yellow", 
      doors: 6 }); 

// Test to confirm our car was created using the vehicleClass/prototype Car 

// Outputs: true 
console.log(car instanceof Car); 

// Outputs: Car object of color "yellow", doors: 6 in a "brand new" state 
console.log(car); 

var movingTruck = carFactory.createVehicle({ 
         vehicleType: "truck", 
         state: "like new", 
         color: "red", 
         wheelSize: "small" }); 

// Test to confirm our truck was created with the vehicleClass/prototype Truck 

// Outputs: true 
console.log(movingTruck instanceof Truck); 

// Outputs: Truck object of color "red", a "like new" state 
// and a "small" wheelSize 
console.log(movingTruck); 
+19

Peki, burada başkaları ile oluşturabileceğim bir arayüz nerede? –

+0

Bu sitede daha derin açıklamalar olabilir: https://www.sitepoint.com/object-oriented-javascript-deep-dive-es6-classes/ – 42n4

+2

Bu sitede ES6'ya ES5 kalıpları için harika bir güncelleme var: http: //loredanacirstea.github.io/es6-design-patterns/ – debiasej