Javascript “this”内部对象
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7043509/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
"this" inside object
提问by mhe
I'm trying to calculate a proportional height (while excluding a static height element) from a width that gets passed in via a request (defaults to 560).
我正在尝试从通过请求传入的宽度(默认为 560)计算比例高度(同时不包括静态高度元素)。
However, wF.hevaluates to NaN. If I replace this.wwith 560 it works, but not when trying to reference the wproperty of wF.
但是,wF.h评估为NaN. 如果我更换this.w与560它的工作原理,但并不想引用时w的财产wF。
var wF = {
w : 560,
h : (312 - 42) / (560 / this.w) + 42
};
What gives?
是什么赋予了?
I refuse to use two plain vars in succession, because I'm trying to get nice code out of JS.
我拒绝连续使用两个普通变量,因为我试图从 JS 中获得好的代码。
Update:
更新:
Thanks to everyone who helped explain and solve my problem. I guess i'll just have to get used to that. I'll be setting the object up in stages to get on with the project, even though it still annoys me slightly ;). I found and read a nice article on the topic for anyone who stumbles upon similar issues: http://yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/
感谢所有帮助解释和解决我的问题的人。我想我只能习惯了。我将分阶段设置对象以继续该项目,即使它仍然让我有点恼火;)。我为任何偶然发现类似问题的人找到并阅读了一篇关于该主题的好文章:http: //yehudakatz.com/2011/08/11/understanding-javascript-function-invocation-and-this/
回答by Lightness Races in Orbit
// Your code
var wF = {
w : 560,
h : (312 - 42) / (560 / this.w) + 42
};
thisisn't what you think it is
this不是你想的那样
Javascript has no block scope, only function scope: thisinside the definition for wFdoes notrefer to wF.
Javascript 没有块作用域,只有函数作用域:this在 for 的定义wF中不引用wF.
(And so this.w, whatever thisis, is likely undefined. Dividing by undefinedyields NaN.)
(因此this.w,无论this是什么,都是可能的undefined。除以undefined收益NaN。)
So then you might try:
那么你可以尝试:
// Let's not use `this`
var wF = {
w : 560,
h : (312 - 42) / (560 / wF.w) + 42
};
You haven't finished defining the object yet
你还没有完成定义对象
However, you're still defining the objectwhere you attempt to use wF.w: it's not ready for that yet.
但是,您仍在定义您尝试使用的对象wF.w:它还没有准备好。
Solution
解决方案
So, yes, you will have to use two variables... or set up the object in stages:
所以,是的,您将不得不使用两个变量……或者分阶段设置对象:
// We can't even use `wF`; split up the property definitions
var wF = {};
wF.w = 560;
wF.h = (312 - 42) / (560 / wF.w) + 42;
回答by houss
Hi just redefine your second property as a function object and it will work. I think it is possible to access the context of the calling object from within a function
嗨,只需将您的第二个属性重新定义为函数对象,它就会起作用。我认为可以从函数内部访问调用对象的上下文
var wF = {
w : 560,
h : function() { return (312 - 42) / (560 / this.w) + 42; }
};
alert(wF.h())
回答by Paul Perigny
The thiskeyword refers to the calling context, not an object.
该this关键字是指调用上下文,而不是对象。
You need to do this in two steps like so:
您需要分两步执行此操作,如下所示:
var wF = { w: 560 };
wF.h = (312 - 42) / (560 / wF.w) + 42;
回答by Dennis
You don't need to wrap the {...} in an Object(). It is already an object literal.
您不需要将 {...} 包装在 Object() 中。它已经是一个对象字面量。
thisdoesn't operate inside the object literal, it will point to the object that the function is currently running in so:
this不在对象字面量内操作,它将指向函数当前正在运行的对象,因此:
function fn() {
var wF = { w : 560, h : (312 - 42) / (560 / this.w) + 42 };
}
fn();
will cause thisto point to the windowobject.
将导致this指向window对象。
EDIT: Previous code was not intended to be an answer, just a demonstration of what thisis. Another possiblity would be to use a function that takes the width as an argument:
编辑:以前的代码并不是要作为答案,只是对是什么的演示this。另一种可能性是使用一个将宽度作为参数的函数:
function getObject(width) {
width = width || 560; //Default value to 560
return { w: width, h : (312 - 42) / (560 / width) + 42 };
}
var wF = getObject(); //To get the default value, or specify a width otherwise.
回答by Adilson de Almeida Jr
When you use this in a JSON object declaration, it points to the current instance.
当您在 JSON 对象声明中使用 this 时,它指向当前实例。
You can try this code in your console to understand it better:
您可以在控制台中尝试此代码以更好地理解它:
Object({ w : 560, h : (312 - 42) / (560 / function(e){console.log(e);return e.w;}(this)) + 42 });

