如何在對象方法中選擇JavaScript對象數組

Question

如何從我的randomImage.imagePicker方法中選擇randomImage.images數組中的字符串？

(function() {

var randomImage = {

        images : [
                'http://placehold.it/100x100',
                'http://placehold.it/200x200',
                'http://placehold.it/300x300',
                'http://placehold.it/400x400'
                ],//images Array
        imagePicker : function () {
                return console.log(randomImage.images[2]);
                }()//imagePicker Method

}//randomImage Object

})()

我在控制台中收到以下錯誤：

未捕獲的TypeError：無法讀取未定義的屬性“圖像”

Answer 1

或者，如果您想指定要獲取的randomImage的索引，請執行以下操作：

imagePicker : function (idx) {
  return randomImage.images[idx];
}

randomImage.imagePicker(1)將返回http://placehold.it/200x200

Answer 2

我在控制台中收到以下錯誤： Uncaught TypeError: Cannot read property 'images' of undefined

問題是您在函數定義之后有() ：

imagePicker : function () {
    return console.log(randomImage.images[2]);
}()//imagePicker Method
 ^^

這將立即調用該函數並將其返回值分配給imagePicker 。 但是目前， randomImage還沒有初始化。 它的值仍未undefined ，這就是為什么會出現該錯誤的原因。

刪除括號以分配函數本身（我想這就是您想要做的）：

imagePicker : function () {
    return console.log(randomImage.images[2]);
}

Answer 3

如果您只希望它從images數組返回隨機圖像：

演示

imagePicker : function () {
  var index = Math.floor(Math.random() * randomImage.images.length);
  return randomImage.images[index];
}

使用索引可以只返回特定的圖像：

imagePicker : function () {
  // index 0 returns 'http://placehold.it/100x100'
  return randomImage.images[0];
}

Answer 4

this是一個神奇的詞：

    (function() {

    var randomImage = {

            images : [
                    'http://placehold.it/100x100',
                    'http://placehold.it/200x200',
                    'http://placehold.it/300x300',
                    'http://placehold.it/400x400'
                    ],//images Array
            imagePicker : function () {
                    alert(this.images[2]);
                    }//imagePicker Method

    }//randomImage Object

    randomImage.imagePicker();

 })();

請注意，在自動功能之外， randomImage變量不可用！

在這里擺弄