Question

所以我正在制作这个小应用程序，允许用户输入命令来调整div的大小。

执行此操作时，我想通过创建一个简写选项来简化它，只需从全名调用相同的值，但这将返回undefined。

将this.small更改为sizes.small会返回错误：

Uncaught TypeError: Cannot read property 'small' of undefined

这是我的代码：

var sizes = {
    // Full names for sizes
    small      : [200,  150],
    medium     : [500,  350],
    large      : [1000, 700],
    fullscreen : [window.innerWidth, window.innerHeight],

    // Shorthand for sizes
    s : this.small,    
    m : this.medium,        
    l : this.large,     
    f : this.fullscreen        
}

// The following two calls should return the exact same result
console.log(sizes.small);   // array[200, 150]
console.log(sizes.s);       // undefined

有谁能告诉我我做错了什么？

Answer 1

对象文字不会改变任何上下文;这不是一个功能。它更像是一个表达。 sizes.small也不起作用，因为虽然声明了sizes，但在您读取它时尚未为其赋值（即创建赋予其值的对象）

您可以在之后分配属性：

var sizes = {
    // Full names for sizes
    small      : [200,  150],
    medium     : [500,  350],
    large      : [1000, 700],
    fullscreen : [window.innerWidth, window.innerHeight]      
};

// Shorthand for sizes
sizes.s = sizes.small;
sizes.m = sizes.medium;
sizes.l = sizes.large;
sizes.f = sizes.fullscreen;

Answer 2

制作＆＃34; s＆＃34;是一个返回＆＃34; this.small＆＃34;

的函数

即，

var sizes = {
    small      : [200,  150],
    s : function() {return this.small}
}

Answer 3

在创建对象之前，无法访问对象中的其他值。

您可以尝试：

var sizes = {
    // Full names for sizes
    small      : [200,  150],
    medium     : [500,  350],
    large      : [1000, 700],
    fullscreen : [window.innerWidth, window.innerHeight],
}

sizes.s = sizes.small;
sizes.m = sizes.medium;       
sizes.l = sizes.large;
sizes.f = sizes.fullscreen;

Answer 4

您不能以这种方式引用属性。以下是实现目标的一种方法：

var sizes = new (function() {
  this.small = [200,  150];
  this.s = this.small;
})();

console.log(sizes.small);
console.log(sizes.s);

见JSFiddle。

Answer 5

在JavaScript中

此

总是指我们正在执行的函数的“所有者”，或者更确切地说，指向函数是其方法的对象。例如，当我们定义页面中的函数时，它的所有者是页面，或者更确切地说，是JavaScript的窗口对象（或全局对象）。

在同一对象中调用值将返回undefined

5 个答案: