在jquery里面创建对象的实例点击功能

Question

嗨我刚开始学习oojs，我试过完成一个什么是非常简单的测试。

退房这里的代码：与窗口如 view the test jsbin

我发现我不能在函数内部创建一个对象的新实例，不动它的功能外或通过预未决它

window.person = new person（）;

虽然它的作品我有一种感觉，我这样做是错误的。

我也知道人员名称需要先设置，所以第二个警报使用名称。

所以我的问题是，他们是一个更好的方式来做到这一点，利用window.person一个坏主意，创建一个新的实例。

我试图自学，任何输入将非常感激。

Answer 1

的问题是，你的新的Person实例被覆盖的构造。

当你在一个范围之外定义一个函数时，你实际上将它附加到窗口对象（“全局”范围）。这意味着您的function Person被分配到window.Person。

里面点击事件你window.Person = new Person(clicked);

重新分配window.Person您可以通过简单地重命名的click回调创建了window.Person变量使你的榜样工作。然而，更合适的方法是使用closures。这将保持窗口范围更清洁并解决您的问题。

此外，当谈到命名变量和构造，下面的指南通常用于：

• 构造函数名称应该以大写字母开头（例如function Person）
• 普通变量应该有一个开始小写字母（例如var person）

这样可以避免在编写诸如var person = new Person()之类的东西时出现任何混淆。

最终的结果看起来是这样的：

function Person(name){ 
    this.name = name; 
    this.alert = function(){ 
     alert("hello " + this.name); 
    }; 
} 

function Area (location, name){ 
    this.name = name; 
    this.location = location; 
    this.alert = function(){ 
     alert("hello " + this.name + " you live in " + this.location); 
    }; 
} 

$(document).ready(function(){ 
    var person; 
    $(".button").click(function(){ 
     var clicked = $(this).text(); 
     person = new Person(clicked); 
     person.alert(); 
    }); 

    $(".button2").click(function(){ 
     var location = $(this).text(); 
     var name = person.name; 
     var area = new Area(location, name); 
     area.alert(); 
    }); 
}); 

如果您需要访问click功能之外area变量，你当然也可以直接移动var area声明var person下。

Answer 2

只要把比如在外面范围：

var myPerson, myArea; 

$(document).ready(function(){ 

    $(".button").click(function(){ 
     var clicked = $(this).text(); 
     myPerson = new Person(clicked); 
     myPerson.alert(); 
    }); 

    $(".button2").click(function(){ 
     var location = $(this).text(); 
     var name = myPerson.name; 
     myArea = new Area(location, name); 
     myArea.alert(); 
    }); 

});