JavaScript- ში მასივის გადატვირთვის ყველა გზა. JQuery - განმეორებითი მასივი, ობიექტი და ელემენტები გადადის რეალურ მასივად

არც ისე დიდი ხნის წინ, წამიყვანა JavaScript ქმნის ასოციაციურ მასივს... საოცარია, მანამდე ის არასდროს მჭირდებოდა. JavaScript... დავიწყე ინტერნეტში ძიების ძიება. და მე ძალიან გამიკვირდა, რომ ხალხის უზარმაზარი რაოდენობა წერს, რომ ეს შეუძლებელია JavaScript ის არ არის. საბედნიეროდ, ჩემმა მრავალწლიანმა გამოცდილებამ მითხრა, რომ ისინი სისულელეა. ბოლოს ბოლოს გავარკვიე როგორ შევქმნათ ასოციაციური მასივი JavaScript- ში, რაზეც ამ სტატიაში მოგითხრობთ.

ქვემოთ მოცემულია კოდი, რომელშიც იქმნება ასოციაციური მასივი, შემდეგ დაემატება კიდევ ერთი ელემენტი და, ბოლოს, მასივი განმეორდება მარყუჟის მეშვეობით:

ამ სტატიაში ჩვენ განვიხილეთ ასოციაციური მასივების შექმნა, მათი ცვლილება, ისევე როგორც სრული ჩამოთვლა ციკლის განმავლობაში ამისთვის... მე პირადად გამოვიყენე ასოციაციური მასივები JavaScript- ში მხოლოდ ერთხელ, მაგრამ თქვენ უნდა იცოდეთ ასეთი შესაძლებლობა.

• I. მარკირება რეალურ მასივებში
  1. თითოეული და მასთან დაკავშირებული მეთოდები
  2. მარყუჟისთვის
  3. მარყუჟის სწორი გამოყენება
  4. მარყუჟისთვის (იტერატორის ნაგულისხმევი გამოყენება)
  5. იტერატორის აშკარა გამოყენება
• 1. რეალურ მასივებზე განმეორების მეთოდების გამოყენება
  2. მიმდინარეობს რეალურ მასივად გადაქცევა
  3. შენიშვნა სამუშაოების შესრულების დროზე

I. მარკირება რეალურ მასივებში

ამ დროისთვის რეალური მასივის ელემენტების განმეორების სამი გზა არსებობს:

1. array.prototype.for თითოეული მეთოდისთვის;
2. მარყუჟის კლასიკური;
3. კარგად ჩამოყალიბებული ... მარყუჟში.

გარდა ამისა, მალე, ECMAScript 6 (ES 6) ახალი სტანდარტის გაჩენისთანავე, კიდევ ორი \u200b\u200bგზაა მოსალოდნელი:

1. მარყუჟისთვის ... (იტერატორის ნაგულისხმევი გამოყენება);
2. იტერატორის აშკარა გამოყენება.

1. თითოეული მეთოდი და მასთან დაკავშირებული მეთოდები

თუ თქვენი პროექტი შექმნილია ECMAScript 5 (ES5) სტანდარტის შესაძლებლობების მხარდასაჭერად, შეგიძლიათ გამოიყენოთ მისი ერთ-ერთი ინოვაცია - forEach მეთოდი.

გამოყენების მაგალითი:
var a \u003d ["ა", "ბ", "გ"]; a.for (ფუნქცია (შესვლა) (console.log (შესვლა);));
ზოგადად, forEach– ის გამოყენება მოითხოვს es5-shim ემულაციის ბიბლიოთეკის დამაკავშირებლად იმ ბრაუზერებისთვის, რომლებსაც ამ მეთოდისთვის მხარდაჭერა არ აქვთ. ეს მოიცავს IE 8 და უფრო ადრე, რომლებიც დღესაც გამოიყენება.

ForEach– ის უპირატესობა არის ის, რომ არ არის საჭირო ადგილობრივი ცვლადების დეკლარირება მიმდინარე მასივის ელემენტის ინდექსისა და მნიშვნელობის შესანახად, რადგან ისინი ავტომატურად გადადიან ზარის დაბრუნების ფუნქციას, როგორც არგუმენტები.

თუ გაწუხებთ თითოეული ნივთის გამოძახების პოტენციური ღირებულება, არ ინერვიულოთ და წაიკითხეთ ეს.

ForEach შექმნილია მასივის ყველა ელემენტის განმეორებით, მაგრამ ამის გარდა ES5 გთავაზობთ კიდევ რამდენიმე სასარგებლო მეთოდს მთლიანი ან ზოგიერთი ელემენტის განმეორებისათვის, მათთან ერთად გარკვეული მოქმედებების შესასრულებლად:

• every - აბრუნებს სიმართლეს, თუ მასივის თითოეული ელემენტისთვის გამოძახება დაუბრუნებს მნიშვნელობას, რომელიც გადაცემულია ჭეშმარიტად.
• ზოგი - აბრუნებს სიმართლეს, თუ მასივის მინიმუმ ერთი ელემენტისთვის გამოძახება დაუბრუნებს მნიშვნელობას, რომელიც მიუთითებს სიმართლეზე.
• filter - ქმნის ახალ მასივს, რომელიც შეიცავს ორიგინალი მასივის იმ ელემენტებს, რომელთათვისაც ზარის დაბრუნება ხდება ჭეშმარიტი.
• რუკა - ქმნის ახალ მასივს, რომელიც შეიცავს ზარის დაბრუნებით დაბრუნებულ მნიშვნელობებს.
• შემცირება - მასივი ერთ მნიშვნელობამდე შემცირდება, მასივის თითოეულ ელემენტზე თავის მხრივ ზარის გამოყენება, პირველიდან დაწყებული (შეიძლება სასარგებლო იყოს მასივის ელემენტების ჯამის გამოსათვლელად და სხვა საბოლოო ფუნქციებისათვის).
• შემცირება მარჯვნივ - მსგავსია შემცირებისთვის, მაგრამ განმეორდება ელემენტებზე საპირისპირო თანმიმდევრობით.

2. მარყუჟისთვის

კარგი ძველი წესებისთვის:

Var a \u003d ["ა", "ბ", "გ"]; var ინდექსი; for (ინდექსი \u003d 0; ინდექსი< a.length; ++index) { console.log(a); }
თუ მასივის სიგრძე არ შეიცვლება მთელ მარყუჟში და ეს მარყუჟი მიეკუთვნება კოდის ეფექტურობას (რაც ნაკლებად სავარაუდოა), მასივის სიგრძის შენახვისას შეგიძლიათ გამოიყენოთ "უფრო ოპტიმალური" ვერსია:

Var a \u003d ["ა", "ბ", "გ"]; var ინდექსი, len; for (ინდექსი \u003d 0, len \u003d a.length; ინდექსი< len; ++index) { console.log(a); }
თეორიულად, ეს კოდი უნდა მუშაობდეს ოდნავ უფრო სწრაფად, ვიდრე წინა.

თუ განმეორების რიგი არ არის მნიშვნელოვანი, შეგიძლიათ კიდევ უფრო შორს წავიდეთ ოპტიმიზაციის თვალსაზრისით და მოიცილოთ მასივის სიგრძის შენახვის ცვლადი, განმეორების რიგის საპირისპიროდ შეცვლით:

Var a \u003d ["ა", "ბ", "გ"]; var ინდექსი; for (index \u003d a.length - 1; index\u003e \u003d 0; --index) (console.log (a);)
ამასთან, თანამედროვე JavaScript ძრავებში ეს ოპტიმიზირებული თამაშები ჩვეულებრივ არაფერს ნიშნავს.

3. მარყუჟის for ... სწორად გამოყენება

თუ გირჩევთ გამოიყენოთ მარყუჟის for ... გახსოვდეთ, რომ მასივების გამეორება არ არის ის, რისთვისაც არის გათვლილი. საყოველთაო არასწორი წარმოდგენის საწინააღმდეგოდ, for ... in მარყუჟი მიუთითებს არა მასივის ინდექსებზე, არამედ ობიექტის ჩამოთვლილ თვისებებზე.

ამასთან, ზოგიერთ შემთხვევაში, მაგალითად, იშვიათი მასივების გამეორება, for ... შეიძლება სასარგებლო იყოს, თუ გარკვეული ზომების მიღებას აპირებთ, როგორც ეს მოცემულია ქვემოთ მოცემულ მაგალითში:

// a არის იშვიათი მასივი var a \u003d; a \u003d "ა"; a \u003d "ბ"; a \u003d "გ"; for (var გასაღები ა) -ში (if (a.hasOwnProperty (გასაღები) && /^0$...<= 4294967294) { console.log(a); } }
ამ მაგალითში, მარყუჟის თითოეულ გამეორებაზე, ტარდება ორი შემოწმება:

1. რომ მასივს აქვს საკუთარი თვისება, სახელწოდებით გასაღები (არ არის მემკვიდრეობით მიღებული მისი პროტოტიპიდან).
2. ეს გასაღები არის სტრიქონი, რომელიც შეიცავს მთელი რიცხვის ათობითი ნიშანს, რომლის მნიშვნელობა ნაკლებია 4294967294. საიდან მოდის ბოლო რიცხვი? ES5- ში მასივის ინდექსის განმარტებით, რაც გულისხმობს, რომ მასივის ელემენტს ყველაზე დიდი ინდექსი შეიძლება ჰქონდეს (2 ^ 32 - 2) \u003d 4294967294.

რა თქმა უნდა, მარყუჟის შესრულებისას ასეთი შემოწმებები დამატებით დროს მიიღებს. იშვიათი მასივის შემთხვევაში, ეს მეთოდი უფრო ეფექტურია, ვიდრე for მარყუჟი, რადგან ამ შემთხვევაში მხოლოდ ის ელემენტებია, რომლებიც მასივში მკაფიოდ არის განსაზღვრული, განმეორდება. ამრიგად, ზემოთ მოყვანილ მაგალითში შესრულდება მხოლოდ 3 განმეორება (0, 10 და 10000 ინდექსებისთვის) - for მარყუჟის 10001-ის წინააღმდეგ.

იმისათვის, რომ არ დაწეროთ შემოწმების ასეთი რთული კოდი ყოველ ჯერზე, როდესაც მასივის გამეორება დაგჭირდებათ, შეგიძლიათ მოაწყოთ იგი, როგორც ცალკეული ფუნქცია:

ფუნქციის მასივი HasOwnIndex (მასივი, გასაღები) (დაბრუნების მასივი. აქვს საკუთარი საკუთრება (გასაღები) && /^0$|^dd$$/.test(key) && გასაღები<= 4294967294; }
შემდეგ მაგალითიდან მარყუჟის სხეული მნიშვნელოვნად შემცირდება:

For (გასაღები a- ში) (if (arrayHasOwnIndex (a, key)) (console.log (a);))
ზემოთ შემოწმების კოდი უნივერსალურია, შესაფერისია ყველა შემთხვევაში. ამის ნაცვლად, შეგიძლიათ გამოიყენოთ უფრო მოკლე ვერსია, თუმცა ფორმალურად არც თუ ისე სწორია, მაგრამ მაინც შესაფერისია უმეტეს შემთხვევაში:

For (გასაღები ა-ში) (if (a.hasOwnProperty (გასაღები) && String (parseInt (გასაღები, 10)) \u003d\u003d\u003d გასაღები) (console.log (a);))

4. მარყუჟის for ... (იტერატორის ნაგულისხმევი გამოყენება)

ES6, ჯერ კიდევ სტატუსის სტატუსშია, უნდა შევიდეს iterators in JavaScript.

იტერატორი არის ობიექტის მიერ განხორციელებული პროტოკოლი, რომელიც განსაზღვრავს მნიშვნელობების თანმიმდევრობის (სასრული ან უსასრულო) მიღების სტანდარტულ გზას.
Iterator არის ობიექტი, რომელშიც განისაზღვრება შემდეგი () მეთოდი - ფუნქცია არგუმენტების გარეშე, რომელიც უბრუნებს ობიექტს ორი თვისებით:

1. დასრულებულია (ლოგიკური) - მართალია, თუკი iterator მიაღწია განმეორებადი მიმდევრობის ბოლოს. წინააღმდეგ შემთხვევაში, ყალბი.
2. მნიშვნელობა - განსაზღვრავს იტერატორის მიერ დაბრუნებულ მნიშვნელობას. შეიძლება გაკეთდეს განუსაზღვრელი (არ არსებობს), თუ შესრულებული ქონება მართალია.

ბევრი ჩამონტაჟებული ობიექტი, მათ შორის. რეალურ მასივებს აქვთ ნაგულისხმევი განმეორება. რეალურ მასივებზე იტერატორის გამოყენების უმარტივესი გზაა ახალი ... კონსტრუქციის გამოყენება.

მაგალითად გამოყენების ... for:

ვარ ვალ; var a \u003d ["ა", "ბ", "გ"]; for (val a) (console.log (val);)
ზემოთ მოყვანილ მაგალითში, for ... მარყუჟი გულისხმობს Array ობიექტის iterator- ს მასივის თითოეული მნიშვნელობის მისაღებად.

5. იტერატორის აშკარა გამოყენება

განმეორებით შეიძლება ასევე გამოყენებულ იქნას მკაფიოდ, თუმცა ამ შემთხვევაში კოდი გაცილებით რთულდება მარყუჟის for ... - თან შედარებით. ასე გამოიყურება:

Var a \u003d ["ა", "ბ", "გ"]; var it \u003d a.entries (); var შესვლა; while (! (ჩანაწერი \u003d ეს. შემდეგი ()). შესრულებულია) (console.log (ჩანაწერი. მნიშვნელობა);)
ამ მაგალითში, Array.prototype.entries მეთოდი აბრუნებს iterator- ს, რომელიც გამოიყენება მასივის მნიშვნელობების საჩვენებლად. თითოეულ გამეორებაზე, enter.value შეიცავს მასივს, როგორიცაა [გასაღები, მნიშვნელობა].

II მასივის მსგავსი ობიექტების განმეორება

რეალური მასივების გარდა, JavaScript ასევე შეიცავს მასივის მსგავსი ობიექტები ... მათ საერთო აქვთ ნამდვილ მასივებთან, რომ მათ აქვთ სიგრძის თვისება და თვისებები სახელების სახით, მასივის ელემენტების შესაბამისი რიცხვების სახით. მაგალითებში შედის NodeList კოლექციის DOM და ნებისმიერი ფუნქციის / მეთოდის შიგნით არსებული ფსევდო-მასივის არგუმენტები.

1. რეალურ მასივებზე განმეორების მეთოდების გამოყენება

მინიმუმ, უმეტესობა, თუ არა ყველა, რეალური მასივების განმეორების მეთოდების გამოყენება შესაძლებელია მასივის ობიექტებზე განმეორების მიზნით.

For და for ... კონსტრუქციებში შეიძლება გამოყენებულ იქნას მასივის მსგავსი ობიექტები ზუსტად ისე, როგორც რეალურ მასივებზე.

ForEach და სხვა Array.prototype მეთოდები ასევე ვრცელდება მასივის მსგავსი ობიექტებზე. ამისათვის თქვენ უნდა გამოიყენოთ ზარი Function.call ან Function.apply.

მაგალითად, თუ გსურთ მიმართოთ კვანძის ობიექტის თითოეულ childNodes თვისებას, ამის გაკეთება შეგიძლიათ შემდეგნაირად:

