如何在JavaScript中获取实例名称？

Question

如果我创建一个像这样的类：

function MyClass(input){
  // construct something;
  var myInstanceName = ???
}

在创建实例时，我需要知道实例的名称...

var MyInstance = new MyClass("制造一些东西");

需要知道myInstanceName（在这种情况下为“MyInstance”），因为有一个方法会创建按钮，“onclick”必须调用此实例的方法。

我尝试过“this.name”，但它返回未定义...如何获得此值？

编辑：这是一个经过测试的工作示例：

function MyClass(WhereGoesTheButton){
    this.myName = "Test"; // <-- here is the issue
    this.idButton = WhereGoesTheButton;
    //
}
MyClass.prototype.createButton = function(){
    document.getElementById(this.idButton).innerHTML = '<button id="myId" onclick="'+this.myName+'.callBack(this);">Press Here</button>';
}
MyClass.prototype.callBack = function(who){
    alert("Button "+who.id+" has been pressed!");
}
var Test = new MyClass("testArea");
//
function ini(){
    Test.createButton();
}

只需将其放入一个带有body onload ini()和一些div的页面中即可创建按钮。

它可以工作，但欢迎使用更好的实践替代！

编辑2：这将完成任务，尽管我们仍然没有实例的名称：

var MyClassId = 0;
function MyClass(WhereGoesTheButton){
    this.myButtonId = "MyClass"+String(MyClassId);
    MyClassId++;
    this.idButton = WhereGoesTheButton;
    //
}
MyClass.prototype.createButton = function(){
    var me = this;
    document.getElementById(this.idButton).innerHTML = '<button id="'+this.myButtonId+'" >Press Here</button>';
    document.getElementById(this.myButtonId).addEventListener("click", function(e){ me.callBack(this); }, false);
}
MyClass.prototype.callBack = function(who){
    alert("Button "+who.id+" has been pressed!");
}
var Test = new MyClass("testArea");
//
function ini(){
    Test.createButton();
}

- Gustavo

---

如果你需要知道变量的名称，99.99％的时间你正在做一些不应该做的事情。 - adeneo

如果我只有0.01%的可能呢？好吧，欢迎提供另一种实现方式。在AS3中，我通过事件的“target”属性获取变量，但在JS中似乎没有这样的东西... - Gustavo

请查看我在以下重复问题中的回答：http://stackoverflow.com/questions/12972262/javascript-get-name-of-instance-of-class/23294728#23294728 - Kmeixner

Answer 1

简单的代码示例：

 function Parent(){
        // custom properties
    }

    Parent.prototype.getInstanceName = function(){
        for (var instance in window){
            if (window[instance] === this){
                return instance;
            }
        }
    };

    var child = new Parent();

    console.log(child.getInstanceName()); // outputs: "child"

- shmuli

---

只有在根目录创建实例时才能正常工作。如果需要查看所有窗口对象，可能会变慢。但这很有趣，我会将这段代码保存在附近... - Gustavo

谢谢。这正是我一直在寻找的！=) - Really Nice Code

Answer 2

需要知道我的实例名称（在本例中为“ MyInstance”），因为有一个方法创建按钮，“onclick”必须调用此实例的方法。

你为什么需要变量名呢？你的方法可以使用 this 引用当前实例。

但是，在点击处理程序内，this 将是被点击的元素。假设你像这样绑定事件：

someElement.addEventListener('click', this.someMethod, false);

"...你可以将它更改为：

"

var that = this;
someElement.addEventListener('click', function(e) {
    that.someMethod()
}, false);

还有其他可能的解决方案，比如bind和EventListener接口。

- bfavaretto

---

如描述的那样，该类在页面中创建了一些按钮，当这些按钮被点击时，它必须调用创建这些按钮的类实例的一个方法。还有其他的做法吗？ - Gustavo

@GustavoPinent 是的，还有另一种方法。请查看我的更新答案。 - bfavaretto

我认为这种方式更好，但不幸的是，它无法工作，因为我必须使用唯一的ID来识别按钮，以便可以在其上使用addEventListener。也许一个技巧是在创建实例时进行编号，但使用实例的名称会更容易，我想。 - Gustavo

@GustavoPinent 你是怎么绑定点击事件的？ - bfavaretto

我没有使用bind，不确定是否有效，并且可能不被旧浏览器接受。但是你的建议几乎是正确的！我进行了编号（将在上面），现在它可以工作了。将来，“this.name”将会发挥作用，但现在我们只有这个hack。 - Gustavo

Answer 3

this 指的是构造函数内部的实例。然而，请注意，在Javascript中，this 是在 调用函数时 动态确定的。因此，如果您在构造函数中使用 this 设置处理程序，而没有明智地使用 bind，则可能会遇到错误。

在这里 查看有关 this 的更多信息

- Wyatt

Answer 4

如果你真的需要这个名称，我的最佳建议是将其作为构造函数中的可选参数传递。然后，如果提供了该参数，可以设置一个成员属性this.instanceName = passedNameArgument，以便稍后访问它以进行错误处理或满足其他需求。

- Peter Kaufinger