调用/绑定/应用 vs 原型 [英] Call/Bind/Apply vs prototype

问题描述

在以下代码中:

function User(name) {
    this.name = name;
}

var user = new User('Jason Bourne');

User.prototype.sayHi = function() {
    return 'Hi ' + this.name;
};

var sayHello = function() {
    return 'Hello ' + this.name;
};

如果我将对象绑定到 sayHello (sayHello.bind(user)) 或者如果我使用 user.sayHi(); 两个函数都会给我相同的结果；

Both functions will give me the same result if I bind the object to sayHello (sayHello.bind(user)) or if I use user.sayHi();

所以我的问题是，是否有理由使用一种方法而不是另一种方法?我想我在某处读到不鼓励在原型上创建东西，如果是这样，为什么?

So my question is, is there a reason to use one method over the other? I thought I've read somewhere that creating things on prototype is discouraged, if so why?

更正:

我错误地写了 Object.prototype.. 而不是指定 (Object I create).prototype..

I erroneously wrote Object.prototype.. instead of specifying (Object I create).prototype..

推荐答案

你不想使用 Object.prototype.sayHi = function(){} 的原因是一旦你使用了，所有在其原型链中具有 Object 的东西都可以使用 sayHi.这就是原型继承的核心.

The reason you don't want to use Object.prototype.sayHi = function(){} is that once you do, everything that has Object in its prototype chain will be able to use sayHi. That's the core of prototypical inheritance.

向您创建的对象原型添加东西是可以的(添加到Object.prototype被认为是不好的做法).只要明白当你这样做时，你的对象原型链中的任何东西都可以使用该函数.

It's OK to add things to the prototype of objects that you create (and it's just considered bad practice to add to Object.prototype). Just understand that when you do, anything in your objects prototype chain will be able to use that function.

function sayHello() {
    console.log("hello");
}

// Bad
Object.prototype.hello = sayHello;
Date.hello(); // Prints hello

<小时>

Call、Apply 和 Bind 实际上与添加到原型中略有不同，Bind 也与 Call 和 Apply 不同.

---

Call, Apply, and Bind are actually slightly different from adding to prototype and Bind is also different from Call and Apply as well.

Function.call() 和 Function.apply() 使用您在调用或应用时正在调用或应用的任何函数.

Function.call() and Function.apply() use whatever function you are calling or applying at the moment of the call or apply.

例如，如果我们想在 NodeList

var els = document.querySelectorAll("div");
Array.prototype.forEach.call(els, function(el){
    el.classList.add("someClass");

call 和 apply 的最大区别在于 call 接受一个可变参数，而 apply 接受一个数组.

The big difference between call and apply is that call takes a variadic argument and apply takes an Array.

function say() {
    console.log(arguments);
}
say.call(this, "a", "b");
say.apply(this, ["a", "b"]);

绑定

使用 Function.bind() 实际上是另一回事.Bind 让您可以创建上下文绑定，您可以在其中根据需要从特定上下文调用函数.

Bind

Using Function.bind() is actually a different thing though. Bind lets you create a context binding where you can call a function from a specific context when you want.

function honk() {
    console.log(this.sound);
}

function Car() {
    this.sound = "honk";
}

function Van(){
    this.sound = "beep";
}
var c = new Car();
var v = new Van();

var ftorCar = honk.bind(c);
var ftorVan = honk.bind(v);

ftorCar(); // prints honk
ftorVan(); // prints beep

您现在可以传递 ftorCar 并在需要时调用它，它将具有正确的绑定"范围.

You can now pass ftorCar around and call it when you want to and it will have the correct scope "binding".

这篇关于调用/绑定/应用 vs 原型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！