Array.prototype.forEach.call (node.childNodes, ფუნქცია (ბავშვი) (// გააკეთეთ რამე ბავშვის ობიექტთან));
ამ ტექნიკის ხელახალი გამოყენების მიზნით, შეგიძლიათ გამოაცხადოთ Array.prototype.forE თითოეული მეთოდის მითითება ცალკეულ ცვლადში და გამოიყენოთ იგი სტენოგრამის სახით:

// (ეს მიიჩნევს, რომ ყველა ქვემოთ მოცემული კოდი იმავე სფეროშია) var forEach \u003d Array.prototype.forEach; // ... forEach.call (node.childNodes, ფუნქცია (ბავშვი) (// გააკეთეთ რამე ბავშვის ობიექტთან));
თუ მასივის მსგავს ობიექტს აქვს იტერატორი, მაშინ ის შეიძლება გამოყენებულ იქნეს აშკარად ან ნაგულისხმევად ობიექტზე განმეორებით ისე, როგორც რეალური მასივებისთვის.

2. გადაიყვანეთ რეალურ მასივად

ასევე არსებობს კიდევ ერთი, ძალიან მარტივი გზა, მასივის ობიექტზე განმეორება: გადაიყვანეთ იგი ნამდვილ მასივში და გამოიყენეთ ზემოთ ჩამოთვლილი მეთოდებიდან რეალურ მასივებზე გადასასვლელად. გარდასახვისთვის შეგიძლიათ გამოიყენოთ Array.prototype.slice ზოგადი მეთოდი, რომელიც შეიძლება გამოყენებულ იქნას ნებისმიერი მასივის მსგავსი ობიექტისთვის. ეს კეთდება ძალიან მარტივად, როგორც ნაჩვენებია ქვემოთ მოცემულ მაგალითში:

Var trueArray \u003d Array.prototype.slice.call (arrayLikeObject, 0);
მაგალითად, თუ გსურთ NodeList კოლექციის რეალურ მასივად გადაკეთება, ასეთი კოდი გჭირდებათ:

Var divs \u003d Array.prototype.slice.call (document.querySelectorAll ("div"), 0);
განახლება: როგორც აღნიშნულია როკისა და ტორბასოვის კომენტარებში, ES6- ში შეგიძლიათ გამოიყენოთ უფრო აღწერითი მეთოდი Array.from Array.prototype.slice- ის ნაცვლად.

3. შენიშვნა შესრულების ობიექტების შესახებ

თუ Array.prototype მეთოდებს იყენებთ გატარების დროში მყოფ ობიექტებზე (მაგალითად, DOM კოლექციები), უნდა გახსოვდეთ, რომ ამ მეთოდების გარანტია არ იმუშავებს სწორად მუშაობის დროს ყველა გამყოფი გარემოში (მათ შორის ბრაუზერებში). ეს დამოკიდებულია კონკრეტული ობიექტის ქცევაზე კონკრეტულ დროს, უფრო ზუსტად, იმაზე, თუ როგორ ხორციელდება HasProperty აბსტრაქტული ოპერაცია ამ ობიექტში. პრობლემა ისაა, რომ ES5 სტანდარტი საშუალებას იძლევა ობიექტის არასათანადო მოპყრობის შესაძლებლობას ამ ოპერაციასთან დაკავშირებით (იხ. §8.6.2).

ამიტომ, აუცილებელია Array.prototype მეთოდების მუშაობის შემოწმება ყველა იმ დროის განმავლობაში (ბრაუზერში), რომელშიც თქვენი აპლიკაციის გამოყენებას აპირებთ.

forEach () მეთოდი ახორციელებს მოწოდებულ ფუნქციას ერთხელ მასივის თითოეული ელემენტისთვის.

ამ ინტერაქტიული მაგალითის წყარო ინახება GitHub საცავში. თუ გსურთ მონაწილეობა მიიღოთ ინტერაქტიული მაგალითების პროექტში, გთხოვთ, შეაჯამოთ https://github.com/mdn/interactive-examples და გამოგვიგზავნოთ მოთხოვნის მოთხოვნა.

Სინტაქსი

arr. თითოეული (გამოძახება (მიმდინარე ღირებულება [, ინდექსი [, მასივი]])] [, thisArg])

Პარამეტრები

ზარის უკუკავშირის ფუნქცია, რომელიც უნდა შესრულდეს თითოეულ ელემენტზე. იგი იღებს ერთსა და სამ არგუმენტს შორის: currentValue მასივში მუშავდება მიმდინარე ელემენტი. ინდექსი სურვილისამებრ ინდექსის მიმდინარე ღირებულება მასივში. მასივი სურვილისამებრ მასივი forEach () გამოიძახეს. thisArg არასავალდებულო მნიშვნელობა გამოსაყენებლად, როგორც ზარის უკუკავშირის შესრულებისას.

დაბრუნების მნიშვნელობა

აღწერა

forEach () მოუწოდებს მოწოდებულ უკუკავშირის ფუნქციას ერთხელ მასივის თითოეული ელემენტისთვის ზრდადი თანმიმდევრობით. იგი არ არის გამოყენებული ინდექსის თვისებებისთვის, რომლებიც წაიშალა ან არაინციალიზებულია. (იშვიათი მასივებისთვის.)

გამოძახება ხდება სამი არგუმენტით:

1. ელემენტის მნიშვნელობა
2. ელემენტის ინდექსი
3. მასივის ობიექტი განიხილება

თუ forAach () –ს მიეწოდება thisArg პარამეტრი, ის გამოყენებული იქნება როგორც ზარის უკუკავშირი ამ მნიშვნელობად. ამArg– ის მნიშვნელობა, რომელიც საბოლოოდ აკვირდება უკუკავშირით, განისაზღვრება ჩვეულებრივი წესების შესაბამისად, რაც განსაზღვრავს ფუნქციას.

ForEach () - ის მიერ დამუშავებული ელემენტების დიაპაზონი განისაზღვრება უკუკავშირის პირველი გამოძახებამდე. ელემენტები, რომლებიც მასას ემატება forEach () –ზე ზარის დაწყების შემდეგ, აღარ მოინახულებს უკუკავშირით. თუ მასივის არსებული ელემენტები შეიცვალა ან წაიშალა, გამოძახებაზე გადასული მათი მნიშვნელობა იქნება თითოეული () მონახულების დროს. ელემენტები, რომლებიც წაიშლება მონახულებამდე, არ არის მონახულებული. თუ განმეორებისას უკვე მოინახულეს ელემენტები (მაგ. Shift ()) გამოიყენეთ, მოგვიანებით ელემენტები გამოტოვებენ. (იხილეთ ეს მაგალითი, ქვემოთ)

forEach () ასრულებს ზარის დაბრუნების ფუნქციას ერთხელ თითოეული მასივის ელემენტისთვის; განსხვავებით რუკაზე () ან შემცირება (), ის ყოველთვის უბრუნებს მნიშვნელობას განუსაზღვრელი და არ არის აპარატული. ტიპიური გამოყენების შემთხვევაა ჯაჭვის ბოლოს გვერდითი მოვლენების შესრულება.

forEach () არ შეცვლის მასივს, რომელზეც ის იწოდება. (ამასთან, ზარის გამოძახებამ შეიძლება გააკეთოს ეს)

ForEach () მარყუჟის შეჩერების ან გაწყვეტის სხვა გზა არ არსებობს, გარდა გამონაკლისის გადაყრისა. თუ ასეთი ქცევა გჭირდებათ, forEach () მეთოდი არასწორი ინსტრუმენტია.

ადრეული შეწყვეტა შეიძლება განხორციელდეს შემდეგით:

მასივის მეთოდები: ყველა (), ზოგი (), find () და findIndex () ატესტავს მასივის ელემენტებს პრედიკატით დაუბრუნებს truthy მნიშვნელობას, რათა დადგინდეს საჭიროა თუ არა შემდგომი განმეორება.

მაგალითები

არაინციალიზებული მნიშვნელობების ოპერაცია (იშვიათი მასივები)

const arraySparse \u003d ნება numCallbackRuns \u003d 0 arraySparse.forEach (ფუნქცია (ელემენტი) (console.log (ელემენტი) numCallbackRuns ++)) console.log ("numCallbackRuns:", numCallbackRuns) // 1 // 3 // 7 // numCallbackRuns: 3 // კომენტარი: როგორც ხედავთ დაკარგულ მნიშვნელობას 3 – დან 7 – მდე არ არის გამოძახების ზარის ფუნქცია.

For მარყუჟის კონვერტაცია for for each

const items \u003d ["item1", "item2", "item3"] const ასლი \u003d // for for (მოდით i \u003d 0; i< items.length; i++) { copy.push(items[i]) } // after items.forEach(function(item){ copy.push(item) })

მასივის შინაარსის ბეჭდვა

Შენიშვნა: კონსოლში მასივის შინაარსის საჩვენებლად, შეგიძლიათ გამოიყენოთ console.table (), რომელიც ბეჭდავს მასივის ფორმატირებულ ვერსიას.

შემდეგი მაგალითი ასახავს ალტერნატიულ მიდგომას, forEach– ის () გამოყენებით.

შემდეგი კოდი მასივის თითოეული ელემენტის ხაზს აფიქსირებს:

ფუნქციის logArrayElements (ელემენტი, ინდექსი, მასივი) (console.log ("a [" + index + "] \u003d" + ელემენტი)) // გაითვალისწინეთ, რომ ინდექსი 2 გამოტოვებულია, ვინაიდან // მასივი .... თითოეული (logArrayElement) // ჟურნალები: // a \u003d 2 // a \u003d 5 // a \u003d 9

იყენებს ამ Arg

შემდეგი (გამოგონილი) მაგალითი ახდენს მასალის ყოველი ჩანაწერიდან ობიექტის თვისებების განახლებას:

ფუნქციის მრიცხველი () (this.sum \u003d 0 this.count \u003d 0) Counter.prototype.add \u003d ფუნქცია (მასივი) (array.forEach (ფუნქცია (ჩანაწერი) (this.sum + \u003d ჩანაწერი ++ this.count), ეს ) // ^ ---- შენიშვნა) const obj \u003d new Counter () obj.add () obj.count // 3 obj.sum // 16

მას შემდეგ, რაც thisArg პარამეტრი (ეს) მოცემულია forEach- სთვის (), იგი გაიცემა ზარის უკუგდებაზე მისი ყოველი გამოძახებისთანავე. ზარის გამოყენება იყენებს მას ამ მნიშვნელობად.

ობიექტის კოპირების ფუნქცია

შემდეგი კოდი ქმნის მოცემული ობიექტის ასლს.

ობიექტის ასლის შექმნის სხვადასხვა გზა არსებობს. ქვემოთ მოცემულია მხოლოდ ერთი გზა და მოცემულია ასახსნელად, თუ როგორ მუშაობს Array.prototype.forEach () ECMAScript 5 ობიექტის გამოყენებით. * Meta თვისების ფუნქციები.

ფუნქციის ასლი (obj) (const ასლი \u003d Object.create (Object.getPrototypeOf (obj)) const propNames \u003d Object.getOwnPropertyNames (obj) propNames.forEach (ფუნქცია (სახელი) (const desc \u003d Object.getOwnPropertyDescriptor (ობიექტი, სახელი) ობიექტი .defineProperty (ასლი, სახელი, დახასიათება))) ასლის დაბრუნება) const obj1 \u003d (a: 1, b: 2) const obj2 \u003d ასლი (obj1) // obj2 ახლა obj1 ჰგავს

თუ მასივი შეიცვალა გამეორების დროს, შეიძლება სხვა ელემენტები გამოტოვონ.

შემდეგი მაგალითი არის ჟურნალები "ერთი", "ორი", "ოთხი".

როდესაც ჩანაწერი შეიცავს მნიშვნელობას "(! LANG: ორი" is reached, the first entry of the whole array is shifted off-resulting in all remaining entries moving up one position. Because element "four" is now at an earlier position in the array, "three" will be skipped.!}

forEach () არ ქმნის მასივის ასლს გამეორებამდე.

მოდით სიტყვები \u003d ["ერთი", "ორი", "სამი", "ოთხი"] სიტყვა. თითოეული (ფუნქცია (სიტყვა) (კონსოლი. ბლოგი (სიტყვა) თუ (სიტყვა \u003d\u003d\u003d "ორი") (სიტყვა. შეცვლა ( )))) // ერთი // ორი // ოთხი

გაასწორეთ მასივი

შემდეგი მაგალითია მხოლოდ სასწავლო მიზნისთვის. თუ გსურთ მასივის გათანაბრება ჩაშენებული მეთოდების გამოყენებით შეგიძლიათ გამოიყენოთ Array.prototype.flat () (რომელიც სავარაუდოდ შედის ES2019– ის ნაწილში, და ის უკვე განხორციელებულია ზოგიერთ ბრაუზერში).

/ ** * სიბრტყეებმა მასივი გაავრცელეს ერთ განზომილებიან მასივში * * @params (მასივი) arr * @returns (მასივი) * / ფუნქცია flatten (arr) (const result \u003d arr.forEach ((i) \u003d\u003e (if (Array) isArray (i)) (result.push (... flatten (i))) else (result.push (i)))) დაბრუნების შედეგი) // გამოყენების const problem \u003d, 8, 9]] flatten (problem) / /

