จะหยุด JavaScript สำหรับการวนซ้ำได้อย่างไร

ฉันใช้ JavaScript นี้เพื่อวนซ้ำผ่านอาร์เรย์และค้นหาองค์ประกอบอาร์เรย์ที่ตรงกัน:

var remSize = [], 
    szString, remData, remIndex, i;

for (i = 0; i < remSize.length; i++) {      
    // I'm looking for the index i, when the condition is true
    remSize[i].size == remData.size ? remIndex = i : remIndex = -1;     
}

อาร์เรย์มีเหล่านี้ ["34", "36", "38"...]"ขนาด":

remData.size คือ "ขนาด" ที่ฉันกำลังมองหา (เช่น "36")

ฉันต้องการส่งคืนดัชนีiหากขนาดที่ฉันค้นหาอยู่ในดัชนี -1มิฉะนั้นผมต้องกลับ มีวิธีที่ดีกว่านี้หรือไม่?

ในการหยุดการforวนซ้ำในช่วงต้นของ JavaScript คุณใช้break:

var remSize = [], 
    szString,
    remData,
    remIndex,
    i;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remIndex = -1; // Set a default if we don't find it
for (i = 0; i < remSize.length; i++) {      
     // I'm looking for the index i, when the condition is true
     if (remSize[i].size === remData.size) {
          remIndex = i;
          break;       // <=== breaks out of the loop early
     }
}

หากคุณอยู่ในสภาพแวดล้อม ES2015 (aka ES6) สำหรับกรณีการใช้งานที่เฉพาะเจาะจงนี้คุณสามารถใช้Array#findIndex(เพื่อค้นหาดัชนีของรายการ) หรือArray#find(เพื่อค้นหารายการนั้นเอง) ซึ่งทั้งสองอย่างนี้สามารถ shimmed / polyfilled:

var remSize = [], 
    szString,
    remData,
    remIndex;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remIndex = remSize.findIndex(function(entry) {
     return entry.size === remData.size;
});

Array#find:

var remSize = [], 
    szString,
    remData,
    remEntry;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remEntry = remSize.find(function(entry) {
     return entry.size === remData.size;
});

Array#findIndexหยุดในครั้งแรกที่การโทรกลับส่งคืนค่าที่แท้จริงโดยส่งคืนดัชนีสำหรับการโทรนั้นไปยังการเรียกกลับ จะส่งคืน-1หากการโทรกลับไม่ส่งคืนค่าที่แท้จริง Array#findยังหยุดเมื่อพบสิ่งที่คุณกำลังมองหา แต่จะส่งกลับรายการไม่ใช่ดัชนี (หรือundefinedหากการเรียกกลับไม่ส่งคืนค่าที่แท้จริง)

หากคุณใช้สภาพแวดล้อมที่เข้ากันได้กับ ES5 (หรือ ES5 shim) คุณสามารถใช้someฟังก์ชันใหม่บนอาร์เรย์ซึ่งเรียกการโทรกลับจนกว่าการโทรกลับจะส่งคืนค่าที่แท้จริง:

var remSize = [], 
    szString,
    remData,
    remIndex;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remIndex = -1; // <== Set a default if we don't find it
remSize.some(function(entry, index) {
    if (entry.size === remData.size) {
        remIndex = index;
        return true; // <== Equivalent of break for `Array#some`
    }
});

หากคุณใช้ jQuery คุณสามารถใช้jQuery.eachเพื่อวนผ่านอาร์เรย์ ซึ่งจะมีลักษณะดังนี้:

var remSize = [], 
    szString,
    remData,
    remIndex;

/* ...I assume there's code here putting entries in `remSize` and assigning something to `remData`... */

remIndex = -1; // <== Set a default if we don't find it
jQuery.each(remSize, function(index, entry) {
    if (entry.size === remData.size) {
        remIndex = index;
        return false; // <== Equivalent of break for jQuery.each
    }
});

ใช้สำหรับลูปแทนซึ่งเป็นส่วนหนึ่งของรุ่น ES2015 ไม่เหมือนกับ forEach เราสามารถใช้ return, break และ Continue ได้ ดูhttps://hacks.mozilla.org/2015/04/es6-in-depth-iterators-and-the-for-of-loop/

let arr = [1,2,3,4,5];
for (let ele of arr) {
  if (ele > 3) break;
  console.log(ele);
}

ตรรกะไม่ถูกต้อง มันจะส่งคืนผลลัพธ์ขององค์ประกอบสุดท้ายในอาร์เรย์เสมอ

remIndex = -1;

for (i = 0; i < remSize.length; i++) {      
    if (remSize[i].size == remData.size) {
        remIndex = i
        break;
    }
}

ฉันรู้ว่ามันเก่าไปหน่อย แต่แทนที่จะวนรอบอาร์เรย์ด้วย for loop มันจะง่ายกว่ามากที่จะใช้วิธีนี้ <array>.indexOf(<element>[, fromIndex])

มันวนลูปผ่านอาร์เรย์ค้นหาและส่งคืนดัชนีแรกของค่า หากไม่มีค่าในอาร์เรย์จะส่งกลับค่า -1

<array>คืออาร์เรย์ที่จะค้นหา<element>เป็นค่าที่คุณกำลังมองหาและ[fromIndex]เป็นดัชนีที่จะเริ่มจาก (ค่าเริ่มต้นเป็น 0)

ฉันหวังว่านี่จะช่วยลดขนาดโค้ดของคุณได้!