为新对象添加函数,将对象添加到数组中.理解困难'这'关键字
Add function for new objects, adding object to an array. Difficulty understanding 'this' keyword
可能重复:
JavaScript“这";关键词
我已经编写了一个名为add的函数,其中包含参数firstName、lastName以及电子邮件、电话。在这个新功能中,目的是创建一个新的联系人对象,如bob和mary。
我的问题是关于this
关键字的上下文和用法。this
允许我将新创建的对象的属性值设置为传入的适当的添加函数参数。如果this
的目的是什么?这一个词允许我在代码中做什么?是为了启用允许任何字符串按顺序通过函数参数以创建多个对象的功能吗?
我最近使用了this
关键字,使我能够在多个对象上使用相同的函数,而不必在每个对象的基础上编写单独的函数。例如,可以为所有对象设置年龄属性的函数,而不是为每个对象单独设置年龄更改函数。
其次,我想检查一下我对将数据插入联系人阵列中适当位置的方式的理解是否正确。最后,我可以问一下这个关键词的上下文吗?
contacts[contacts.length] = this;
与相同
contacts[2] = this;
若我并没有用最简洁的方式表达我的问题,我深表歉意。请在下面找到我的代码。对于这种编码情况,this
关键字的任何答案或解释都将不胜感激。
var bob = {
firstName: "Bob",
lastName: "Jones",
phoneNumber: "(650) 777 - 7777",
email: "bob.jones@example.com"
};
var mary = {
firstName: "Mary",
lastName: "Johnson",
phoneNumber: "(650) 888 - 8888",
email: "mary.johnson@example.com"
};
var contacts = [bob, mary];
function add(firstName, lastName, email, telephone){
this.firstName = firstName;
this.lastName = lastName;
this.email = email;
this.telephone = telephone;
contacts[contacts.length] = this
}
var response1 = prompt("First Name?");
var response2 = prompt("Last Name?");
var response3 = prompt("Email?");
var response4 = prompt("Telephone No.?");
add(response1, response2, response3, response4);
this
实际上引用了全局窗口对象,因此您将其添加到数组中,而不是添加新联系人。
您需要在该函数中创建一个新对象,并将其添加到数组中:
function add(firstName, lastName, email, telephone){
var newContact = {
firstName: firstName,
lastName: lastName,
email: email,
telephone: telephone
}
contacts[contacts.length] = newContact;
}
以下是this
-http://bonsaiden.github.com/JavaScript-Garden/#function.this
如果您真的想使用this
,可以通过使用call
或apply
:调用函数来指定this
指的是什么
add.call({}, response1, response2, response3, response4); // pass new object as this
add.apply({}, [response1, response2, response3, response4]); // pass new object as this
this
完全是关于范围和上下文的。它指的是使用它的更广泛的背景。
这里有一个例子:
function MyObject(one,two) {
this.one = one;
this.two = two;
}
Myobject.prototype.SayNumbers() {
alert(this.one + this.two);
}
var myobj = new MyObject("Foo","Bar");
myobj.Saynumbers();
在上例的上下文中,this
"属于"它在"myobj"对象中使用的函数。这允许它访问对象的属性并向它们发出警报。
如果在全局范围内(即不在函数/对象内)使用this
关键字,它将引用窗口对象。
this
也可以通过引用传递,这对事件处理程序很有用。对于onclick事件,可以将this
传递给事件处理函数,并对单击的对象执行操作。
试着做一些实验和研究-这个网站有一些很好的例子:http://www.quirksmode.org/js/this.html
this
关键字有时有实际用途:
对于
SOMETHING.add(response1, response2, response3, response4)
,this
将是SOMETHING
。对于
SOMETHING = new add(response1, response2, response3, response4)
,this
将是新创建的对象SOMETHING
。
但是,当您将add()作为函数而不是方法调用时,this
是全局(窗口)对象。因此,您只需要创建四个全局变量(firstName、lastName、电子邮件和电话),以后每次向数组中添加条目时都会覆盖这些全局变量。请注意,如果您的代码是在最近的JavaScript解释器的"ES5严格模式"下执行的,那么add()函数的第一行将导致运行时错误。
(如果你想阅读更多内容,请参阅"这个"关键字是如何工作的?)
在您的情况下,我将避免使用this
,而是显式地创建一个新对象。
function add(firstName, lastName, email, telephone){
var obj = {
firstName: firstName,
lastName: lastName,
email: email,
telephone: telephone
};
contacts[contacts.length] = obj;
}
关于contacts[contacts.length] = obj;
,一种替代方案是使用contacts.push(obj);
。然而,你拥有它的方式非常好,事实上,可能会表现得稍微好一点。只要选择你喜欢的。
- FabricJs-限制主对象内添加对象的移动区域
- 向Angular作用域对象添加对象数组——TypeError
- Javascript使用+添加对象
- 动态添加对象的jQuery事件处理程序
- 添加JQuery UI在Meteor中添加对象后可调整大小
- 在我的上下文中添加对象的动态方法
- 如何检测是否已使用 angular.forEach AngularJS 添加对象
- 在对象coffeescript中添加对象数组
- 使用Jquery在单击“”时显示表单;添加对象”;按钮
- 我可以向数组添加对象键吗
- 向扩展数组的JS集合添加对象(继承?)
- 尝试通过从自动完成推送添加对象时缺少 $$Hashkey
- 添加对象值 Javascript
- 在上传问题时添加对象
- 如何使用 javascript 的变量名称在数组中添加对象属性
- 在 JavaScript/TypeScript 中动态地“直接”添加对象属性到“this”
- 如何仅当对象不存在时才使用javascript添加对象
- 如何在数组末尾添加对象的副本
- rails在javascript url中添加对象
- ThreeJS-按不同顺序添加对象会影响alpha/显示