შენიშვნა დაპირებების ან ასინქის ფუნქციების გამოყენების შესახებ

მოდით შეფასებები \u003d მოდით sum \u003d 0 მოდით sumFunction \u003d async ფუნქცია (a, b) (დავაბრუნოთ a + b) რეიტინგები. თითოეული (async ფუნქცია (ნიშანი) (sum \u003d დაველოდოთ sumFunction (თანხა, ნიშანი))) console.log (sum) // მოსალოდნელი გამომავალი: 14 // რეალური შედეგი: 0

სპეციფიკაციები

სპეციფიკაცია	სტატუსი	კომენტარი
ECMAScript უახლესი პროექტი (ECMA-262)	პროექტი
ECMAScript 2015 (მე -6 გამოცემა, ECMA-262) ამ მასალების განმარტება "Array.prototype.forEach".	სტანდარტული
ECMAScript 5.1 (ECMA-262) ამ მასალების განმარტება "Array.prototype.forEach".	სტანდარტული	საწყისი განმარტება დანერგილია JavaScript 1.6 – ში.

ბრაუზერის თავსებადობა

ამ გვერდზე თავსებადობის ცხრილი აგებულია სტრუქტურირებული მონაცემებიდან. თუ გსურთ მონაწილეობა მიიღოთ მონაცემებში, გთხოვთ, გაეცნოთ https://github.com/mdn/browser-compat-data და გამოგვიგზავნეთ მოთხოვნის მოთხოვნა.

განაახლეთ თავსებადობის მონაცემები GitHub- ზე

	სამუშაო მაგიდა						მობილური						სერვერი
	ქრომი	პირას	Firefox	Internet Explorer	ოპერა	Safari	Android ვებგვერდი	Chrome for Android	Firefox Android- ისთვის	ოპერა Android- ისთვის	Safari iOS- ზე	სამსუნგის ინტერნეტი	კვანძი. Js
თითოეული	Chrome სრული მხარდაჭერა 1	Edge სრული მხარდაჭერა 12	Firefox სრული მხარდაჭერა 1.5	IE სრული მხარდაჭერა 9	ოპერა სრული მხარდაჭერა დიახ	Safari სრული მხარდაჭერა 3	WebView Android სრული მხარდაჭერა ≤37	Chrome Android სრული მხარდაჭერა 18	Firefox Android სრული მხარდაჭერა 4	Opera Android სრული მხარდაჭერა დიახ	Safari iOS სრული მხარდაჭერა 1	Samsung ინტერნეტ Android სრული მხარდაჭერა 1.0	nodejs სრული მხარდაჭერა დიახ

სტატია, რომელშიც ჩვენ განვიხილავთ მაგალითებს jQuery თითოეული ფუნქციისა და მეთოდის გამოყენებით.

JQuery ბიბლიოთეკას აქვს 2 სხვადასხვა ობიექტი, სახელად თითოეული.

პირველი (jQuery.each) არის ზოგადი jQuery ფუნქცია, რომლის საშუალებითაც შესაძლებელია მასივის ან ობიექტის ელემენტების განმეორება.

მეორე (თითოეული) არის მეთოდი, რომელიც გამოიყენება ერთეულების ნაკრებზე, რათა მოხდეს მათი გადახვევა.

თითოეული მარყუჟი (jQuery.each). გამოყენების მაგალითები

სინტაქსი თითოეული ფუნქციისთვის არის:

// მასივი ან ობიექტი - მასივი ან ობიექტი, რომლის ელემენტები ან თვისებები უნდა განმეორდეს // გამოხმაურება - ფუნქცია, რომელიც შესრულდება მასივის ან ობიექტის თვისების $ .each (მასივი ან ობიექტი, ზარის პასუხი) თითოეული ელემენტისთვის;

მოდით გადავხედოთ მაგალითებს თითოეულ ფუნქციაზე მუშაობისთვის.

