我正在学习如何用JavaScript制作面向对象编程。是否有接口概念(如Java的接口)?
这样我就可以创建一个监听器。
当前回答
虽然javaScript中不像Java中那样有接口，但你可以用这条消息下的代码来模仿这种行为。因为接口基本上是一个强制契约，你可以自己构建它。
下面的代码来自3个类:接口、父类和子类。
接口中有检查方法和属性是否存在的方法。 父类用于使用Interface类在子类中强制执行所需的方法和属性。 孩子是父母规则强制执行的类别。
在您正确地设置它之后，如果子程序中缺少方法或属性，那么您将在控制台中看到一个错误，如果子程序正确地实现了契约，则什么也没有。
class Interface {
checkRequiredMethods(methodNames) {
setTimeout( () => {
const loopLength = methodNames.length;
let i = 0
for (i; i<loopLength; i++) {
if (typeof this[methodNames[i]] === "undefined") {
this.throwMissingMethod(methodNames[i]);
}
else if (typeof this[methodNames[i]] !== "function") {
this.throwNotAMethod(methodNames[i]);
}
}
}, 0);
}
checkRequiredProperties(propNames) {
setTimeout( () => {
const loopLength = propNames.length;
let i = 0
for (i; i<loopLength; i++) {
if (typeof this[propNames[i]] === "undefined") {
this.throwMissingProperty(propNames[i]);
}
else if (typeof this[propNames[i]] === "function") {
this.throwPropertyIsMethod(propNames[i]);
}
}
}, 0);
}
throwMissingMethod(methodName) {
throw new Error(`error method ${methodName} is undefined`);
}
throwNotAMethod(methodName) {
throw new Error(`error method ${methodName} is not a method`);
}
throwMissingProperty(propName) {
throw new Error(`error property ${propName} is not defined`);
}
throwPropertyIsMethod(propName) {
throw new Error(`error property ${propName} is a method`);
}
}
class Parent extends Interface {
constructor() {
super()
this.checkRequiredProperties([
"p1",
"p2",
"p3",
"p4",
"p5"
]);
this.checkRequiredMethods([
"m1",
"m2",
"m3",
"m4"
]);
}
}
class Child extends Parent {
p1 = 0;
p2 = "";
p3 = false;
p4 = [];
p5 = {};
constructor() {
super();
}
m1() {}
m2() {}
m3() {}
m4() {}
}
new Child()
其他回答
希望任何还在寻找答案的人都能从中找到帮助。
你可以尝试使用代理(这是自ECMAScript 2015以来的标准):https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy
latLngLiteral = new Proxy({},{
set: function(obj, prop, val) {
//only these two properties can be set
if(['lng','lat'].indexOf(prop) == -1) {
throw new ReferenceError('Key must be "lat" or "lng"!');
}
//the dec format only accepts numbers
if(typeof val !== 'number') {
throw new TypeError('Value must be numeric');
}
//latitude is in range between 0 and 90
if(prop == 'lat' && !(0 < val && val < 90)) {
throw new RangeError('Position is out of range!');
}
//longitude is in range between 0 and 180
else if(prop == 'lng' && !(0 < val && val < 180)) {
throw new RangeError('Position is out of range!');
}
obj[prop] = val;
return true;
}
});
然后你就可以轻松地说:
myMap = {}
myMap.position = latLngLiteral;
如果你想通过instanceof (@Kamaffeather问)检查，你可以像这样把它包装在一个对象中:
class LatLngLiteral {
constructor(props)
{
this.proxy = new Proxy(this, {
set: function(obj, prop, val) {
//only these two properties can be set
if(['lng','lat'].indexOf(prop) == -1) {
throw new ReferenceError('Key must be "lat" or "lng"!');
}
//the dec format only accepts numbers
if(typeof val !== 'number') {
throw new TypeError('Value must be numeric');
}
//latitude is in range between 0 and 90
if(prop == 'lat' && !(0 < val && val < 90)) {
throw new RangeError('Position is out of range!');
}
//longitude is in range between 0 and 180
else if(prop == 'lng' && !(0 < val && val < 180)) {
throw new RangeError('Position is out of range!');
}
obj[prop] = val;
return true;
}
})
return this.proxy
}
}
这可以在不使用Proxy的情况下完成，而是使用类getter和setter:
class LatLngLiteral {
#latitude;
#longitude;
get lat()
{
return this.#latitude;
}
get lng()
{
return this.#longitude;
}
set lat(val)
{
//the dec format only accepts numbers
if(typeof val !== 'number') {
throw new TypeError('Value must be numeric');
}
//latitude is in range between 0 and 90
if(!(0 < val && val < 90)) {
throw new RangeError('Position is out of range!');
}
this.#latitude = val
}
set lng(val)
{
//the dec format only accepts numbers
if(typeof val !== 'number') {
throw new TypeError('Value must be numeric');
}
//longitude is in range between 0 and 180
if(!(0 < val && val < 180)) {
throw new RangeError('Position is out of range!');
}
this.#longitude = val
}
}
Javascript没有接口。但它可以是鸭子类型的，一个例子可以在这里找到:
http://reinsbrain.blogspot.com/2008/10/interface-in-javascript.html
JavaScript中没有本机接口， 有几种方法可以模拟接口。我已经写了一个包来做这件事
你可以看到这里的植入
我知道这是一个老问题，但我最近发现自己越来越需要一个方便的API来根据接口检查对象。所以我写了这个:https://github.com/tomhicks/methodical
它也可以通过NPM: NPM install methodical获得
它基本上完成了上面建议的所有事情，并有一些更严格的选项，而且所有这些都不需要执行大量if (typeof x.method === 'function')样板文件。
希望有人觉得它有用。
JavaScript接口:
虽然JavaScript没有接口类型，但经常需要它。由于JavaScript的动态特性和原型继承的使用，很难确保跨类接口的一致性——然而，这是有可能做到的;并经常被模仿。
在这一点上，有一些特殊的方法来模拟JavaScript中的接口;方法上的差异通常满足了一些需求，而其他的则没有得到解决。通常情况下，最健壮的方法过于繁琐，阻碍了实现者(开发人员)的工作。
下面是一种接口/抽象类的方法，它不是很麻烦，是显式的，使抽象中的实现最小化，并为动态或自定义方法留下足够的空间:
function resolvePrecept(interfaceName) {
var interfaceName = interfaceName;
return function curry(value) {
/* throw new Error(interfaceName + ' requires an implementation for ...'); */
console.warn('%s requires an implementation for ...', interfaceName);
return value;
};
}
var iAbstractClass = function AbstractClass() {
var defaultTo = resolvePrecept('iAbstractClass');
this.datum1 = this.datum1 || defaultTo(new Number());
this.datum2 = this.datum2 || defaultTo(new String());
this.method1 = this.method1 || defaultTo(new Function('return new Boolean();'));
this.method2 = this.method2 || defaultTo(new Function('return new Object();'));
};
var ConcreteImplementation = function ConcreteImplementation() {
this.datum1 = 1;
this.datum2 = 'str';
this.method1 = function method1() {
return true;
};
this.method2 = function method2() {
return {};
};
//Applies Interface (Implement iAbstractClass Interface)
iAbstractClass.apply(this); // .call / .apply after precept definitions
};
参与者
命令解析器
resolvePrecept函数是一个在抽象类中使用的实用工具和帮助函数。它的工作是允许对封装的戒律(数据和行为)进行定制的实现处理。它可以抛出错误或警告——并且——将默认值赋给实现者类。
iAbstractClass
iAbstractClass定义要使用的接口。它的方法需要与其实现者类达成默契。这个接口将每个戒律分配给相同的戒律名称空间——或——给戒律解析器函数返回的任何东西。但是，这个默契会分解为一个上下文——实现者的一个规定。
实现者
实现者只是“同意”一个接口(在本例中是iAbstractClass)，并通过构造器劫持来应用它:iAbstractClass.apply(this)。通过定义上面的数据和行为，然后劫持接口的构造函数——将实现者的上下文传递给接口构造函数——我们可以确保将添加实现者的重写，并且该接口将解释警告和默认值。
这是一种非常简单的方法，在不同的项目过程中，对我和我的团队都非常有用。然而，它确实有一些警告和缺点。
缺点
虽然这有助于在很大程度上实现整个软件的一致性，但它并没有实现真正的接口——而是模拟它们。尽管定义、默认值、警告或错误都被解释了，但使用的解释是由开发人员强制执行和断言的(就像大多数JavaScript开发一样)。
这似乎是“JavaScript中的接口”的最佳方法，然而，我希望看到以下问题得到解决:
返回类型的断言 签名的断言 冻结删除操作中的对象 JavaScript社区的特殊性中任何其他普遍或需要的断言
也就是说，我希望这对你有帮助，就像我和我的团队一样。
