Javascript:迭代对象文字值

Question

我有一个标准的jQuery插件设置,在顶部创建默认设置:

jQuery.fn.myPlugin = function(options) { 
    var defaults = {  
        starts: "0px,0px",
        speed: 250, ...
    };
    o = $.extend(defaults, options);
}

我有另一个变量叫numberOfObjects.

我正在尝试循环默认变量.对于找到的每个对象(from numberOfObjects),我需要复制变量值的值.所以,如果numberOfObjects变量是3,则defaults.starts应该是0px,0px > 0px,0px > 0px,0px.>用于分割值.

这就是我现在拥有的.X表示默认值中的变量名称.Y表示当前值的变量x.我已经走到这一步,并且不知道下一步该做什么.

for (x in defaults) {   // x is defaults.x
    defaults.x = defaults.x + " > y";
}

Answer 1

var obj = {
    'foo': 1,
    'bar': 2
};

for (var key in obj) {
    console.log(obj[key]);
}

或者使用jQuery:

$.each(obj, function(key, value) {
    console.log(this, value, obj[key]);
});

Answer 2

你不应该依赖于jQuery.

Object.keys(obj).forEach(function (key) {
  var value = obj[key];
   // do something with key or value
});

• Mozilla开发人员文档 - https://developer.mozilla.org

• 旧浏览器的Polyfill

• 查看效果结果 - https://jsperf.com

Answer 3

让我们在开始之前设置我们的基本对象:

const x = {
  x: 1,
  y: 2,
  z: 3
};

我们可以使用Object.keys(x)返回对象中所有键的数组.

Object.keys(x)
> ['x', 'y', 'z']

现在我们可以映射,过滤,缩小和循环遍历数组,并在对象中使用该值执行某些操作:

Object.keys(x).map(key => x[key] + 1)
> [2,3,4]

Object.keys(x).forEach(key => console.log(x[key]))
> [1,2,3]

这里的主要内容是我们必须使用密钥来访问该特定值,它可以工作,但感觉有点笨重.ES2017带来了它Object.values()可以作为一个很好的快捷方式返回一个所有值的数组Object.

Object.values(x)
> [1,2,3]

Object.values(x).map(value => value + 1)
> [2,3,4]

Object.values(x).forEach(value => console.log(value))
> [1,2,3]

您可以在MDN上阅读有关Object.values()的更多信息,它们还包括一个polyfill,如果您需要支持尚未实现它的旧浏览器和浏览器.

Answer 4

最佳实践是验证正在迭代的对象属性是来自对象本身而不是从原型链继承.您可以使用.hasOwnProperty()来检查:(当然,如果您想要包含继承的属性,只需删除if语句).

这是一般情况:

for(var index in object) { 
   if (object.hasOwnProperty(index)) {
       var value = object[index];
       // do something with object value here.
   }
}

下面是您提到的创建重复对象的示例案例,其中每个键的值都是根据var的值复制的numberofobjects(我已添加到两个解决方案中,您可以修改现有对象或创建新对象) ):

// function to repeat value as a string inspired by disfated's answer here http://stackoverflow.com/questions/202605/repeat-string-javascript

function repeatValue(value, count) {
    value = String(value); // change to string to be able to add " > " as in question
    if (count < 1) return '';
    var result = '';
    while (count > 1) {
        if (count & 1) result +=  value + " > ";
        count >>= 1, value += " > " + value;
    }
    return result + value;
}

var numberofobjects = 3;
var newObject = {}; // for use if creating a duplicate object with the new values

for(var x in defaults) { 
   if (defaults.hasOwnProperty(x)) {
       //use this to replace existing values
       defaults[x] = repeatValue(defaults[x], numberofobjects);

       //or use this to create values in the new object
       newObject[x] = repeatValue(defaults[x], numberofobjects);
   }
}

Answer 5

要遍历对象的值，可以对Object.values使用for ... of循环。

const myObj = {a: 1, b: 2}

for (let value of Object.values(myObj)) {
    console.log(`value=${value}`)
}

// output: 
// value=1
// value=2

如果在迭代时需要键和值，则可以使用Object.entries。

const myObj = {a: 1, b: 2}

for (let [key, value] of Object.entries(myObj)) {
    console.log(`key=${key} value=${value}`)
}

// output: 
// key=a value=1
// key=b value=2

Answer 6

在您的代码中：

for(x in defaults){
   defaults.x = defaults.x + " > y";
}

你需要说defaults[x]而不是defaults.x。

x是一个变量，其中包含一个字符串，该字符串是defaults对象的键，括号（数组样式）语法允许您使用该变量来获取属性。用点表示法defaults.x寻找一个实际上称为“x”的属性，相当于defaults["x"].