მაგალითი # 1. მასში განმეორდება მასივის ყველა ელემენტი.

// 3 ხაზის მასივი var arr \u003d ["მანქანა", "სატვირთო", "ავტობუსი"]; // განმეორება მასივზე arr $. თითოეული (arr, ფუნქცია (ინდექსი, მნიშვნელობა) (// მოქმედებები, რომლებიც შესრულდება მასივის თითოეული ელემენტისთვის // ინდექსი არის მასივის ელემენტის მიმდინარე ინდექსი (რიცხვი) // მნიშვნელობა არის მიმდინარე მასივის ელემენტის მნიშვნელობა // მასივის ინდექსისა და მნიშვნელობის დაბეჭდვა console console.log ("ინდექსი:" + ინდექსი + "; მნიშვნელობა:" + მნიშვნელობა);)); / * შედეგი (კონსოლში): ინდექსი: 0; მნიშვნელობა: მანქანის ინდექსი: 1; მნიშვნელობა: სატვირთო ავტომობილის ინდექსი: 2; მნიშვნელობა: ავტობუსი * /

ზემოთ მოცემულ კოდში თითოეული ფუნქცია გამოიყენება მასივის განმეორების მიზნით. ფუნქციას აქვს 2 საჭირო პარამეტრი... პირველი პარამეტრი არის ერთეული (მასივი ან ობიექტი), რომლის ელემენტები (თვისებები) უნდა განმეორდეს. ამ შემთხვევაში, ეს არის arr მასივი. მეორე პარამეტრი არის ზარის დაბრუნების ფუნქცია, რომელიც შესრულდება მასივის თითოეული ელემენტისთვის (ამ შემთხვევაში). მას აქვს 2 პარამეტრი, რომლებიც მის შიგნით არის ხელმისაწვდომი შესაბამისი ცვლადების საშუალებით. პირველი პარამეტრი არის ელემენტის რიგითი ნომერი (დათვლა იწყება 0-დან). მეორე პარამეტრი არის მიმდინარე მასივის ელემენტის მნიშვნელობა.

მაგალითი # 2. ამ მაგალითში განმეორდება ობიექტის ყველა თვისება.

// სმარტფონის ობიექტი 5 თვისებით var smartphone \u003d ("სახელი": "LG G5 se", "წელი": "2016", "ეკრანის ზომა": "5.3", "ეკრანის გარჩევადობა": "2560 x 1440 "," os ":" Android 6.0 (Marshmallow) "); // გამეორება სმარტფონის ობიექტზე $. თითოეული (სმარტფონი, ფუნქცია (გასაღები, მნიშვნელობა)) და მისი მნიშვნელობა console console.log ("თვისება:" + გასაღები + "; მნიშვნელობა:" + მნიშვნელობა);)); / * შედეგი (კონსოლში): თვისება: სახელი; ღირებულება: LG G5 se ქონება: წელი; მნიშვნელობა: 2016 წლის თვისება: ეკრანის ზომა; მნიშვნელობა: 5.3 თვისება: ეკრანის გარჩევადობა; მნიშვნელობა: 2560 x 1440 ქონება: os; მნიშვნელობა: Android 6.0 (Marshmallow) * /

თითოეული ფუნქციის გამოყენება შესაძლებელია JavaScript ობიექტებზე განმეორების მიზნით. მისი გამოყენების განსხვავება მხოლოდ იმაშია, რომ ზარის უკუკავშირის ფუნქციის პარამეტრებს აქვთ სხვადასხვა მნიშვნელობები. პირველი პარამეტრი ინახავს ობიექტის თვისების სახელს, ხოლო მეორე ინახავს ამ თვისების მნიშვნელობას.

მაგალითი No3. მასში ვიმეორებთ უფრო რთულ სტრუქტურას (ვნახოთ, როგორ გამოვიყენოთ თითოეული ჩასმული).

// ობიექტი, რომელიც შედგება 2 თვისებისაგან. ამ ობიექტის თითოეულ თვისებას აქვს მასივი, როგორც მნიშვნელობა, რომლის ელემენტებია აგრეთვე ობიექტები var სტატიები \u003d ("Bootstrap": [("id": "1", "title": "შესავალი"), ("id": "2") , "სათაური": "როგორ დავაყენოთ"), ("id": "3", "title": "Grid")], "JavaScript": [("id": "4", "title": "საფუძვლები "), (" id ":" 5 "," title ":" ელემენტების შერჩევა ")]); $ .each (სტატიები, ფუნქცია (გასაღები, მონაცემები) (console.log ("განყოფილება:" + გასაღები); $ .each (მონაცემები, ფუნქცია (ინდექსი, მნიშვნელობა)) (console.log ("სტატია: id \u003d" + მნიშვნელობა ["id"] + "; სათაური \u003d" + მნიშვნელობა ["სათაური"]);));)); / * შედეგი: განყოფილება: ჩატვირთვის სტატია: id \u003d 1; სათაური \u003d შესავალი სტატია: id \u003d 2; სათაური \u003d როგორ დავაყენოთ სტატია: id \u003d 3; სათაური \u003d ქსელის განყოფილება: JavaScript სტატია: id \u003d 4; სათაური \u003d საფუძვლები სტატია: id \u003d 5; სახელი \u003d ელემენტების შერჩევა * /

როგორ შევაჩერო თითოეული (გამოვა მარყუჟიდან)?

თითოეული ციკლი წყდება დაბრუნების დებულებით, რომელიც უნდა დაბრუნდეს false.

მაგალითად, მოდით შევაჩეროთ თითოეული მარყუჟის შესრულება მას შემდეგ, რაც მასივის მასივში ვიპოვით რიცხვს 7:

// 5 რიცხვის მასივი var arr \u003d; // რიცხვი, რომ იპოვოთ var find \u003d 7; // გამეორება მასივის მასივზე $ .each (arr, ფუნქცია (ინდექსი, მნიშვნელობა) (// თუ საჭირო რიცხვია ნაპოვნი, მაშინ .. თუ (მნიშვნელობა \u003d\u003d\u003d იპოვნე) (// დაბეჭდე იგი კონსოლის კონსოლზე. log ("Hurray!)) ნაპოვნია რიცხვი "+ პოვნა +"! ამ ნომერს აქვს ინდექსი: "+ ინდექსი); // შეაჩერე ციკლის შესრულების შეცდომა;) სხვაგან (// სხვაგვარად, ამობეჭდე მიმდინარე ნომერი კონსოლის კონსოლზე. Log (" მიმდინარე ნომერი: "+ მნიშვნელობა); ))); / * შედეგი (კონსოლში): ამჟამინდელი ნომერი: 5 მიმდინარე ნომერი: 4 ურა! ნომერი 7 ნაპოვნია! ამ რიცხვს აქვს ინდექსი: 2 * /

როგორ გადავიდე შემდეგ გამეორებაზე (თითოეული გაგრძელება)?

თითოეულში მიმდინარე განმეორების შესრულება წყდება და შემდეგზე გადასვლა ხორციელდება დაბრუნების დებულების გამოყენებით, რომელსაც ყალბი გარდა სხვა მნიშვნელობა უნდა ჰქონდეს.

// რიცხვების მასივი var arr \u003d; // მასივი, რომელიც უნდა შეიცავდეს მასივის მასივის ყველა ელემენტს, გარდა ლუწი რიცხვებისა var newarr \u003d; // განმეორება arr მასივზე $ .each (arr, ფუნქცია (ინდექსი, მნიშვნელობა) (// თუ ელემენტი თანაბარია, გამოტოვეთ it if (მნიშვნელობა% 2 \u003d\u003d\u003d 0) (// შეაწყვეტინეთ მიმდინარე გამეორება და გადადით შემდეგზე დაბრუნებაზე) ) // მასივს დაამატეთ მნიშვნელობა newarr newarr.push (მნიშვნელობა);)); console.log ("ორიგინალი მასივი (arr):" + arr. Join ()); console.log ("შედეგების მასივი (newarr):" + newarr. Join ()); / * შედეგი (კონსოლში): ორიგინალი მასივი (arr): 3,5,4,9,17,19,30,35,40 შედეგების მასივი (newarr): 3,5,9,17,19,35 * /

მიმდინარე ნივთების განმეორება (. თითოეული)

სინტაქსი თითოეული მეთოდისთვის (ვრცელდება მხოლოდ შერჩეულ ელემენტებზე):

. თითოეული (ფუნქცია); // ფუნქცია - ფუნქცია, რომელიც შესრულდება მიმდინარე ობიექტის თითოეული ელემენტისთვის

მოდით ვნახოთ, როგორ მუშაობს თითოეული მეთოდი შემდეგ მაგალითზე (გამრავლება div ელემენტებზე):

ზემოთ მოყვანილ მაგალითში თითოეული მეთოდი იყენებს მიმდინარე კომპლექტს ($ ("div") ამორჩევით არჩეული ელემენტები). თითოეული მეთოდის დამმუშავებელი ყოველთვის არის ფუნქცია, რომელიც შესრულდება მიმდინარე სიმრავლის თითოეული ელემენტისთვის (ამ შემთხვევაში, თითოეული div ელემენტისთვის). ამ ფუნქციას აქვს 2 არასავალდებულო პარამეტრი. ერთი მათგანი (ინდექსი) არის ამჟამინდელი გამეორების მიმდევრობის ნომერი, ხოლო მეორე (ელემენტი) არის DOM მითითება მიმდინარე ელემენტზე. გარდა ამისა, ეს საკვანძო სიტყვა ხელმისაწვდომია ფუნქციის შიგნით, რომელიც, ისევე როგორც მეორე პარამეტრი, შეიცავს DOM მითითებას მიმდინარე ელემენტზე.

მაგალითად, მოდით ამობეჭდოთ კონსოლზე href ატრიბუტის მნიშვნელობა გვერდზე არსებული ყველა ელემენტისთვის:

$ ("ა"). თითოეული (ფუნქცია () (console.log ($ (ეს) .attr ("href"));));

$ ("a"). თითოეული (ფუნქცია () (var link \u003d $ (this) .attr ("href"); if ((link.indexOf ("http: //") \u003d\u003d 0) || (ბმული .indexOf ("https: //") \u003d\u003d 0)) (console.log ("ბმული href \u003d" + ბმული);))); // თუ გვერდი შეიცავს შემდეგ ბმულებს: // Yandex // როგორ მუშაობს JavaScript? // Bootstrap // შემდეგ კონსოლში ვნახავთ შემდეგ შედეგს: // https://www.yandex.ru/ // http://getbootstrap.com/

მაგალითად, მოდით გავეცნოთ, თუ როგორ უნდა განვალაგოთ თითოეული DOM ელემენტი, რომელსაც კლასის სახელი აქვს (მოდით გადავხედოთ იმავე კლასის ყველა ელემენტს).

მაგალითად, მოდით გაერკვნენ, თუ როგორ უნდა განმეორდეს გვერდზე არსებული ყველა ელემენტი.

მაგალითად, მოდით დავბეჭდოთ ყველა შეყვანის ელემენტის მნიშვნელობა გვერდზე.

$ ("შეყვანა"). თითოეული (ფუნქცია () (console.log ($ (ეს) .val ());));

მაგალითად, მოდით განმეორდეს ყველა ბავშვზე, რომლებიც მდებარეობს ul- ში, id \u003d "myList" - ით (თითოეული ბავშვი).

• Html
• JavaScript

მოდით ვნახოთ jQuery– ს თითოეული მეთოდის ბოლო ინდექსის (ელემენტის) განსაზღვრის მეთოდი.

// აირჩიეთ ელემენტები var myList \u003d $ ("ულ ლი"); // ელემენტების რაოდენობის განსაზღვრა var total \u003d myList.length; // გამეორება არჩეულ ელემენტებზე myList.each (ფუნქცია (ინდექსი) (თუ (ინდექსი \u003d\u003d\u003d ჯამური - 1) (// ეს არის ბოლო ელემენტი შერჩევაში));

ბოლო განახლება: 26.03.2018

Array ობიექტი წარმოადგენს მასივს და გვთავაზობს მთელ რიგ თვისებებსა და მეთოდებს, რომელთა საშუალებითაც შეგვიძლია მასიპულირება.

მასივის ინიციალიზაცია

შეგიძლიათ შექმნათ ცარიელი მასივი კვადრატული ფრჩხილების ან მასივის კონსტრუქტორის გამოყენებით:

ვარი მომხმარებლები \u003d new Array (); ვარი ხალხი \u003d; console.log (მომხმარებლები); // მასივის კონსოლი. ბლოგი (ხალხი); // მასივი

მასივის დაუყოვნებლივ დაწყება შეგიძლიათ მთელი რიგი ელემენტებით:

Var მომხმარებლები \u003d ახალი მასივი ("Tom", "Bill", "Alice"); var ხალხი \u003d ["სემი", "ჯონი", "კეიტი"]; console.log (მომხმარებლები); // ["ტომ", "ბილი", "ალისა"] console.log (ხალხი); // ["სემი", "ჯონი", "კეიტი"]

თქვენ შეგიძლიათ განსაზღვროთ მასივი და განსაზღვროთ მასში ახალი ელემენტები:

ვარი მომხმარებლები \u003d new Array (); მომხმარებლები \u003d "ტომ"; მომხმარებლები \u003d "ქეთი"; console.log (მომხმარებლები); // "Tom" console.log (მომხმარებლები); // განუსაზღვრელი

არ აქვს მნიშვნელობა, რომ სტანდარტულად მასივი იქმნება ნულოვანი სიგრძით. ინდექსების დახმარებით, მასივის კონკრეტული ინდექსის ჩანაცვლება შეგვიძლია ერთი ან მეორე.

სიგრძე

მასივის სიგრძის გასარკვევად გამოიყენეთ სიგრძის თვისება:

