Javascript 遍历对象属性

var obj={
姓名：“西蒙”，
年龄:"20岁",，
服装：{
风格：“简单”，
时髦人士：错
}
}
用于（obj中的var propt）{
log（propt+'：'+obj[propt]）；
}

这是语句中…的

（，）

您可以将其理解为“对于
obj
对象中的每个属性，依次将每个属性分配给PROPT变量”。
它只是一个
FOR…IN
循环。签出。
您的
for
循环正在迭代对象
obj
的所有属性
propt
在for循环的第一行中定义。它是一个字符串，是
obj
对象属性的名称。在循环的第一次迭代中，
propt
将是“name”。
JavaScript中的对象是属性集合，因此可以在for each语句中循环

您应该将
obj
视为键值集合。
迭代属性需要额外的
hasOwnProperty
检查：

for (var prop in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, prop)) {
        // do stuff
    }
}

这是必要的，因为对象的原型包含对象的附加属性，这些属性在技术上是对象的一部分。这些附加属性继承自基本对象类，但仍然是
obj
的属性

只需检查这是否是该类特有的属性，而不是从基类继承的属性


还可以通过对象本身调用
hasOwnProperty
：

if (obj.hasOwnProperty(prop)) {
    // do stuff
}

但如果对象具有同名的不相关字段，则此操作将失败：

var obj = { foo: 42, hasOwnProperty: 'lol' };
obj.hasOwnProperty('foo');  // TypeError: hasOwnProperty is not a function

这就是为什么通过
Object.prototype
调用它更安全的原因：

var obj = { foo: 42, hasOwnProperty: 'lol' };
Object.prototype.hasOwnProperty.call(obj, 'foo');  // true

从JavaScript 1.8.5开始，您可以使用
Object.keys（obj）
获取在对象本身上定义的属性数组（对于
obj.hasOwnProperty（key）
，返回true的属性）

这比使用for-in循环更好（也更可读）

以下浏览器支持它：


火狐（壁虎）：4（2.0）
铬：5
Internet Explorer:9

有关更多信息，请参阅。
for..in循环的作用是创建一个新变量（var someVariable），然后将给定对象的每个属性逐个存储在这个新变量（someVariable）中。因此，如果使用块{}，则可以进行迭代。考虑下面的例子。
var obj = {
     name:'raman',
     hobby:'coding',
     planet:'earth'
     };

for(var someVariable in obj) {
  //do nothing..
}

console.log(someVariable); // outputs planet

for…in循环表示对象中的每个属性，因为它类似于for循环。您通过执行以下操作在for…in循环中定义了propt：

    for(var propt in obj){
alert(propt + ': ' + obj[propt]);
}

for…in循环遍历对象的可枚举属性。无论您定义哪个变量，或者将其放入for…in循环中，都会在每次转到它迭代的下一个属性时发生更改。for…in循环中的变量迭代键，但它的值是键的值。例如：

    for(var propt in obj) {
      console.log(propt);//logs name
      console.log(obj[propt]);//logs "Simon"
    }

let obj = { a: 'Carrot', b: 'Potato', Car: { doors: 4 } };

for(val of obj) { console.log('Value is:' + val ) }

您可以看到变量与变量值之间的差异。相反，for…of循环的作用正好相反

我希望这有帮助。
我想补充上面的答案，因为您可能与Javascript有不同的意图。JSON对象和Javascript对象是不同的东西，您可能希望使用上面提出的解决方案迭代JSON对象的属性，然后感到惊讶

假设您有一个JSON对象，如：

