JavaScript 引用混淆

JavaScript references confusion

本文关键字：引用 JavaScript      更新时间：2023-09-26

可能的重复项：
为什么自定义函数引用一直指向旧函数

我对javascript引用行为感到非常困惑。 请看一下这段代码，非常清楚javscript在传递引用时不创建新的内存位置。 

Human.prototype = Monkey.prototype;
Human.prototype.name = "human";
Human.prototype.work = "love";
Joker.prototype = Human.prototype;
Joker.prototype.name = "joker";
Joker.prototype.act = "awesome";
joker = new Joker ();
human = new Human ();
human.name = 'joker';

现在看看这个，很明显 JavaScript 正在为 ScareMe 和恶作剧创建 2 个单独的内存位置 

var scareMe = function () {
   alert("Boo!");
   scareMe = function () {
     alert("Double boo!");
  };
};
var prank = scareMe; 
prank(); // "Boo!"
prank(); // "Boo!"
scareMe(); // "Double boo!"

请帮助我理解这种行为。

在您的第一个示例中，我认为您尝试使用对象继承，而您的原型分配不适合，由于将原型分配给现有原型，将导致左侧原型引用另一个原型。那么这只是在代码中分配这些原型变量的问题，即：

Human.prototype = Monkey.prototype;
//Human.prototype.name = "human";  -- not here
Human.prototype.work = "love";
Joker.prototype = Human.prototype;
Joker.prototype.name = "joker";
Joker.prototype.act = "awesome";
Human.prototype.name = "human";  // but here
joker = new Joker ();
human = new Human ();
alert(human.name) // outputs "human"

但是你应该使用它来继承对象：

Human.prototype = new Monkey();

在第二个示例中，恶作剧获取分配的原始 scareMe 函数。scareMe 函数输出 "Boo！" 并重新分配 scareMe 函数变量。这意味着最外层的"var scareMe"现在指向一个不同的函数（返回"Double Boo！"）。但是由于恶作剧仍然指向原始函数，它将始终执行原始代码（输出"Boo！"并重新分配scareMe）。

// i.e.: reverse the call order:
scareMe(); // "Boo!"
prank(); // "Boo!"
prank(); // "Boo!"
"scareMe

"的第一个调用重新分配了scareMe，但恶作剧仍然指向原始功能。

第一个块 ：

Monkey = function(){};
Human = function(){};
Human.prototype = new Monkey(); // This is how you have to inherit properties of Monkey
Human.prototype.name = "human";
Human.prototype.work = "love";
Joker= function(){};
Joker.prototype = new Human();  // This is how you have to inherit properties of Human
Joker.prototype.name = "joker";
Joker.prototype.act = "awesome";
joker = new Joker ();
human = new Human ();
alert(joker.name);  // shows joker
alert(human.name);   // shows human

实际上，不建议在原型中创建属性。（参考： http://css.dzone.com/articles/ecmascriptnext-classes）

Monkey = function(){
    this.name = "monkey";
    this.work = "jump";
};
Human = function(){
    this.name = "human";
    this.work = "love";
};
Human.prototype = new Monkey(); // This is how you have to inherit properties of Monkey
Joker = function(){
    this.name = "joker";
    this.work = "awesome";
};
Joker.prototype = new Human();  // This is how you have to inherit properties of Human
joker = new Joker ();
human = new Human ();
alert(joker.name);  // shows joker
alert(human.name);   // shows human

第二块 ： 

var scareMe = function () {       // `scareMe` is a global variable 
   alert("Boo!");
   scareMe = function () {       //  value of global `scareMe` will be changed when original `scareMe` gets executed for the first time
     alert("Double boo!");
  };
};
var prank = scareMe; 
prank(); // "Boo!" - because `prank` is original scareMe. but this execution changes value of `scareMe` 
prank(); // "Boo!" - same happens
scareMe(); // "Double boo!" - `scareMe` is having new function. it shows "Double boo!"
相关文章：