Var ხილი \u003d ახალი მასივი (); ხილი \u003d "ვაშლი"; ხილი \u003d "მსხალი"; ხილი \u003d "ქლიავი"; დოკუმენტი. დაწერეთ (ელემენტის "მასივში" + ხილი. სიგრძე + "):
"); for (var i \u003d 0; i< fruit.length; i++) document.write(fruit[i] + "
");

სინამდვილეში, მასივის სიგრძე იქნება ბოლო ელემენტის ინდექსი, პლუს ერთი. Მაგალითად:

ვარი მომხმარებლები \u003d new Array (); // მასივის მომხმარებლებში არის 0 ელემენტი \u003d "Tom"; მომხმარებლები \u003d "ქეთი"; მომხმარებლები \u003d "სემი"; ამისთვის (var i \u003d 0; i

ბრაუზერის გამომავალი:

ტომ ქეითს განუსაზღვრავს განუსაზღვრელი სემი

მიუხედავად იმისა, რომ მე –2 და მე –3 ინდექსებისთვის ელემენტები არ დავამატეთ, მაგრამ მასივის სიგრძე ამ შემთხვევაში იქნება რიცხვი 5. უბრალოდ, 2 და 3 ინდექსების ელემენტებს განუსაზღვრელი მნიშვნელობა ექნებათ.

მასივის კოპირება. ნაჭერი ()

მასივის კოპირება შეიძლება იყოს არაღრმა ან ღრმა კოპირება.

არაღრმა კოპირებით, საკმარისია ცვლადის მნიშვნელობა მივანიჭოთ სხვა ცვლადს, რომელიც მასივს ინახავს:

Var მომხმარებლები \u003d ["ტომ", "სემი", "ბილი"]; console.log (მომხმარებლები); // ["ტომ", "სემი", "ბილი"] var ხალხი \u003d მომხმარებლები; // არაღრმა კოპირება ადამიანი \u003d "მაიკი"; // მეორე ელემენტის კონსოლის შეცვლა. log (მომხმარებლები); // ["ტომ", "მაიკი", "ბილი"]

ამ შემთხვევაში, ხალხის ცვლადი კოპირების შემდეგ მიუთითებს იმავე მასივზე, როგორც მომხმარებლების ცვლადი. ამიტომ, როდესაც ადამიანებში ელემენტები იცვლება, მომხმარებლებში ელემენტებიც იცვლება, რადგან სინამდვილეში ეს იგივე მასია.

ეს ქცევა ყოველთვის არ არის სასურველი. მაგალითად, ჩვენ გვინდა, რომ ცვლადებმა მიუთითონ მასივების გამიჯვნა კოპირების შემდეგ. ამ შემთხვევაში, ღრმა კოპირება შეიძლება გამოყენებულ იქნას ნაჭერი () მეთოდით:

Var მომხმარებლები \u003d ["ტომ", "სემი", "ბილი"]; console.log (მომხმარებლები); // ["ტომ", "სემი", "ბილი"] var people \u003d users.slice (); // deep copy ადამიანი \u003d "მაიკი"; // მეორე ელემენტის კონსოლის შეცვლა. log (მომხმარებლები); // ["ტომ", "სემი", "ბილი"] console.log (ხალხი); // ["ტომ", "მაიკი", "ბილი"]

ამ შემთხვევაში, კოპირების შემდეგ, ცვლადები მიუთითებს სხვადასხვა მასივებზე და მათი შეცვლა შეგვიძლია ერთმანეთისგან.

Slice () მეთოდი ასევე საშუალებას გაძლევთ დააკოპიროთ მასივის ნაწილი:

Var მომხმარებლები \u003d ["ტომ", "სემი", "ბილი", "ალისა", "კეიტი"]; var ხალხი \u003d მომხმარებლები. ნაჭერი (1, 4); console.log (ხალხი); // ["სემი", "ბილი", "ალისა"]

ნაჭრის () მეთოდს გადაეცემა დაწყების და დასრულების ინდექსები, რომლებიც გამოიყენება მასივიდან მნიშვნელობების მისაღებად. ანუ, ამ შემთხვევაში, ახალი მასივის შერჩევა ხდება ინდექსი 1-დან ინდექს 4-მდე, მათ შორის არ არის. მას შემდეგ, რაც მასივის ინდექსაცია იწყება ნულიდან, მეორე, მესამე და მეოთხე ელემენტები გამოჩნდება ახალ მასივში.

ბიძგი ()

ბიძგების () მეთოდი მასივის ბოლოს ელემენტს ამატებს:

ვარ ნაყოფი \u003d; ხილი. ბიძგი ("ვაშლი"); ხილი. ბიძგი ("მსხალი"); ხილი. ბიძგი ("ქლიავი"); ხილი. ბიძგი ("ალუბალი", "გარგარი"
"); დოკუმენტი. დაწერე (ხილი); // ვაშლი, მსხალი, ქლიავი, ალუბალი, გარგარი

პოპი ()

Pop () მეთოდი მასივიდან შლის ბოლო ელემენტს:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი"]; var lastFruit \u003d fruit.pop (); // მასალის დოკუმენტიდან ბოლო ელემენტის მიღება. დაწერე (lastFruit + "
"); document.write (ელემენტის" მასივის ნაყოფში "+ ხილი. სიგრძე +"):
"); for (var i \u003d 0; i ");

ბრაუზერის გამომავალი:

ქლიავი ხილის მასივში არის 2 ელემენტი: ვაშლი, მსხალი

ცვლა ()

Shift () მეთოდი მასივიდან ამოიღებს და შლის პირველ ელემენტს:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი"]; var firstFruit \u003d fruit.shift (); document.write (firstFruit + "
"); document.write (ელემენტის" მასივის ნაყოფში "+ ხილი. სიგრძე +"):
"); for (var i \u003d 0; i ");

ბრაუზერის გამომავალი:

ვაშლი ხილის მასივში არის 2 ელემენტი: მსხლის ქლიავი

unshift ()

Unshift () მეთოდი მასალის დასაწყისს ახალ ელემენტს უმატებს:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი"]; ხილი. გადაადგილება ("გარგარი"); დოკუმენტი. დაწერე (ხილი);

ბრაუზერის გამომავალი:

გარგარი, ვაშლი, მსხალი, ქლიავი

ელემენტის ამოღება ინდექსის მიხედვით. მინა ()

Splice () მეთოდი ხსნის ელემენტებს კონკრეტული ინდექსიდან. მაგალითად, მესამე ინდექსში საგნების ამოღება:

Var მომხმარებლები \u003d ["Tom", "Sam", "Bill", "Alice", "Kate"]; var წაშლილია \u003d მომხმარებლები. splice (3); console.log (წაშლილია); // ["Alice", "Kate"] console.log (მომხმარებლები); // ["ტომ", "სემი", "ბილი"]

ნაჭრის მეთოდი აბრუნებს ამოღებულ ელემენტებს.

ამ შემთხვევაში, წაშლა იწყება მასივის დასაწყისიდან. თუ უარყოფით ინდექსს გაივლით, მაშინ წაშლა განხორციელდება მასივის ბოლოდან. მაგალითად, მოდით ამოვიღოთ ბოლო ელემენტი:

Var მომხმარებლები \u003d ["ტომ", "სემი", "ბილი", "ალისა", "კეიტი"]; var წაშლილია \u003d მომხმარებლები. splice (-1); console.log (წაშლილია); // ["ქეთი"] console.log (მომხმარებლები); // ["ტომ", "სემი", "ბილი", "ალისა"]

მეთოდის დამატებითი ვერსია საშუალებას გაძლევთ მიუთითოთ დასასრული ინდექსის წაშლა. მაგალითად, მოდით ამოვიღოთ პირველიდან მესამე ინდექსში:

Var მომხმარებლები \u003d ["Tom", "Sam", "Bill", "Alice", "Kate"]; var წაშლილია \u003d მომხმარებლები. splice (1,3); console.log (წაშლილია); // ["სემი", "ბილი", "ალისა"] console.log (მომხმარებლები); // ["ტომ", "კეიტი"]

Splice მეთოდის კიდევ ერთი ვერსია საშუალებას გაძლევთ ჩადოთ ახალი ელემენტები წაშლილი ელემენტების ნაცვლად:

Var მომხმარებლები \u003d ["ტომ", "სემი", "ბილი", "ალისა", "კეიტი"]; var deleted \u003d users.splice (1,3, "Ann", "Bob"); console.log (წაშლილია); // ["სემი", "ბილი", "ალისა"] console.log (მომხმარებლები); // ["ტომ", "ენ", "ბობ", "კეიტი"]

ამ შემთხვევაში, ჩვენ წაშალეთ სამი ელემენტი 1-დან მე -3 ინდექსებიდან და ჩავსვით ორი ელემენტი.

concat ()

Concat () მეთოდი გამოიყენება მასივების დასაკავშირებლად:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი"]; var ბოსტნეული \u003d ["პომიდორი", "კიტრი", "კარტოფილი"]; var products \u003d ხილი .concat (ბოსტნეული); ამისთვის (var i \u003d 0; i< products.length; i++) document.write(products[i] + "
");

ამ შემთხვევაში, არ არის საჭირო მხოლოდ იმავე ტიპის მასივების შერწყმა. შესაძლებელია სხვადასხვა ტიპის:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი"]; var ფასები \u003d; var products \u003d ხილი .concat (ფასები);

შეერთება ()

Join () მეთოდი მასივის ყველა ელემენტს აერთიანებს ერთ სტრიქონში:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი", "გარგარი", "ატამი"]; var fruitString \u003d ხილი. შეუერთდეს (","); დოკუმენტი.write (fruitString);

Join () მეთოდს გადასცემს მასივის ელემენტებს შორის გამყოფს. ამ შემთხვევაში გამყოფი და სივრცე (",") გამოყენებული იქნება გამყოფი.

დალაგება ()

დალაგების () მეთოდი ალაგებს მასივს ზრდადი თანმიმდევრობით:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი", "გარგარი", "ატამი"]; ხილი. დალაგება (); ამისთვის (var i \u003d 0; i< fruit.length; i++) document.write(fruit[i] + "
");

ბრაუზერის გამომავალი:

გარგარი მსხალი ატამი ქლიავი ვაშლი

უკუ ()

საპირისპირო () მეთოდი უკუაგდებს მასივს უკან:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი", "გარგარი", "ატამი"]; ხილი. უკუ (); ამისთვის (var i \u003d 0; i< fruit.length; i++) document.write(fruit[i] + "
");

ბრაუზერის გამომავალი:

ატამი გარგარი ქლიავი მსხალი ვაშლი

