简体   繁体   English

Noob Concern:JavaScript函数用法

[英]Noob Concern: JavaScript function usage

I'm going through a JavaScript tutorial and I'm able to complete it. 我正在阅读JavaScript教程,我可以完成它。 But the problem is that I don't understand what one of the lines is doing. 但问题是我不明白其中一条线在做什么。 I have a function setAge() and then later after creating a susan object I set one of the properties to that object as the name of the function? 我有一个函数setAge() ,然后在创建一个susan对象后,我将该对象的一个​​属性设置为函数的名称? I don't understand why this is done. 我不明白为什么这样做。 Wouldn't I be able to use the function/method without doing this? 如果不这样做,我不能使用函数/方法吗?

The tutorial code: 教程代码:

var setAge = function (newAge) {
  this.age = newAge;
};

var susan = new Object(); 
susan.age = 25; 
susan.setAge = setAge; //how the hell does this work?  

// here, update Susan's age to 35 using the method
susan.setAge(35); 

It's assigning susan 's property setAge to the function defined above, 它将susan的属性setAge分配给上面定义的函数,

function (newAge) {
  this.age = newAge;
};

which is a function accepting one argument. 这是一个接受一个参数的函数。 When susan.setAge(35); susan.setAge(35); is called, this will refer to the caller, susan , updating her age to 35. 被称为, this将指呼叫者, susan ,将她的年龄更新为35岁。

The confusion might be from setAge being used twice. 混淆可能来自setAge被使用两次。 Susan's function gets defined on the left side, the right side is already defined. Susan的功能在左侧定义,右侧已定义。 For example: 例如:

susan.letMyAgeBe = setAge; 
susan.letMyAgeBe(35); 

works the same. 工作原理相同。 setAge is also "reusable": setAge也是“可重用的”:

harry = new Object();
harry.iAmThisOld = setAge;
harry.iAmThisOld(55);

Demo http://jsfiddle.net/7JbKY/2/ 演示 http://jsfiddle.net/7JbKY/2/

It works because of variable scopes. 它的作用是因为可变范围。

The first setAge variable is just a function and you can call it like: setAge(24) It's not so much different than function setAge(age) {this.age = age} 第一个setAge变量只是一个函数,您可以像下面这样调用它: setAge(24)它与function setAge(age) {this.age = age}不同function setAge(age) {this.age = age}

After you declare the setAge variable and set it's content to a function, you can set another variable to this variable. 声明setAge变量并将其内容设置为函数后,可以将另一个变量设置为此变量。 What you are doing in the object is just this. 你在对象中做的就是这个。 After you write susan.setAge = setAge; 写完susan.setAge = setAge; Your object's setAge property will be equal to the previous setAge variable which is a function. 对象的setAge属性将等于前一个setAge变量,该变量是一个函数。 So, you can call susan.setAge() . 所以,你可以调用susan.setAge()

let's see what is done in the code- 让我们看看代码中做了什么 -

var setAge = function (newAge) {
  this.age = newAge;
};

here a function is defined which will change the variable age of a object to the one specified while calling the function. 这里定义了一个函数,它将对象的变量age变为调用函数时指定的变量age。

var susan = new Object(); 
susan.age = 25; 
susan.mynewageis = setAge;

here we are setting a predefined value to susan.age which will be changed by the function and we are setting the value of the function to variable susan.mynewageis to make the function available next time in any other case. 这里我们正在为susan.age设置一个预定义值,该值将由函数更改,我们将函数的值设置为变量susan.mynewageis,以便在下次任何其他情况下使该函数可用。

susan.mynewageis(35);

here we are setting the value of susan.age to 35 as specified when calling the the function. 这里我们在调用函数时将susan.age的值设置为35。

I was going to post this answer but by mistake i pressed submit button and posted incomplete answer. 我打算发布这个答案,但错误的是我按下提交按钮并发布了不完整的答案。

this is a matter of scope and closure. 这是范围和结束的问题。 For more info around this I'd recommend you read this article: http://nesj.net/blog/2012/03/javascript-scope-and-closure/ 有关这方面的更多信息,我建议你阅读这篇文章: http//nesj.net/blog/2012/03/javascript-scope-and-closure/

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM