JavaScript дээр ассоциатив массивыг хэрхэн үүсгэх. Бодит массив болгон хувиргах JavaScript дээрх массивыг давтах бүх арга замууд

Хамгийн сүүлийн үеийн шинэчлэл: 26.03.2018

Array объект нь массивыг төлөөлж, массивыг удирдах хэд хэдэн шинж чанар, аргуудыг өгдөг.

Массивыг эхлүүлж байна

Та дөрвөлжин хаалт эсвэл Массив үүсгэгчийг ашиглан хоосон массив үүсгэж болно:

Var хэрэглэгчид = new Array(); var people =; console.log(хэрэглэгч); // Массив консол.лог(хүмүүс); //Массив

Та тодорхой тооны элемент бүхий массивыг нэн даруй эхлүүлж болно:

Var хэрэглэгчид = new Array("Том", "Билл", "Алис"); var people = ["Сэм", "Жон", "Кейт"]; console.log(хэрэглэгч); // ["Том", "Билл", "Алис"] console.log(хүмүүс); // ["Сэм", "Жон", "Кэйт"]

Та массивыг тодорхойлж, түүнд шинэ элементүүд нэмж болно:

Var хэрэглэгчид = new Array(); хэрэглэгчид = "Том"; хэрэглэгчид = "Кейт"; console.log(хэрэглэгч); // "Том" console.log(хэрэглэгч); // тодорхойгүй

Анхдагч байдлаар массив нь тэг урттай байх нь хамаагүй. Индексүүдийг ашиглан бид массив дахь тодорхой элементийг тодорхой индексээр орлуулж болно.

урт

Массивын уртыг мэдэхийн тулд length шинж чанарыг ашиглана:

Var fruit = new Array(); жимс = "алим"; жимс = "лийр"; жимс = "чавга"; document.write("Жимсний массив" + fruit.length + " элемент:
"); for(var i=0; i< fruit.length; i++) document.write(fruit[i] + "
");

Үнэн хэрэгтээ массивын урт нь сүүлийн элементийн индекс дээр нэг байх болно. Жишээ нь:

Var хэрэглэгчид = new Array(); // массивт 0 элемент байна хэрэглэгчид = "Том"; хэрэглэгчид = "Кейт"; хэрэглэгчид = "Сэм"; for(var i=0; i 0) ( үр дүн = үнэн; ) үр дүнг буцаана; ); var passed = тоо.бүгд (нөхцөл); баримт бичиг.бичих(давсан); // худал

Every() арга нь нөхцөлийг параметр болгон илэрхийлэх функцээр дамждаг. Энэ функц нь гурван параметрийг авдаг:

Функцийн нөхцөл (утга, индекс, массив) ( )

Утга параметр нь давтагдаж буй массивын элементийг, индексийн параметр нь тухайн элементийн индексийг, массивын параметр нь массивын лавлагааг дамжуулдаг.

Энэ функцээр бид дамжуулсан элементийн утгыг зарим нөхцөл байдалд нийцэж байгаа эсэхийг шалгаж болно. Жишээлбэл, энэ жишээнд бид массивын элемент бүрийг тэгээс их эсэхийг шалгадаг. Хэрэв энэ нь илүү байвал бид үнэн утгыг буцаана, өөрөөр хэлбэл элемент нь нөхцөлийг хангаж байна. Хэрэв бага бол худал гэж буцаана - элемент нь нөхцөлийг хангахгүй байна.

Үүний үр дүнд numbers.every(нөхцөл) аргыг дуудах үед энэ нь тоон массивын бүх элементүүдийг давтаж, нөхцөл функц руу нэг нэгээр нь дамжуулдаг. Хэрэв энэ функц бүх элементүүдэд үнэнийг буцаавал every() арга нь үнэнийг буцаана. Хэрэв дор хаяж нэг элемент нөхцөлтэй тохирохгүй байвал every() арга нь худал буцаана.

зарим нь()

Some() арга нь every() аргатай төстэй бөгөөд зөвхөн дор хаяж нэг элемент нөхцөлтэй тохирч байгаа эсэхийг шалгадаг. Мөн энэ тохиолдолд some() арга нь үнэнийг буцаана. Хэрэв массив дахь нөхцөлтэй тохирох элемент байхгүй бол худал буцаана:

Var тоонууд = [ 1, -12, 8, -4, 25, 42 ]; функцийн нөхцөл(утга, индекс, массив) ( var үр дүн = худал; хэрэв (утга === 8) ( үр дүн = үнэн; ) үр дүн; ); var passed = тоо.зарим(нөхцөл); // үнэн

шүүлтүүр()

filter() арга нь some() болон every() гэх мэт нөхцөл функцийг хүлээн зөвшөөрдөг. Гэхдээ тэр үед энэ нөхцөлийг хангасан элементүүдийн массивыг буцаана:

Var тоонууд = [ 1, -12, 8, -4, 25, 42 ]; функцийн нөхцөл(утга, индекс, массив) ( var үр дүн = худал; хэрэв (утга > 0) ( үр дүн = үнэн; ) үр дүнг буцаана; ); var filteredNumbers = тоо.шүүлтүүр(нөхцөл); for(var i=0; i< filteredNumbers.length; i++) document.write(filteredNumbers[i] + "
");

Хөтөчийн гаралт:

1 8 25 42

forEach() болон map()

forEach() болон map() аргууд нь элементүүдийг давтаж, тэдгээрт тодорхой үйлдлүүдийг гүйцэтгэдэг. Жишээлбэл, массив дахь тоонуудын квадратыг тооцоолохын тулд та дараах кодыг ашиглаж болно.

Var тоонууд = [1, 2, 3, 4, 5, 6]; for(var i = 0; i

  • HTML
  • JavaScript
$("ul#myList").children().each(function())( console.log($(энэ).text()); )); // Үр дүн: // HTML // CSS // JavaScript

jQuery-ийн арга бүрийн сүүлчийн индексийг (зүйл) тодорхойлох аргыг харцгаая.

// элементүүдийг сонгох var myList = $("ul li"); // сонголтын элементийн тоог тодорхойлох var total = myList.length; // сонгосон элементүүдээр давтах myList.each(function(index) ( if (индекс === нийт - 1) ( // энэ нь сонголтын сүүлчийн элемент ) ));

Тодорхойлолт ба хэрэглээ

JavaScript forEach() арга нь дамжуулсан функцийг массивын элемент тус бүрд нэг удаа өсөх индексийн дарааллаар гүйцэтгэх боломжийг олгодог.

ForEach() аргад параметр болгон дамжуулсан буцаан дуудах функц нь устгагдсан эсвэл дутуу массивын элементүүдэд дуудагдахгүй гэдгийг анхаарна уу.

forEach() аргыг ашиглан боловсруулсан элементүүдийн хүрээг өмнө нь тохируулсан эхлээдбуцаан залгах функцийг дуудаж байна. Хэрэв массив дуудагдсаны дараа элементүүдийг нэмсэн бол функц ийм элементүүд дээр дуудагдахгүй.

Хэрэв одоо байгаа массивын элементүүдийн утгууд гүйцэтгэх үед өөрчлөгдвөл функцэд дамжуулсан утга нь forEach() арга нь тэдгээрт зочлох үеийн утга болно. Хэрэв зочлохоос өмнө элементүүдийг устгасан бол эдгээр элементүүдэд зочлохгүй. Хэрэв массивыг дайран өнгөрөхдөө өмнө нь зочилсон элементүүдийг устгавал дараа дараагийн элементүүдийг алгасах болно.

Хөтөчийн дэмжлэг Арга
Дуурь
IExplorer
Ирмэг
forEach()ТиймээТиймээТиймээТиймээ9.0 Тиймээ
JavaScript синтакс: // зөвхөн дуудлагын функцтэй массив.forEach(функц ( одоогийн утга, индекс, арр))) // this түлхүүр үгээр лавлаж болох объектыг ашиглана массив.forEach(функц ( одоогийн утга, индекс, арр), энэ утга); JavaScript хувилбар ECMAScript 5.1 (JavaScript 1.6-д хэрэгжүүлсэн) Параметрийн утгууд Параметрийн тодорхойлолт
функц Буцах дуудлагын функцийг гүйцэтгэнэ нэгмассив дахь элемент бүрийн удаа. Функц нь авдаг дараах параметрүүд:
  • одоогийн утга- одоогийн элементийн утга
  • индекс- одоогийн элементийн массивын индекс.
  • арр- одоогийн элемент хамаарах массив (дамжуулан дамжих).

Хэрэв функцийн объект биш аргад ямар нэг зүйлийг параметр болгон дамжуулвал үл хамаарах зүйл шидэгдэх болно Төрөл алдаа. Шаардлагатай параметр.

энэ утга Буцах функц дотор this түлхүүр үгээр лавлаж болох объект. Хэрэв параметр энэ утгаашиглагдаагүй бол тодорхойлогдоогүй нь үүний утга болгон ашиглагдах болно (эцэст нь энэ нь функцийн гүйцэтгэлийн контекстийн ердийн дүрмээс хамаарна). Нэмэлт параметр.
Хэрэглээний жишээ

Дараах жишээн дээр бид массивын бүх элементүүдийн нийлбэрийг хэрхэн яаж авахыг авч үзэх болно JavaScript forEach() арга:

var массив =; массив var нийлбэр = 0 ; // тоон утга агуулсан хувьсагчийг эхлүүлэх одоогийн утга) { .forEach(// sumNumber массив функцийн бүх элементүүдийг давтах += одоогийн утганийлбэр .forEach(// sumNumber массив функцийн бүх элементүүдийг давтах;

) ); консол .лог( ); // 50-тай тэнцэх нийлбэр хувьсагчийн утгыг харуулнаДараах жишээнд бид ашиглахыг авч үзэх болно хоёрдугаарт forEach() аргын аргумент бөгөөд энэ нь бидний ашиглаж болох объектыг зааж өгдөг

түлхүүр үг одоогийн утга) ( // утга буцаах объектын арга одоогийн утга * одоогийн утга; // ба квадратаар нь буцаана ) ; тоо.forEach(// массивын тоон функцын бүх элементүүдийг давтах ( одоогийн утга) { дөрвөлжин.push(энэ .дөрвөлжин( одоогийн утга))) // myObject объектын квадрат аргын буцах утгыг квадрат массив дээр нэмэх, myObject// бидний хэлж буй объект this ); консол .лог( дөрвөлжин); // -тэй тэнцүү квадрат хувьсагчийн утгыг харуулах;
  • I. Бодит массивууд дээр давталт хийх
  • forEach арга болон холбогдох аргууд
  • for гогцоо
  • for...in давталтыг зөв ашиглах
  • for... of loop (давтагчийг далд ашиглах)
  • Давталтыг тодорхой ашиглах
  • Бодит массивуудыг давтах аргуудыг ашиглах
  • Бодит массив руу хөрвүүлэх
  • Ажиллах үеийн объектуудын тухай тэмдэглэл
I. Бодит массивуудыг тоолох On одоогоорБодит массивын элементүүдийг давтах гурван арга байдаг:
  • арга Array.prototype.forEach ;
  • сонгодог for loop
  • for... in loop-д "зөв" бүтээгдсэн.
  • Нэмж дурдахад удалгүй шинэ ECMAScript 6 (ES 6) стандарт гарч ирснээр өөр хоёр аргыг ашиглах төлөвтэй байна.
  • for... of гогцоо (давтагчийг далд ашиглах);
  • давталтыг тодорхой ашиглах.
  • 1. forEach арга ба холбогдох аргууд Хэрэв таны төсөл ECMAScript 5 (ES5) стандартын онцлогуудыг дэмжихээр бүтээгдсэн бол та түүний нэг шинэлэг зүйл болох forEach аргыг ашиглаж болно.

    Хэрэглээний жишээ:
    var a = ["a", "b", "c"]; a.forEach(функц(оруулга) ( консол.лог(оруулга); ));
    Ерөнхийдөө forEach-ийг ашиглахын тулд энэ аргыг дэмждэггүй хөтчүүдэд es5-shim эмуляцийн санг холбох шаардлагатай. Үүнд IE 8 ба түүнээс дээш хувилбарууд орно эрт хувилбарууд, одоо ч энд тэнд ашиглагдаж байна.

    ForEach-ийн давуу тал нь тухайн массивын элементийн индекс болон утгыг хадгалахын тулд локал хувьсагчдыг зарлах шаардлагагүй, учир нь тэдгээр нь автоматаар буцаан дуудах функцэд аргумент хэлбэрээр шилждэг.

    Хэрэв та элемент бүр дээр дахин дуудлага хийх боломжтой гэж санаа зовж байгаа бол санаа зовох хэрэггүй бөгөөд үүнийг уншина уу.

    ForEach нь массивын бүх элементүүдийг давтахад зориулагдсан боловч үүнээс гадна ES5 нь бүх эсвэл зарим элементийг давтах хэд хэдэн ашигтай аргуудыг санал болгодог бөгөөд тэдгээр дээр зарим үйлдлийг гүйцэтгэдэг:

    • every - массивын элемент бүрийн хувьд буцаан дуудах нь үнэн рүү хөрвүүлэх боломжтой утгыг буцаавал үнэнийг буцаана.
    • some - массивын ядаж нэг элементийн хувьд буцаан дуудлагыг үнэн болгож хувиргах утгыг буцаавал үнэнийг буцаана.
    • filter - буцаан дуудлагыг үнэн гэж буцаадаг анхны массивын элементүүдийг агуулсан шинэ массив үүсгэдэг.
    • газрын зураг - буцааж дуудлагын дагуу буцаасан утгуудаас бүрдэх шинэ массив үүсгэдэг.
    • багасгах - массивыг нэг утга болгон багасгаж, эхнийхээс эхлэн массивын элемент бүрд ээлжлэн дуудлагыг ашиглана (массивын элементүүд болон бусад хураангуй функцуудын нийлбэрийг тооцоолоход хэрэг болно).
    • reduceRight - багасгахтай төстэй ажилладаг боловч урвуу дарааллаар элементүүдээр дамждаг.
    2. For гогцоо Хуучны дүрэм журам:

    Var a = ["a", "b", "c"]; var индекс; хувьд (индекс = 0; индекс< a.length; ++index) { console.log(a); }
    Хэрэв массивын урт нь давталтын туршид тогтмол бөгөөд гогцоо нь өөрөө кодын гүйцэтгэлийн чухал хэсэгт хамаарах (энэ нь магадлал багатай) бол та "илүү оновчтой" хувилбарыг ашиглаж болно. массив:

    Var a = ["a", "b", "c"]; var index, len; for (индекс = 0, len = a.length; индекс< len; ++index) { console.log(a); }
    Онолын хувьд энэ код өмнөхөөсөө арай хурдан ажиллах ёстой.

    Хэрэв элементүүдийн дараалал чухал биш бол та оновчлолын хувьд цаашаа явж, массивын уртыг хадгалах хувьсагчаас салж, хайлтын дарааллыг урвуу болгон өөрчилж болно.

    Var a = ["a", "b", "c"]; var индекс; for (индекс = a.length - 1; index >= 0; --index) ( console.log(a); )
    Гэсэн хэдий ч орчин үеийн JavaScript хөдөлгүүрүүдэд ийм оновчлолын тоглоомууд ихэвчлэн юу ч биш юм.

    3. For... in давталтыг зөв ашиглах Хэрэв танд for... in давталтыг ашиглахыг зөвлөж байгаа бол массив дээр давталт хийх нь зориулалтын зүйл биш гэдгийг санаарай. Түгээмэл буруу ойлголтоос ялгаатай нь for... in давталт нь массивын индексүүдийг давтахгүй, харин объектын тоолж болох шинж чанаруудаар дамждаг.

    Гэсэн хэдий ч, сийрэг массивуудыг давтах гэх мэт зарим тохиолдолд for...in нь доорх жишээн дээр харуулсны дагуу урьдчилан сэргийлэх арга хэмжээ авсан тохиолдолд ашигтай байж болно.

    // a - сийрэг массив var a = ; a = "a"; a = "b"; a = "c"; for (a-д байгаа var key) ( if (a.hasOwnProperty(key) && /^0$|^\d*$/.test(түлхүүр) && түлхүүр

    Сонголт