დალაგების () მეთოდთან ერთად, მასივის დალაგება შეგიძლიათ კლებადობით:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი", "გარგარი", "ატამი"]; ხილი. დალაგება (). უკუ (); ამისთვის (var i \u003d 0; i< fruit.length; i++) document.write(fruit[i] + "
");

ბრაუზერის გამომავალი:

ვაშლი ქლიავი ატამი მსხალი გარგარი

ელემენტის ინდექსის პოვნა

IndexOf () და lastIndexOf () მეთოდები აბრუნებს მასივში პირველი და ბოლო ჩართული ელემენტის ინდექსს. Მაგალითად:

Var ხილი \u003d ["ვაშლი", "მსხალი", "ქლიავი", "ვაშლი", "მსხალი"]; var firstIndex \u003d fruit.indexOf ("ვაშლი"); var lastIndex \u003d fruit.lastIndexOf ("ვაშლი"); var otherIndex \u003d fruit.indexOf ("ალუბალი"); document.write (firstIndex); // 0 document.write (lastIndex); // 3 დოკუმენტი. დაწერე (otherIndex); // -1

firstIndex- ს აქვს 0 მნიშვნელობა, რადგან მასივში "ვაშლის" პირველი ჩართვა მოდის 0 ინდექსზე, ხოლო ბოლო 3-ზე.

თუ ელემენტი არ არის მასივში, მაშინ indexOf () და lastIndexOf () მეთოდები დააბრუნებს -1.

ყველა ()

ყველა () მეთოდი ამოწმებს, აკმაყოფილებს თუ არა ყველა ელემენტი გარკვეულ პირობას:

ვარი რიცხვები \u003d [1, -12, 8, -4, 25, 42]; ფუნქციის მდგომარეობა (მნიშვნელობა, ინდექსი, მასივი) (var შედეგი \u003d false; if (მნიშვნელობა\u003e 0) (result \u003d true;) დაბრუნების შედეგი;); var გავიდა \u003d ციფრები. ყველა (მდგომარეობა); დოკუმენტი. დაწერე (გავიდა); // ყალბი

ყველა () მეთოდს გადაეცემა ფუნქცია, რომელიც წარმოადგენს პირობას, როგორც პარამეტრს. ეს ფუნქცია იღებს სამ პარამეტრს:

ფუნქციის მდგომარეობა (მნიშვნელობა, ინდექსი, მასივი) ()

მნიშვნელობის პარამეტრი წარმოადგენს მასივის ამჟამად განმეორებად ელემენტს, ინდექსი პარამეტრი წარმოადგენს ამ ელემენტის ინდექსს, ხოლო მასივის პარამეტრი გადასცემს მითითებას მასივზე.

ამ ფუნქციაში ჩვენ შეგვიძლია გადავამოწმოთ გატანილი ელემენტის მნიშვნელობა რაიმე პირობის შესაბამისობის შესაბამისად. მაგალითად, ამ მაგალითში მასივის თითოეულ ელემენტს ვამოწმებთ, არის ნულზე მეტი თუ არა. თუ მეტია, მაშინ დააბრუნე ჭეშმარიტი, ანუ ელემენტი აკმაყოფილებს პირობას. თუ ნაკლებია, მაშინ ვუბრუნდებით ცრუ - ელემენტი არ ემთხვევა პირობას.

შედეგად, როდესაც ნომრები. ყოველი (პირობა) მეთოდი იწოდება, ის იმეორებს რიცხვების მასივის ყველა ელემენტს და მათ გადასცემს მდგომარეობის ფუნქციას. თუ ეს ფუნქცია ყველა ელემენტისთვის დაბრუნდება true, მაშინ ყველა () მეთოდი უბრუნდება true- ს. თუ ერთი ელემენტი მაინც არ ემთხვევა პირობას, მაშინ ყოველი () მეთოდი ყალბი იბრუნებს.

ზოგიერთი ()

ზოგიერთი () მეთოდი მსგავსია ყველა () მეთოდისა, გარდა იმისა, რომ იგი ამოწმებს, ემთხვევა თუ არა ერთი ელემენტი მაინც პირობას. ამ შემთხვევაში, ზოგიერთი () მეთოდი ნამდვილდება. თუ მასივში არ არის პირობების შესაბამისი ელემენტები, მაშინ false მნიშვნელობა უბრუნდება:

ვარი რიცხვები \u003d [1, -12, 8, -4, 25, 42]; ფუნქციის მდგომარეობა (მნიშვნელობა, ინდექსი, მასივი) (var შედეგი \u003d false; if (მნიშვნელობა \u003d\u003d\u003d 8) (შედეგი \u003d true;) დაბრუნების შედეგი;); var გავიდა \u003d რიცხვები. ზოგიერთი (მდგომარეობა); // მართალია

ფილტრი ()

ფილტრის () მეთოდი, ისევე როგორც ზოგიერთი () და ყველა (), იღებს პირობით ფუნქციას. მაგრამ ამავე დროს ის უბრუნებს იმ ელემენტების მასივს, რომლებიც აკმაყოფილებენ ამ პირობას:

ვარი რიცხვები \u003d [1, -12, 8, -4, 25, 42]; ფუნქციის მდგომარეობა (მნიშვნელობა, ინდექსი, მასივი) (var შედეგი \u003d false; if (მნიშვნელობა\u003e 0) (result \u003d true;) დაბრუნების შედეგი;); var გაფილტრული რიცხვები \u003d რიცხვები. ფილტრი (მდგომარეობა); ამისთვის (var i \u003d 0; i< filteredNumbers.length; i++) document.write(filteredNumbers[i] + "
");

ბრაუზერის გამომავალი:

1 8 25 42

forEach () და რუკა ()

ForEach () და რუკის () მეთოდები ახდენს ელემენტების გადამეტებასა და მათზე გარკვეულ ოპერაციებს. მაგალითად, შეგიძლიათ გამოიყენოთ შემდეგი კოდი მასივში რიცხვების კვადრატების გამოსათვლელად:

ვარი რიცხვები \u003d [1, 2, 3, 4, 5, 6]; ამისთვის (var i \u003d 0; i "); }

მაგრამ forEach () მეთოდის გამოყენებით შეგიძლიათ გაამარტივოთ ეს კონსტრუქცია:

ვარი რიცხვები \u003d [1, 2, 3, 4, 5, 6]; ფუნქციის კვადრატი (მნიშვნელობა, ინდექსი, მასივი) (var შედეგი \u003d მნიშვნელობა * მნიშვნელობა; document.write ("რიცხვის კვადრატი" + მნიშვნელობა + "არის" + შედეგი + ")
");); ციფრები. თითოეული (კვადრატი);

ForEach () მეთოდი იღებს იგივე ფუნქციას, როგორც პარამეტრს, რომელშიც, ელემენტებზე გამეორებისას, გაივლის ამჟამინდელი iterate ელემენტი და მასზე ხორციელდება ოპერაციები.

რუქა () მეთოდი forEach მეთოდის მსგავსია, ის ასევე იღებს ფუნქციას, როგორც პარამეტრს, რომლის საშუალებითაც შესაძლებელია ოპერაციების შესრულება მასივის ელემენტებზე, მაგრამ რუქა () მეთოდი უბრუნებს ახალ მასივს მასივის ელემენტებზე ოპერაციების შედეგებით.

მაგალითად, მოდით გამოვიყენოთ რუქის მეთოდი მასივის რიცხვების კვადრატების გამოსათვლელად:

ვარი რიცხვები \u003d [1, 2, 3, 4, 5, 6]; ფუნქციის კვადრატი (მნიშვნელობა, ინდექსი, მასივი) (დაბრუნების შედეგი \u003d მნიშვნელობა * მნიშვნელობა;); var squareArray \u003d რიცხვები. რუკა (კვადრატი); დოკუმენტი.write (კვადრატული მასივი);

ფუნქცია, რომელიც გადაეცემა რუქაზე () მეთოდს, იღებს მიმდინარე iterate ელემენტს, ასრულებს მასზე ოპერაციებს და უბრუნებს გარკვეულ მნიშვნელობას. შემდეგ ეს მნიშვნელობა გადადის მიღებულ კვადრატულ მასივში.