สำหรับ .. ในลูปใน JavaScript - คู่ของค่าคีย์

ฉันสงสัยว่ามีวิธีการทำบางอย่างเช่นการforeachวนรอบPHP ใน JavaScript หรือไม่ ฟังก์ชั่นที่ฉันกำลังมองหาคืออะไรอย่าง PHP Snippet นี้:

foreach($data as $key => $value) { }

ผมกำลังมองไปที่ JS for..inห่วง asแต่ดูเหมือนว่าจะมีวิธีการที่จะระบุไม่มี หากฉันทำสิ่งนี้ด้วย 'ปกติ' สำหรับลูป ( for(var i = 0; i < data.length; i++) มีวิธีในการจับคู่คีย์ => ค่าหรือไม่

หากคุณสามารถใช้ES6หรือด้วยBabel (js compiler) คุณสามารถทำสิ่งต่อไปนี้:

const test = {a: 1, b: 2, c: 3};

for (const [key, value] of Object.entries(test)) {
  console.log(key, value);
}

ซึ่งจะพิมพ์ผลลัพธ์นี้:

a 1
b 2
c 3

Object.entries()วิธีการส่งกลับอาร์เรย์ของวัตถุที่ได้รับของตัวเองคุณสมบัตินับ[key, value]คู่ในลำดับเช่นเดียวกับที่ให้บริการโดยfor...inวง(ความแตกต่างที่ว่าสำหรับในห่วงระบุคุณสมบัติในห่วงโซ่ต้นแบบเช่นกัน)

• เอกสารObject.entries
• สำหรับ ... จากเอกสาร
• เอกสารการมอบหมายการทำลายล้าง
• การแจกแจงและความเป็นเจ้าของเอกสารคุณสมบัติ

หวังว่ามันจะช่วย! =)

for (var k in target){
    if (target.hasOwnProperty(k)) {
         alert("Key is " + k + ", value is " + target[k]);
    }
}

hasOwnPropertyใช้เพื่อตรวจสอบว่าของคุณtargetมีคุณสมบัตินั้นจริง ๆ หรือไม่แทนที่จะสืบทอดมาจากต้นแบบ ง่ายกว่าเล็กน้อย:

for (var k in target){
    if (typeof target[k] !== 'function') {
         alert("Key is " + k + ", value is" + target[k]);
    }
}

มันเป็นเพียงแค่การตรวจสอบที่kไม่ได้เป็นวิธีการ (เช่นถ้าtargetเป็นarrayคุณจะได้รับจำนวนมากของวิธีการรับการแจ้งเตือนเช่นindexOf, push, popฯลฯ .)

ไม่มีใครพูดถึงObject.keysดังนั้นฉันจะพูดถึงมัน

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

สำหรับ ... ในจะทำงานให้คุณ

for( var key in obj ) {
  var value = obj[key];
}

ใน JavaScript สมัยใหม่คุณสามารถทำสิ่งนี้ได้:

for ( const [key,value] of Object.entries( obj ) ) {

}

var obj = {...};
for (var key in obj) {
    var value = obj[key];

}

ไวยากรณ์ php เป็นเพียงน้ำตาล

ฉันถือว่าคุณรู้ว่าiเป็นกุญแจสำคัญและคุณสามารถรับค่าผ่านทางdata[i](และเพียงแค่ต้องการทางลัดสำหรับสิ่งนี้)

ECMAScript5 แนะนำforEach ^[MDN]สำหรับอาร์เรย์ (ดูเหมือนว่าคุณมีอาร์เรย์):

data.forEach(function(value, index) {

});

เอกสารประกอบ MDN จัดทำ shim สำหรับเบราว์เซอร์ที่ไม่รองรับ

แน่นอนว่านี่ใช้ไม่ได้กับวัตถุ แต่คุณสามารถสร้างฟังก์ชั่นที่คล้ายกันได้