var example = {
    "prop1": "value1",
    "prop2": [ "value2_0", value2_1"],
    "prop3": {
         "prop3_1": "value3_1"
    }
}

迭代其“属性”的错误方式：

function recursivelyIterateProperties(jsonObject) {
    for (var prop in Object.keys(example)) {
        console.log(prop);
        recursivelyIterateProperties(jsonObject[prop]);
    }
}

在遍历
prop1
和
prop2
以及
prop3\u 1
的属性时，您可能会惊讶地看到控制台记录
0
、
1
等。这些对象是序列，序列的索引是Javascript中该对象的属性

递归迭代JSON对象属性的更好方法是首先检查该对象是否为序列：

function recursivelyIterateProperties(jsonObject) {
    for (var prop in Object.keys(example)) {
        console.log(prop);
        if (!(typeof(jsonObject[prop]) === 'string')
            && !(jsonObject[prop] instanceof Array)) {
                recursivelyIterateProperties(jsonObject[prop]);

            }

     }
}

还添加了递归方式：

function iterate(obj) {
    // watch for objects we've already iterated so we won't end in endless cycle
    // for cases like var foo = {}; foo.bar = foo; iterate(foo);
    var walked = [];
    var stack = [{obj: obj, stack: ''}];
    while(stack.length > 0)
    {
        var item = stack.pop();
        var obj = item.obj;
        for (var property in obj) {
            if (obj.hasOwnProperty(property)) {
                if (typeof obj[property] == "object") {
                  // check if we haven't iterated through the reference yet
                  var alreadyFound = false;
                  for(var i = 0; i < walked.length; i++)
                  {
                    if (walked[i] === obj[property])
                    {
                      alreadyFound = true;
                      break;
                    }
                  }
                  // new object reference
                  if (!alreadyFound)
                  {
                    walked.push(obj[property]);
                    stack.push({obj: obj[property], stack: item.stack + '.' + property});
                  }
                }
                else
                {
                    console.log(item.stack + '.' + property + "=" + obj[property]);
                }
            }
        }
    }
}

在这里，我迭代每个节点并创建有意义的节点名称。如果您注意到，instanceOf Array和instanceOf Object几乎做了相同的事情（在我的应用程序中，我给出了不同的逻辑）

注：我从Ondrej Svejdar的回答中得到启发。但此解决方案具有更好的性能和更少的不确定性，jquery允许您现在就这样做：

$.each( obj, function( key, value ) {
  alert( key + ": " + value );
});

您基本上希望循环对象中的每个属性


现在，只需添加Symbol.iterator方法，就可以将标准JS对象转换为iterable对象。然后，您可以使用
for of
循环并直接访问其值，甚至可以在对象上使用扩展运算符。酷。让我们看看如何才能做到：


varo={a:1，b:2，c:3}，
a=[]；
o[Symbol.iterator]=函数*（）{
var ok=Object.keys（这个）；
i=0；
而（i控制台日志（a）在ES的最新实现中，您可以使用：

或

如果只想迭代这些值，请使用Object.values：

for (const value of Object.values(obj)) { }

或

你可以用Lodash

女孩和男孩我们在2019年，我们没有那么多时间打字。。。那么，让我们来做一个酷炫的ECMAScript 2016：

Object.keys(obj).forEach(e => console.log(`key=${e}  value=${obj[e]}`));

如果运行节点，我建议：

Object.keys(obj).forEach((key, index) => {
    console.log(key);
});

为了进一步完善已接受的答案，值得注意的是，如果使用
var object=object.create（null）
实例化对象，则
object.hasOwnProperty（property）
将触发类型错误。为了安全起见，您需要从原型中调用它，如下所示：

for (var property in object) {
    if (Object.prototype.hasOwnProperty.call(object, property)) {
        // do stuff
    }
}

如果您的环境支持ES2017，那么我建议对象。条目：

Object.entries(obj).forEach(([key, value]) => {
  console.log(`${key} ${value}`);
});

如文件所示：

Object.entries（）方法返回给定对象的
Object.values(obj).forEach(value => ...)

var obj = {a: 1, b: 2, c: 3};
_.keys(obj).forEach(function (key) {
    ...
});

Object.keys(obj).forEach(e => console.log(`key=${e}  value=${obj[e]}`));

let obj = {"a": 3, "b": 2, "6": "a"}

Object.keys(obj).forEach((item) => {console.log("item", obj[item])})

// a
// 3
// 2

Object.keys(obj).forEach((key, index) => {
    console.log(key);
});

for (var property in object) {
    if (Object.prototype.hasOwnProperty.call(object, property)) {
        // do stuff
    }
}

Object.entries(obj).forEach(([key, value]) => {
  console.log(`${key} ${value}`);
});

// This step is not necessary with Object.entries
if (object.hasOwnProperty(property)) {
  // do stuff
}

var obj = {
  a: "foo",
  b: "bar",
  c: "foobar"
};

// We need to iterate the string keys (not the objects)
for(var someKey in obj)
{
  // We check if this key exists in the obj
  if (obj.hasOwnProperty(someKey))
  {
    // someKey is only the KEY (string)! Use it to get the obj:
    var myActualPropFromObj = obj[someKey]; // Since dynamic, use [] since the key isn't literally named "someKey"

    // NOW you can treat it like an obj
    var shouldBeBar = myActualPropFromObj.b;
  }
}

for (var property in obj) {
    if (!obj.hasOwnProperty(property)) continue;

    // Do stuff...
}

Object.keys(obj).forEach(key =>
  console.log(`key=${key} value=${obj[key]}`)
);

let obj = { a: 'Carrot', b: 'Potato', Car: { doors: 4 } };

// logs each key
Reflect.ownKeys(obj).forEach(key => console.log(key));

Object.prototype[Symbol.iterator] = function*() { 
    for(p of Reflect.ownKeys(this)){ yield this[p]; }
}

for(val of obj) { console.log('Value is:' + val ) }

const newObj = Object.keys(obj).map(el => {
    //ell will hold keys 
   // Getting the value of the keys should be as simple as obj[el]
})

if(Object.keys(obj).length) {
    Object.keys(obj).forEach(key => {
        console.log("\n" + key + ": " + obj[key]);
    });
}

// *** Explanation line by line ***

// Explaining the bellow line
// It checks if obj has at least one property. Here is how:
// Object.keys(obj) will return an array with all keys in obj.
// Keys are just the regular incremental numbers starting from 0.
// If there is no keys in obj, it will return empty array = []
// Then it will get its length. At this point, it checks: 
// If it has at least one element, it means it's bigger than 0 
// which evaluates to true and the bellow code will be executed.
// Else means it's length = 0 which evaluates to false
// NOTE: you can use Object.hasOwnProperty() instead of Object.keys(obj).length
if(Object.keys(obj).length) {

    // Explaining the bellow line
    // Just like in the previous line, this returns an array with
    // all keys in obj (because if code execution got here, it means 
    // obj has keys.) 
    // Then just invoke built-in javascript forEach() to loop
    // over each key in returned array and calls a call back function 
    // on each array element (key), using ES6 arrow function (=>)
    // Or you can just use a normal function ((key) { blah blah }).
    Object.keys(obj).forEach(key => {

        // The bellow line prints out all keys with their 
        // respective value in obj.
        // key comes from the returned array in Object.keys(obj)
        // obj[key] returns the value of key in obj
        console.log("\n" + key + ": " + obj[key]);
    });
}

var person = {fname:"John", lname:"Doe", age:25}; 

  var text = "";
  var x;
  for (x in person) {
    text += person[x] + " "; // where x will be fname,lname,age
   }
Console.log(text);

typeof propt