function forEach(object, callback) {
    for(var prop in object) {
        if(object.hasOwnProperty(prop)) {
            callback(prop, object[prop]);
        }
    }
}

เนื่องจากคุณติดแท็กคำถามด้วย jQuery, jQuery จัดเตรียม$.each ^[docs]ซึ่งวนรอบทั้งโครงสร้างอาร์เรย์และวัตถุ

คุณสามารถใช้for..inสำหรับการที่

for (var key in data)
{
    var value = data[key];
}

for (var key in myMap) {
    if (myMap.hasOwnProperty(key)) {
        console.log("key =" + key);
        console.log("value =" + myMap[key]);
    }
}

ใน javascript วัตถุทุกชิ้นมีคู่ของคีย์ - ค่าในตัวที่มีข้อมูลเมตา เมื่อคุณวนลูปผ่านคู่คีย์ - ค่าทั้งหมดสำหรับวัตถุที่คุณกำลังลูปมัน การใช้ hasOwnProperty () จะกรองเหล่านี้ออก

ES6 จะให้ Map.prototype.forEach (การโทรกลับ) ซึ่งสามารถใช้งานได้เช่นนี้

myMap.forEach(function(value, key, myMap) {
                        // Do something
                    });

let test = {a: 1, b: 2, c: 3};
Object.entries(test).forEach(([key, value]) => console.log(key, value))

// a 1
// b 2
// c 3

คุณสามารถใช้การวน 'เพื่อใน' สำหรับสิ่งนี้:

for (var key in bar) {
     var value = bar[key];
}

ด้านล่างเป็นตัวอย่างที่ใกล้เคียงกับที่คุณได้รับ

for(var key in data){
  var value = data[key];    
  //your processing here
}

หากคุณใช้ jQuery โปรดดู: http://api.jquery.com/jQuery.each/

หากคุณใช้Lodashคุณสามารถใช้_.forEach

_.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
  console.log(key + ": " + value);
});
// => Logs 'a: 1' then 'b: 2' (iteration order is not guaranteed).

ในช่วงไม่กี่ปีที่ผ่านมานับตั้งแต่มีการตั้งคำถามจาวาสคริปต์ได้เพิ่มคุณสมบัติใหม่บางอย่าง หนึ่งในนั้นคือวิธีการObject.Entries

คัดลอกโดยตรงจาก MDN คือข้อมูลโค้ดติดตาม

const object1 = {
  a: 'somestring',
  b: 42
};

for (let [key, value] of Object.entries(object1)) {
  console.log(`${key}: ${value}`);
}

ใช่คุณสามารถมีอาร์เรย์ที่เชื่อมโยงได้ใน javascript

var obj = 
{
    name:'some name',
    otherProperty:'prop value',
    date: new Date()
};
for(i in obj)
{
    var propVal = obj[i]; // i is the key, and obj[i] is the value ...
}

var global = (function() {
   return this;
})();

// Pair object, similar to Python

function Pair(key, value) {
    this.key = key;
    this.value = value;

    this.toString = function() {
       return "(" + key + ", " + value + ")";
    };
}

/**
 * as function
 * @param {String} dataName A String holding the name of your pairs list.
 * @return {Array:Pair} The data list filled
 *    with all pair objects.
 */
Object.prototype.as = function(dataName) {
    var value, key, data;
    global[dataName] = data = [];

    for (key in this) {
       if (this.hasOwnProperty(key)) {
          value = this[key];

          (function() {
             var k = key,
                 v = value;

            data.push(new Pair(k, v));
          })();
       }
    }

    return data;
};

var d = {
   'one': 1,
   'two': 2
};

// Loop on your (key, list) pairs in this way
for (var i = 0, max = d.as("data").length; i < max; i += 1) {
   key = data[i].key;
   value = data[i].value;

   console.log("key: " + key + ", value: " + value);
}

// delete data when u've finished with it.
delete data;