JavaScript'te bir dizi aras─▒nda d├Âng├╝


Al─▒nan cevaba git


Java'da for , bir dizideki nesneleri a┼ča─č─▒daki gibi kayd─▒rmak i├žin bir d├Âng├╝ kullanabilirsiniz :

 String[] myStringArray = {"Hello", "World"};
for (String s : myStringArray)
{
    // Do something
}
 

Ayn─▒ ┼čeyi JavaScript'te de yapabilir misiniz?


2904









Cevap say─▒s─▒n─▒ say: 30






Birka├ž se├žene─činiz var:

1. S─▒ral─▒ for d├Âng├╝:

 var myStringArray = ["Hello","World"];
var arrayLength = myStringArray.length;
for (var i = 0; i < arrayLength; i++) {
    console.log(myStringArray[i]);
    //Do something
} 

Art─▒lar─▒

  • Her ortamda ├žal─▒┼č─▒r
  • Kontrol deyimlerini kullanabilir break ve aktarabilirsiniz. continue

Eksileri

  • ├çok ayr─▒nt─▒l─▒
  • Zorunlu
  • Tek bir hataya sahip olmak kolayd─▒r (buna bazen ├žit sonras─▒ hatas─▒ denir )

2. Dizi.prototype.forEach

ES5 spec. bunlardan biri olan ├žok say─▒da yararl─▒ dizi y├Ântemi sundu Array.prototype.forEach ve bize bir dizi ├╝zerinde yineleme yapmam─▒z i├žin ├žok k─▒sa bir yol sunuyor:

 const array = ["one", "two", "three"]
array.forEach(function (item, index) {
  console.log(item, index);
}); 

ES5'in belirtti─či yaz─▒ olarak neredeyse 9 y─▒l. piyasaya s├╝r├╝ld├╝ (Aral─▒k 2009), masa├╝st├╝, sunucu ve mobil ortamlardaki neredeyse t├╝m modern motorlar taraf─▒ndan uyguland─▒, bu y├╝zden onlar─▒ kullanmak g├╝venli.

Ve ES6 ok i┼člevi s├Âzdizimi ile daha da ├Âzl├╝:

 array.forEach(item => console.log(item));
 

├çok eski platformlar─▒ (├Ârn. IE11) desteklemeyi planlam─▒yorsan─▒z, ok i┼člevleri de yayg─▒n ┼čekilde uygulanmaktad─▒r.

Art─▒lar─▒

  • ├çok k─▒sa ve ├Âzl├╝.
  • bildiren

Eksileri

  • Kullanamazs─▒n─▒z break / continue

Normalde, break dizi ├Â─čelerini yinelemeden ├Ânce filtreleyerek zorunlu d├Âng├╝lerden ├ž─▒kma gereksinimini de─či┼čtirebilirsiniz, ├Ârne─čin:

 array.filter(item => item.condition < 10)
     .forEach(item => console.log(item))
 

Ondan ba┼čka bir dizi olu┼čturmak i├žin bir dizi yineliyorsan─▒z , kullanman─▒z gerekir map , bu anti-paterni bir├žok kez g├Ârd├╝m.

Anti-kal─▒b─▒:

 const numbers = [1,2,3,4,5], doubled = [];

numbers.forEach((n, i) => { doubled[i] = n * 2 });
 

Haritan─▒n uygun kullan─▒m durumu :

 const numbers = [1,2,3,4,5];
const doubled = numbers.map(n => n * 2);

console.log(doubled); 

Ayr─▒ca , diziyi bir de─čere d├╝┼č├╝rmeye ├žal─▒┼č─▒yorsan─▒z , ├Ârne─čin, bir say─▒ dizisini toplamak istiyorsan─▒z, d├╝┼č├╝rme y├Ântemini kullanmal─▒s─▒n─▒z .

antipattern:

 const numbers = [1,2,3,4,5];
const sum = 0;
numbers.forEach(num => { total += num });
 

Uygun kullan─▒m─▒ azaltmak :

 const numbers = [1,2,3,4,5];
const sum = numbers.reduce((total, n) => total + n, 0);

console.log(sum); 

3. ES6 for-of beyan─▒

ES6 standard─▒, yinelenebilir nesneler kavram─▒n─▒ tan─▒t─▒r ve travers verileri i├žin yeni bir yap─▒, for...of deyimi tan─▒mlar .

Bu ifade, her t├╝rl├╝ yinelenebilir nesne ve ayr─▒ca ├╝reticiler i├žin i┼če yarar.

Dizi nesneleri tan─▒m gere─či ES6'daki yerle┼čik yinelemelerdir, bu nedenle bu ifadeyi bunlarda kullanabilirsiniz:

 let colors = ['red', 'green', 'blue'];
for (const color of colors){
  console.log(color);
}
 

Art─▒lar─▒

  • ├çok ├že┼čitli nesneler ├╝zerinde yinelenebilir.
  • Normal ak─▒┼č kontrol deyimlerini ( break / continue ) kullanabilir.
  • Seri olarak asenkron de─čerleri tekrarlamak i├žin kullan─▒┼čl─▒d─▒r.

Eksileri

Kullanmay─▒n for...in

@ zipcodeman ifadenin kullan─▒lmas─▒n─▒ ├Ânerir for...in , ancak yinelenen dizilerden for-in ka├ž─▒n─▒lmas─▒ i├žin bu ifadenin nesne ├Âzelliklerini numaraland─▒rmas─▒ ama├žlanm─▒┼čt─▒r .

Dizi benzeri nesneler i├žin kullan─▒lmamal─▒d─▒r, ├ž├╝nk├╝:

  • Yineleme s─▒ras─▒ garanti edilmez, dizi dizinleri say─▒sal s─▒rayla ziyaret edilemeyebilir.
  • Miras al─▒nan ├Âzellikler de numaraland─▒r─▒lm─▒┼čt─▒r.

─░kinci nokta, size ├žok fazla sorun ├ž─▒karabilece─čidir; ├Ârne─čin, Array.prototype nesneyi orada bir y├Ântem i├žerecek ┼čekilde geni┼čletirseniz , bu ├Âzellik de numaraland─▒r─▒l─▒r.

├ľrne─čin:

 Array.prototype.foo = "foo!";
    var array = ['a', 'b', 'c'];
    
    for (var i in array) {
      console.log(array[i]);
    } 

Yukar─▒daki kod "a", "b", "c" ve "foo!"

Bu, ├Âzellikle yerel prototip b├╝y├╝tmeye dayanan bir k├╝t├╝phane kullan─▒yorsan─▒z (├Ârne─čin MooTools gibi) bir problemdir.

Daha for-in ├Ânce s├Âyledi─čim gibi, nesne ├Âzelliklerini numaraland─▒rmak i├žin var, ├Ârne─čin:

 var obj = {
      "a": 1,
      "b": 2,
      "c": 3
    };

    for (var prop in obj) {
      if (obj.hasOwnProperty(prop)) { 
      // or if (Object.prototype.hasOwnProperty.call(obj,prop)) for safety...
        console.log("prop: " + prop + " value: " + obj[prop])
      }
    } 

Yukar─▒daki ├Ârnekte, hasOwnProperty y├Ântem yaln─▒zca kendi ├Âzelliklerini numaraland─▒rman─▒za izin verir , i┼čte bu, yaln─▒zca nesnenin fiziksel olarak sahip oldu─ču ├Âzellikleri, kal─▒tsal olmayan ├Âzellikleri yoktur.

A┼ča─č─▒daki makaleyi okuman─▒z─▒ tavsiye ederim:


3632


2010-06-10





Evet, uygulaman─▒z─▒n ECMAScript 2015'te ("Uyum" s├╝r├╝m├╝) sunulan for ... ... of ├Âzelli─či oldu─čunu ve bu g├╝nlerde olduk├ža g├╝venli bir varsay─▒m oldu─čunu varsayarsak.http://www.ecma-international.org/ecma-262/6.0/

Bu gibi ├žal─▒┼č─▒r:

 // REQUIRES ECMASCRIPT 2015+
var s, myStringArray = ["Hello", "World"];
for (s of myStringArray) {
  // ... do something with s ...
}
 

Ya da daha iyisi, ├ž├╝nk├╝ ECMAScript 2015 ayr─▒ca ┼ču ┼čekilde let ve const :

 // REQUIRES ECMASCRIPT 2015+
const myStringArray = ["Hello", "World"];
for (const s of myStringArray) {
  // ... do something with s ...
}
// s is no longer defined here
 

Seyrek dizilerle ilgili bir not: JavaScript'teki bir dizi asl─▒nda bildirdi─či kadar ├žok ├Â─če depolayamayabilir length ; rapor edilen say─▒, bir de─čerin kaydedildi─či en y├╝ksek endeksten sadece bir tanesidir. Dizi, uzunlu─ču ile belirtilenden daha az eleman i├žeriyorsa, seyrek oldu─ču s├Âylenir . ├ľrne─čin, yaln─▒zca 3, 12 ve 247 dizinlerinde bulunan bir diziye sahip olmak tamamen me┼čru; length sadece asl─▒nda 3 de─čerleri depolamak olsa, b├Âyle bir dizinin, 248 olarak rapor edilir. Ba┼čka bir dizindeki bir ├Â─čeye eri┼čmeye ├žal─▒┼č─▒rsan─▒z, dizi undefined orada de─čere sahip gibi g├Âr├╝necektir . Bu nedenle, bir diziyi "dola┼čmak" istedi─činizde, cevaplamak istedi─činiz bir sorunuz var: undefined eksik olan herhangi bir eleman i├žin uzunlu─ču ve i┼člemi taraf─▒ndan belirtilen t├╝m aral─▒k boyunca dola┼čmak m─▒ istiyorsunuz , yoksa sadece elemanlar─▒ ger├žekten i┼člemek mi istiyorsunuz? mevcut? Her iki yakla┼č─▒m i├žin de bir├žok uygulama var; bu sadece diziyi ne i├žin kulland─▒─č─▒n─▒za ba─čl─▒d─▒r.

Bir diziyi for .. ile tekrarlarsan─▒z of , d├Âng├╝n├╝n g├Âvdesi length defalarca y├╝r├╝t├╝l├╝r ve d├Âng├╝ denetim de─či┼čkeni undefined dizide ger├žekte bulunmayan ├Â─čeler i├žin ayarlan─▒r . ÔÇť┼×ununla bir ┼čeyler yapÔÇŁ kodunun ayr─▒nt─▒lar─▒na ba─čl─▒ olarak, bu davran─▒┼č istedi─činiz ┼čey olabilir, ancak istedi─činiz ┼čey de─čilse, farkl─▒ bir yakla┼č─▒m kullanmal─▒s─▒n─▒z.

Tabii ki, baz─▒ geli┼čtiriciler ├žarem yok ama ├ž├╝nk├╝ onlar hen├╝z desteklemedi─či bir JavaScript s├╝r├╝m├╝n├╝ hedefledi─činiz Sebebi ne olursa olsun, yine de farkl─▒ bir yakla┼č─▒m kullanmak for ... of .

JavaScript uygulaman─▒z ECMAScript belirtiminin ├Ânceki s├╝r├╝m├╝yle uyumlu oldu─ču s├╝rece (├Ârne─čin, 9'dan ├Ânceki Internet Explorer s├╝r├╝mlerini hari├ž tutan), Array#forEach bir d├Âng├╝ yerine yineleyici y├Ântemini kullanabilirsiniz . Bu durumda, dizideki her ├Â─če i├žin ├ža─čr─▒lacak bir i┼člevi iletirsiniz:

 var myStringArray = [ "Hello", "World" ];
myStringArray.forEach( function(s) { 
     // ... do something with s ...
} );
 

Aksine for ... of , .forEach yaln─▒zca ger├žekten de─čerler i├žeren ├Â─čeler i├žin i┼člevini ├ža─č─▒r─▒r. ├ť├ž element ve 248 uzunlu─čunda olan varsay─▒msal dizimizi ge├žersek, sadece 248 kez de─čil, i┼člevi ├╝├ž kez ├ža─č─▒r─▒r. Ayn─▒ zamanda, eksik elemanlar ve ger├žekte ayarlanm─▒┼č elemanlar aras─▒nda ayr─▒m yapar undefined ; ikincisi i├žin, hala undefined arg├╝man olarak ge├žen fonksiyonu ├ža─č─▒r─▒r . Bu seyrek diziler nas─▒l ele almak istedi─činizi ise, .forEach hatta terc├╝man destekliyorsa gitmek i├žin bir yol olabilir for ... of .

JavaScript'in t├╝m s├╝r├╝mlerinde ├žal─▒┼čan son se├ženek, a├ž─▒k bir sayma d├Âng├╝s├╝d├╝r . Sadece uzunluktan 0 ile 1 aras─▒nda bir say─▒ sayman─▒z ve say─▒c─▒y─▒ indeks olarak kullanman─▒z yeterlidir. Temel d├Âng├╝ ┼č├Âyle g├Âr├╝n├╝r:

 var i, s, myStringArray = [ "Hello", "World" ], len = myStringArray.length;
for (i=0; i<len; ++i) {
  s = myStringArray[i];
  // ... do something with s ...
}
 

Bu yakla┼č─▒m─▒n bir avantaj─▒ seyrek dizilerin nas─▒l kullan─▒laca─č─▒n─▒ se├žmektir; Yukar─▒daki kod d├Âng├╝ tam g├Âvdesini ├žal─▒┼čacak length olan kat s etmek seti undefined gibi, eksik elemanlar i├žin for .. of . Bunun yerine, sadece seyrek bir dizinin ger├žekte var olan ├Â─čelerini i┼člemek istiyorsan─▒z , dizine .forEach basit bir in test ekleyebilirsiniz :

 var i, s, myStringArray = [ "Hello", "World" ], len = myStringArray.length;
for (i=0; i<len; ++i) {
  if (i in myStringArray) {
    s = myStringArray[i];
    // ... do something with s ...
  }
}
 

Uzunluk de─čerini yerel de─či┼čkene atamak ( myStringArray.length d├Âng├╝ ifadesinde tam ifadeyi dahil etmek yerine ), her seferinde bir ├Âzellik aramas─▒ atlad─▒─č─▒ndan performansta ├Ânemli bir fark yaratabilir; Makinemde Rhino kullan─▒yorsan─▒z, h─▒zlanma% 43.

Bu ┼čekilde d├Âng├╝ ba┼člatma c├╝mlesinde yap─▒lan ├Ânbellek uzunlu─ču g├Ârebilirsiniz:

 var i, len, myStringArray = [ "Hello", "World" ];
for (len = myStringArray.length, i=0; i<len; ++i) {
 

for ... in ba┼čkalar─▒ taraf─▒ndan bahsedilen s├Âzdizimi bir nesnenin ├Âzellikleri ├╝zerinde d├Âng├╝ i├žindir; JavaScript'teki bir Dizi yaln─▒zca say─▒sal ├Âzellik adlar─▒na (ve otomatik olarak g├╝ncellenen bir length ├Âzelli─če sahip) bir nesne oldu─čundan , teorik olarak bir Dizinin ├╝zerinde bununla birlikte d├Ânebilirsiniz. Ancak sorun, kendisini say─▒sal ├Âzellik de─čerleriyle s─▒n─▒rlamamas─▒d─▒r (y├Ântemlerin asl─▒nda sadece de─čeri kapanm─▒┼č olan ├Âzellikler oldu─čunu unutmay─▒n) ya da say─▒sal s─▒rayla bunlar─▒ yinelemenin de garantisi yoktur. Bu nedenle, for ... in s├Âzdizimi gerekti─čini de─čil Diziler yoluyla aktar─▒lmas─▒ i├žin kullan─▒labilir.


1076







Sen kullanabilirsiniz map da benzeri di─čer dillerde mevcut olan bir fonksiyonel programlama tekni─čidir olan Python ve Haskell .

 [1,2,3,4].map( function(item) {
     alert(item);
})
 

Genel s├Âzdizimi:

 array.map(func)
 

Genelde func dizinin bir maddesi olan bir parametre al─▒r. Ancak JavaScript durumunda, ├Â─čenin dizini olan ikinci bir parametre ve dizinin kendisi olan ├╝├ž├╝nc├╝ bir parametre alabilir.

'In d├Ân├╝┼č de─čeri array.map ba┼čka bir dizidir, bu y├╝zden bunu ┼č├Âyle kullanabilirsiniz:

 var x = [1,2,3,4].map( function(item) {return item * 10;});
 

Ve ┼čimdi x [10,20,30,40] .

Fonksiyonu sat─▒r i├ži yazmak zorunda de─čilsiniz. Ayr─▒ bir i┼člev olabilir.

 var item_processor = function(item) {
      // Do something complicated to an item
}

new_list = my_list.map(item_processor);
 

hangi t├╝r e┼čde─čer olurdu:

  for (item in my_list) {item_processor(item);}
 

Tabii anlamad─▒n new_list .


432







JavaScript'te for-in d├Âng├╝s├╝ne sahip bir Dizi i├žinden d├Âng├╝ yapman─▒z ├Ânerilmez, ancak a┼ča─č─▒daki for gibi bir d├Âng├╝ kullanmak daha iyidir :

 for(var i=0, len=myArray.length; i < len; i++){}
 

Ayn─▒ zamanda optimize edilmi┼čtir (dizi uzunlu─čunu "├Ânbelle─če alma"). Daha fazla bilgi edinmek istiyorsan─▒z konuyla ilgili yaz─▒m─▒ okuyun .


113







i├žin (var s of myStringArray) {

(Do─črudan sorunuzu yan─▒tlayarak: ┼čimdi yapabilirsiniz!)

Di─čer cevaplar─▒n ├žo─ču do─črudur, ancak ECMA Script  6  2015'in yineleme yapmak i├žin yeni bir mekanizma getirdi─činden bahsetmiyorlar (bu yaz─▒dan itibaren) for..of .

Bu yeni s├Âzdizimi, javascript'te bir diziyi yinelemenin en zarif yoludur (yineleme dizinine ihtiya├ž duymad─▒─č─▒n─▒z s├╝rece), ancak taray─▒c─▒lar taraf─▒ndan hen├╝z yayg─▒n olarak desteklenmemektedir.

┼×u anda Firefox 13+, Chrome 37+ ile ├žal─▒┼č─▒yor ve di─čer taray─▒c─▒larla yerel olarak ├žal─▒┼čm─▒yor (a┼ča─č─▒daki taray─▒c─▒ uyumlulu─čuna bak─▒n). Neyse ki , bug├╝n yeni nesil ├Âzellikleri kullanmam─▒za izin veren JS derleyicilerimiz ( Babel gibi ) var.

Ayr─▒ca D├╝─č├╝m ├╝zerinde de ├žal─▒┼č─▒r (0.12.0 s├╝r├╝m├╝nde test ettim).

Bir diziyi yineleme

 // You could also use "let" instead of "var" for block scope.
for (var letter of ["a", "b", "c"]) { 
   console.log(letter); 
}
 

Bir dizi nesneyi yineleme

 var band = [
  {firstName : 'John', lastName: 'Lennon'}, 
  {firstName : 'Paul', lastName: 'McCartney'}
];

for(var member of band){
  console.log(member.firstName + ' ' + member.lastName); 
}
 

Bir jenerat├Âr├╝ yineleme:

(├Ârne─čin elde edilen https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...of )

 function* fibonacci() { // a generator function
  let [prev, curr] = [1, 1];
  while (true) {
    [prev, curr] = [curr, prev + curr];
    yield curr;
  }
}

for (let n of fibonacci()) {
  console.log(n);
  // truncate the sequence at 1000
  if (n >= 1000) {
    break;
  }
}
 

Uyumluluk tablosu: http://kangax.github.io/es5-compat-table/es6/#For..of d├Âng├╝ler

Spec: http://wiki.ecmascript.org/doku.php?id=harmony:iterators

}


106







Opera, Safari, Firefox ve Chrome art─▒k ├žo─ču yayg─▒n d├Âng├╝y├╝ optimize etmek i├žin bir dizi Array y├Ântemini payla┼č─▒yor.

Hepsine ihtiyac─▒n─▒z olmayabilir, ancak ├žok faydal─▒ olabilirler veya her taray─▒c─▒ destekliyorsa olur.

Mozilla Labs kulland─▒klar─▒ algoritmalar─▒ ve WebKit'in her ikisini de kulland─▒, b├Âylece kendiniz ekleyebilirsiniz.

filtre , bir ko┼čulu veya testi sa─člayan bir dizi ├Â─če d├Ând├╝r├╝r.

Her dizi ├╝yesi testi ge├žerse her biri do─čru d├Âner.

Baz─▒lar─▒ testi ge├žerse do─čru olur.

forEach , her dizi ├╝yesinde bir i┼člev ├žal─▒┼čt─▒r─▒r ve hi├žbir ┼čey d├Ând├╝rmez.

map forEach gibidir, ancak her eleman i├žin i┼člemin sonu├ž dizisini d├Ând├╝r├╝r.

Bu y├Ântemlerin t├╝m├╝ ilk arg├╝man─▒ i├žin bir i┼člev al─▒r ve iste─če ba─čl─▒ bir ikinci arg├╝mana sahiptir; bu i┼člev, i┼člev i├žinde d├Âng├╝ yaparken kapsam─▒ dizi ├╝yelerine uygulamak istedi─činiz bir nesnedir.

─░htiyac─▒n─▒z olana kadar g├Ârmezden gelin.

indexOf ve lastIndexOf , arg├╝man─▒yla tam olarak e┼čle┼čen ilk veya son ├Â─čenin uygun konumunu bulur.

 (function(){
    var p, ap= Array.prototype, p2={
        filter: function(fun, scope){
            var L= this.length, A= [], i= 0, val;
            if(typeof fun== 'function'){
                while(i< L){
                    if(i in this){
                        val= this[i];
                        if(fun.call(scope, val, i, this)){
                            A[A.length]= val;
                        }
                    }
                    ++i;
                }
            }
            return A;
        },
        every: function(fun, scope){
            var L= this.length, i= 0;
            if(typeof fun== 'function'){
                while(i<L){
                    if(i in this && !fun.call(scope, this[i], i, this))
                        return false;
                    ++i;
                }
                return true;
            }
            return null;
        },
        forEach: function(fun, scope){
            var L= this.length, i= 0;
            if(typeof fun== 'function'){
                while(i< L){
                    if(i in this){
                        fun.call(scope, this[i], i, this);
                    }
                    ++i;
                }
            }
            return this;
        },
        indexOf: function(what, i){
            i= i || 0;
            var L= this.length;
            while(i< L){
                if(this[i]=== what)
                    return i;
                ++i;
            }
            return -1;
        },
        lastIndexOf: function(what, i){
            var L= this.length;
            i= i || L-1;
            if(isNaN(i) || i>= L)
                i= L-1;
            else
                if(i< 0) i += L;
            while(i> -1){
                if(this[i]=== what)
                    return i;
                --i;
            }
            return -1;
        },
        map: function(fun, scope){
            var L= this.length, A= Array(this.length), i= 0, val;
            if(typeof fun== 'function'){
                while(i< L){
                    if(i in this){
                        A[i]= fun.call(scope, this[i], i, this);
                    }
                    ++i;
                }
                return A;
            }
        },
        some: function(fun, scope){
            var i= 0, L= this.length;
            if(typeof fun== 'function'){
                while(i<L){
                    if(i in this && fun.call(scope, this[i], i, this))
                        return true;
                    ++i;
                }
                return false;
            }
        }
    }
    for(p in p2){
        if(!ap[p])
            ap[p]= p2[p];
    }
    return true;
})();
 

87







While d├Âng├╝s├╝n├╝ kullan─▒n ...

 var i=0, item, items = ['one','two','three'];
while(item = items[i++]){
    console.log(item);
}
 

g├╝nl├╝kleri: 'bir', 'iki', '├╝├ž'

Ve ters sipari┼č i├žin, daha verimli bir d├Âng├╝

 var items = ['one','two','three'], i = items.length;
while(i--){
    console.log(items[i]);
}
 

g├╝nl├╝kleri: '├╝├ž', 'iki', 'bir'

Veya klasik for d├Âng├╝

 var items = ['one','two','three']
for(var i=0, l = items.length; i < l; i++){
    console.log(items[i]);
}
 

g├╝nl├╝kleri: 'bir', 'iki', '├╝├ž'

Referans: http://www.sitepoint.com/google-closure-how-not-to-write-javascript/


63







giri┼č

├ťniversitedeki zaman─▒mdan beri Java, JavaScript, Pascal, ABAP , PHP, Progress 4GL, C / C ++ ve muhtemelen ┼ču anda d├╝┼č├╝nemedi─čim birka├ž dilde programlam─▒┼čt─▒m.

Hepsinin kendi dilbilimsel deyimleri olsa da, bu dillerin her biri ayn─▒ temel kavramlar─▒ payla┼č─▒yor. Bu kavramlar aras─▒nda prosed├╝rler / fonksiyonlar, IF -statements, FOR -loops ve WHILE -loops bulunur.


Geleneksel bir for d├Âng├╝

Geleneksel bir for d├Âng├╝n├╝n ├╝├ž bile┼čeni vard─▒r:

  1. ─░lklendirme: g├Âr├╝n├╝m blo─ču ilk kez ├žal─▒┼čt─▒r─▒ld─▒─č─▒nda ├žal─▒┼čt─▒r─▒l─▒r
  2. Condition: loop blo─ču ├žal─▒┼čt─▒r─▒lmadan ├Ânce her defas─▒nda bir ko┼čulu kontrol eder ve e─čer yanl─▒┼č ise loop'dan ├ž─▒kar.
  3. Sonras─▒: d├Âng├╝ blo─ču ├žal─▒┼čt─▒r─▒ld─▒ktan sonra her zaman ger├žekle┼čtirilir

Bu ├╝├ž bile┼čen birbirinden bir ; sembol ile ayr─▒l─▒r . Bu ├╝├ž bile┼čenin her biri i├žin i├žerik iste─če ba─čl─▒d─▒r; bu, a┼ča─č─▒dakilerin m├╝mk├╝n olan en d├╝┼č├╝k for d├Âng├╝ oldu─ču anlam─▒na gelir :

 for (;;) {
    // Do stuff
}
 

Tabii ki, ├žal─▒┼čmay─▒ durdurabilmek i├žin o-loop'un i├žine if(condition === true) { break; } ya da if(condition === true) { return; } ba┼čka bir yere eklemeniz gerekecek for .

Genellikle, ba┼člang─▒├ž ÔÇőÔÇőde─čeri bir endeksi bildirmek i├žin kullan─▒l─▒r, ┼čart, o endeksi minimum veya maksimum bir de─čerle kar┼č─▒la┼čt─▒rmak i├žin kullan─▒l─▒r ve sonradan indeksi art─▒rmak i├žin kullan─▒l─▒r:

 for (var i = 0, length = 10; i < length; i++) {
    console.log(i);
}
 

for Dizi i├žinde dola┼čmak i├žin geleneksel bir d├Âng├╝ kullanma

Bir dizi i├žinde dola┼čman─▒n geleneksel yolu ┼čudur:

 for (var i = 0, length = myArray.length; i < length; i++) {
    console.log(myArray[i]);
}
 

Veya geriye do─čru d├Ânmeyi tercih ederseniz, bunu yap─▒n:

 for (var i = myArray.length - 1; i > -1; i--) {
    console.log(myArray[i]);
}
 

Bununla birlikte, ├Ârne─čin, bunun gibi bir├žok varyasyon m├╝mk├╝nd├╝r:

 for (var key = 0, value = myArray[key], length = myArray.length; key < length; value = myArray[++key]) {
    console.log(value);
}
 

... ya da bu ...

 var i = 0, length = myArray.length;
for (; i < length;) {
    console.log(myArray[i]);
    i++;
}
 

... ya da bu:

 var key = 0, value;
for (; value = myArray[key++];){
    console.log(value);
}
 

Hangisi en iyi sonu├ž verirse, b├╝y├╝k ├Âl├ž├╝de hem ki┼čisel zevkler hem de uygulad─▒─č─▒n─▒z spesifik kullan─▒m durumlar─▒ndan ibarettir.

Bu varyasyonlar─▒n her birinin ├žok eskiler de dahil olmak ├╝zere t├╝m taray─▒c─▒lar taraf─▒ndan desteklendi─čini unutmay─▒n!


Bir while d├Âng├╝

Bir for d├Âng├╝n├╝n alternatifi bir while d├Âng├╝d├╝r. Bir dizi aras─▒nda dola┼čmak i├žin ┼čunu yapabilirsiniz:

 var key = 0;
while(value = myArray[key++]){
    console.log(value);
}
 

Geleneksel for d├Âng├╝ler gibi, while d├Âng├╝ler en eski taray─▒c─▒lar taraf─▒ndan bile desteklenir.

Ayr─▒ca, her while d├Âng├╝s├╝n├╝n bir for d├Âng├╝ olarak yeniden yaz─▒labilece─čini unutmay─▒n . ├ľrne─čin, hereabove while d├Âng├╝ bu d├Âng├╝ ile ayn─▒ ┼čekilde davran─▒r for :

 for(var key = 0; value = myArray[key++];){
    console.log(value);
}
 

For...in ve for...of

JavaScriptÔÇÖte bunu da yapabilirsiniz:

 for (i in myArray) {
    console.log(myArray[i]);
}
 

Bununla birlikte, bu, for her durumda geleneksel bir d├Âng├╝ ile ayn─▒ ┼čekilde davranmad─▒─č─▒ndan ve dikkate al─▒nmas─▒ gereken olas─▒ yan etkiler oldu─čundan dikkatli kullan─▒lmal─▒d─▒r . Bkz "in i├žin ..." Neden kullan─▒yor diziye yineleme k├Ât├╝ bir fikir ile? daha fazla ayr─▒nt─▒ i├žin.

Alternatif olarak for...in , ┼čimdi de var for...of . A┼ča─č─▒daki ├Ârnek bir for...of d├Âng├╝ ve bir for...in d├Âng├╝ aras─▒ndaki fark─▒ g├Âsterir :

 var myArray = [3, 5, 7];
myArray.foo = "hello";

for (var i in myArray) {
  console.log(i); // logs 0, 1, 2, "foo"
}

for (var i of myArray) {
  console.log(i); // logs 3, 5, 7
}
 

Ayr─▒ca, Internet Explorer'─▒n hi├žbir s├╝r├╝m├╝n├╝n desteklemedi─čini for...of ( Edge 12+ destekliyorsa ) ve bunun for...in en az─▒ndan Internet Explorer 10 gerektirdi─čini g├Âz ├Ân├╝nde bulundurman─▒z gerekir .


Array.prototype.forEach()

for -Loops'a alternatif Array.prototype.forEach() , ┼ču s├Âzdizimini kullanan:

 myArray.forEach(function(value, key, myArray) {
    console.log(value);
});
 

Array.prototype.forEach() Internet Explorer 9 ve sonraki s├╝r├╝mlerin yan─▒ s─▒ra t├╝m modern taray─▒c─▒lar taraf─▒ndan desteklenmektedir.


K├╝t├╝phaneler

Son olarak, bir├žok yard─▒mc─▒ program k├╝t├╝phanesinin de kendi foreach varyasyonlar─▒ vard─▒r. AFAIK, en pop├╝ler ├╝├ž tanesi:

jQuery.each() , jQuery'de :

 $.each(myArray, function(key, value) {
    console.log(value);
});
 

_.each() , Underscore.js'de :

 _.each(myArray, function(value, key, myArray) {
    console.log(value);
});
 

_.forEach() , Lodash.js'de :

 _.forEach(myArray, function(value, key) {
    console.log(value);
});
 

56







H─▒zl─▒ bir d├Âng├╝ yazmak i├žin k─▒sa ve ├Âzl├╝ bir yol istiyorsan─▒z ve tersten yineleyebilirsiniz:

 for (var i=myArray.length;i--;){
  var item=myArray[i];
}
 

Bu, yazmak i├žin daha az karakter olurken , uzunlu─ču ├Ânbelle─če alma (benzer veya for (var i=0, len=myArray.length; i<len; ++i) farkl─▒ for (var i=0; i<myArray.length; ++i) ) avantaj─▒na sahiptir .

Yineleme s─▒ras─▒nda, DOM'dan ├Â─čeleri kald─▒rmay─▒ planlad─▒─č─▒n─▒z canl─▒ bir NodeList ├╝zerinde yineleme yaparken oldu─ču gibi, tersine yinelemeniz gereken zamanlar bile olabilir .


36







Baz─▒lar─▒ JavaScript'te i┼člevsel programlama yolundaki bir dizi boyunca d├Âng├╝ durumlar─▒n─▒ kullan─▒r :

1. Sadece bir dizi boyunca d├Âng├╝

 const myArray = [{x:100}, {x:200}, {x:300}];

myArray.forEach((element, index, array) => {
    console.log(element.x); // 100, 200, 300
    console.log(index); // 0, 1, 2
    console.log(array); // same myArray object 3 times
});
 

Not: Array.prototype.forEach (), giri┼č parametresinin bir de─čer d├Ând├╝rmemesi gerekti─či i├žin ald─▒─č─▒ ve bu nedenle saf bir fonksiyon olarak kabul edilemeyece─či i├žin, kesinlikle konu┼čman─▒n i┼člevsel bir yolu de─čildir.

2. Bir dizideki ├Â─čelerin herhangi birinin bir testi ge├žip ge├žmedi─čini kontrol edin.

 const people = [
    {name: 'John', age: 23}, 
    {name: 'Andrew', age: 3}, 
    {name: 'Peter', age: 8}, 
    {name: 'Hanna', age: 14}, 
    {name: 'Adam', age: 37}];

const anyAdult = people.some(person => person.age >= 18);
console.log(anyAdult); // true
 

3. Yeni bir diziye d├Ân├╝┼čt├╝r├╝n

 const myArray = [{x:100}, {x:200}, {x:300}];

const newArray= myArray.map(element => element.x);
console.log(newArray); // [100, 200, 300]
 

Not: map () y├Ântemi, ├ža─čr─▒lan dizideki her ├Â─čede sa─članan bir i┼člevi ├ža─č─▒rman─▒n sonu├žlar─▒yla yeni bir dizi olu┼čturur.

4. Belirli bir m├╝lk├╝ toplay─▒n ve ortalamas─▒n─▒ hesaplay─▒n

 const myArray = [{x:100}, {x:200}, {x:300}];

const sum = myArray.map(element => element.x).reduce((a, b) => a + b, 0);
console.log(sum); // 600 = 0 + 100 + 200 + 300

const average = sum / myArray.length;
console.log(average); // 200
 

5. Orijinali temel alan ancak de─či┼čtirmeden yeni bir dizi olu┼čturun.

 const myArray = [{x:100}, {x:200}, {x:300}];

const newArray= myArray.map(element => {
    return {
        ...element,
        x: element.x * 2
    };
});

console.log(myArray); // [100, 200, 300]
console.log(newArray); // [200, 400, 600]
 

6. Her kategorinin say─▒s─▒n─▒ say─▒n

 const people = [
    {name: 'John', group: 'A'}, 
    {name: 'Andrew', group: 'C'}, 
    {name: 'Peter', group: 'A'}, 
    {name: 'James', group: 'B'}, 
    {name: 'Hanna', group: 'A'}, 
    {name: 'Adam', group: 'B'}];

const groupInfo = people.reduce((groups, person) => {
    const {A = 0, B = 0, C = 0} = groups;
    if (person.group === 'A') {
        return {...groups, A: A + 1};
    } else if (person.group === 'B') {
        return {...groups, B: B + 1};
    } else {
        return {...groups, C: C + 1};
    }
}, {});

console.log(groupInfo); // {A: 3, C: 1, B: 2}
 

7. Belirli ├Âl├ž├╝tlere g├Âre bir dizinin alt k├╝mesini al

 const myArray = [{x:100}, {x:200}, {x:300}];

const newArray = myArray.filter(element => element.x > 250);
console.log(newArray); // [{x:300}] 
 

Not: filter () y├Ântemi, sa─članan i┼člev taraf─▒ndan uygulanan testi ge├žen t├╝m ├Â─čelerle birlikte yeni bir dizi olu┼čturur.

8. Bir diziyi s─▒ralay─▒n

 const people = [
  { name: "John", age: 21 },
  { name: "Peter", age: 31 },
  { name: "Andrew", age: 29 },
  { name: "Thomas", age: 25 }
];

let sortByAge = people.sort(function (p1, p2) {
  return p1.age - p2.age;
});

console.log(sortByAge);
 


g├Âr├╝nt├╝ tan─▒m─▒n─▒ buraya girin

9. Dizideki bir ├Â─čeyi bulun

 const people = [ {name: "john", age:23},
                {name: "john", age:43},
                {name: "jim", age:101},
                {name: "bob", age:67} ];

const john = people.find(person => person.name === 'john');
console.log(john);
 


g├Âr├╝nt├╝ tan─▒m─▒n─▒ buraya girin

Array.prototype.find () y├Ântemi, sunulan test i┼člevini sa─člayan dizideki ilk ├Â─čenin de─čerini d├Ând├╝r├╝r.

Referanslar


31


2018-02-23





D├Âng├╝n├╝zde ├žok az ├Ârt├╝k bir kapsam─▒n oldu─ču ve fazladan de─či┼čkenleri ortadan kald─▒rman─▒n bir yolu var.

 var i = 0,
     item;

// note this is weak to sparse arrays or falsey values
for ( ; item = myStringArray[i++] ; ){ 
    item; // This is the string at the index.
}
 

Ya da ger├žekten kimli─či elde etmek ve ger├žekten klasik bir for d├Âng├╝ elde etmek istiyorsan─▒z :

 var i = 0,
    len = myStringArray.length; // cache the length

for ( ; i < len ; i++ ){
    myStringArray[i]; // Don't use this if you plan on changing the length of the array
}
 

Modern taray─▒c─▒lar t├╝m destek yineleyici y├Ântemleri forEach , map , reduce , filter ve di─čer y├Ântemlerle bir dizi Dizi prototip .


27







JavaScript'te dizi aras─▒nda dola┼čman─▒n ├že┼čitli yollar─▒ vard─▒r.

Genel d├Âng├╝:

 var i;
for (i = 0; i < substr.length; ++i) {
    // Do something with `substr[i]`
}
 

ES5'in Her Biri:

 substr.forEach(function(item) {
    // Do something with `item`
});
 

jQuery.each:

 jQuery.each(substr, function(index, item) {
    // Do something with `item` (or `this` is also `item` if you like)
});
 

G├Âz bu detayl─▒ bilgi i├žin ya da kontrol edebilirsiniz MDN JavaScript'inizin bir dizide d├Âng├╝ & jQuery kontrol kullanmak i├žin her biri i├žin jQuery .


26







Tamamen underscore.js k├╝t├╝phanesinden yararlanman─▒z─▒ tavsiye ederim . Diziler / koleksiyonlar ├╝zerinde yineleme yapmak i├žin kullanabilece─činiz ├že┼čitli i┼člevler sa─člar.

├ľrne─čin:

 _.each([1, 2, 3], function(num){ alert(num); });
=> alerts each number in turn...
 

25







Dizi d├Âng├╝s├╝:

 for(var i = 0; i < things.length; i++){
    var thing = things[i];
    console.log(thing);
}
 

Nesne d├Âng├╝s├╝:

 for(var prop in obj){
    var propValue = obj[prop];
    console.log(propValue);
}
 

25


2016-08-01





Evet , bir d├Âng├╝ kullanarak JavaScript'te ayn─▒ ┼čeyi yapabilirsiniz, ancak bununla s─▒n─▒rl─▒ de─čildir , JavaScript'te diziler ├╝zerinde d├Âng├╝ yapman─▒n bir├žok yolu vard─▒r. Bu dizinin a┼ča─č─▒da oldu─čunu ve ├╝zerinde bir d├Âng├╝ yapmak istedi─činizi hayal edin:

 var arr = [1, 2, 3, 4, 5];
 

Bunlar ├ž├Âz├╝mler:

1) D├Âng├╝ i├žin

Bir for d├Âng├╝ JavaScript diziler d├Âng├╝ yayg─▒n bir yoludur, ancak hi├žbir b├╝y├╝k diziler i├žin h─▒zl─▒ bir ├ž├Âz├╝m olarak g├Âr├╝lmektedir:

 for (var i=0, l=arr.length; i<l; i++) {
  console.log(arr[i]);
}
 

2) D├Âng├╝

Bir s├╝re d├Âng├╝ uzun diziler aras─▒nda d├Âng├╝ i├žin en h─▒zl─▒ yol olarak kabul edilir, ancak genellikle JavaScript kodunda daha az kullan─▒l─▒r:

 let i=0;

while (arr.length>i) {
    console.log(arr[i]);
    i++;
}
 

3)
A do while , while a┼ča─č─▒daki gibi baz─▒ s├Âzdizimi farklar─▒yla ayn─▒ ┼čeyi yaparken :

 let i=0;
do {
  console.log(arr[i]);
  i++;
}
while (arr.length>i);
 

Bunlar JavaScript d├Âng├╝leri yapman─▒n ana yollar─▒, ancak bunu yapman─▒n birka├ž yolu var.

Ayr─▒ca for in JavaScript'teki nesneler ├╝zerinde d├Âng├╝ olu┼čturmak i├žin bir d├Âng├╝ kullan─▒yoruz .

Ayr─▒ca bak map() , filter() , reduce() JavaScript'inizin bir Array ├╝zerine, vb fonksiyonlar. Daha h─▒zl─▒ ve daha iyi kullanarak daha fazla ┼čeyler yapabilir while ve for .

JavaScript'teki diziler ├╝zerindeki e┼čzamans─▒z i┼člevler hakk─▒nda daha fazla bilgi edinmek istiyorsan─▒z bu iyi bir makaledir.

─░┼člevsel programlama bug├╝nlerde geli┼čim d├╝nyas─▒nda olduk├ža b├╝y├╝k bir s─▒├žrama yap─▒yor. Ve iyi bir nedenden dolay─▒: ─░┼člevsel teknikler, bir bak─▒┼čta, refactor ve testte anla┼č─▒lmas─▒ kolay olan daha fazla bildirimsel kod yazman─▒za yard─▒mc─▒ olabilir.

─░┼člevsel programlaman─▒n temel ta┼člar─▒ndan biri, liste ve liste i┼člemlerinin ├Âzel kullan─▒m─▒d─▒r. Ve bu ┼čeyler, t─▒pk─▒ onlar gibi ses gibidir: ┼čeylerin dizileri ve onlara yapt─▒─č─▒n─▒z ┼čeyler. Fakat i┼člevsel zihniyet, onlara bekledi─činizden biraz farkl─▒ davran─▒yor.

Bu makale "b├╝y├╝k ├╝├ž" liste i┼člemi olarak adland─▒rmak istediklerime yak─▒ndan bakacak: harita, filtreleme ve azaltma. Kafan─▒z─▒ bu ├╝├ž fonksiyonun etraf─▒na sarmak, temiz fonksiyonel kod yazabilmeniz i├žin ├Ânemli bir ad─▒md─▒r ve ├žok g├╝├žl├╝ fonksiyonel ve reaktif programlama tekniklerinin kap─▒lar─▒n─▒ a├žar.

Ayr─▒ca, bir daha asla for d├Âng├╝s├╝ yazman─▒za gerek kalmayaca─č─▒ anlam─▒na gelir.

Daha fazla >> burada okuyun :


25







Herhangi biri, Dizi yinelemelerinde kullan─▒labilen ├žoklu mekanizmalar─▒n performans─▒yla ilgileniyorsa, a┼ča─č─▒daki JSPerf testlerini haz─▒rlad─▒m:

https://jsperf.com/fastest-array-iterator


Performans sonu├žlar─▒

Sonu├žlar:

Geleneksel for() yineleyici, ├Âzellikle dizi uzunlu─ču ├Ânbelle─če al─▒nd─▒─č─▒nda kullan─▒ld─▒─č─▒nda en h─▒zl─▒ y├Ântemdir .

 let arr = [1,2,3,4,5];

for(let i=0, size=arr.length; i<size; i++){
    // Do something
}
 

Array.prototype.forEach() Ve Array.prototype.map() y├Ântemler muhtemelen bir sonucu olarak, en yava┼č yakla┼č─▒k de─čerlerdir i┼člev ├ža─čr─▒s─▒ y├╝k├╝ .


21







JQuery k├╝t├╝phanesini kullan─▒yorsan─▒z, http://api.jquery.com/jQuery.each/ adresini kullan─▒n.

Belgelerden:

jQuery.each( collection, callback(indexInArray, valueOfElement) )

─░ade: Nesne

A├ž─▒klama: Hem nesneler hem de diziler ├╝zerinde sorunsuz bir ┼čekilde yineleme yapmak i├žin kullan─▒labilen genel bir yineleyici i┼člevi. Length ├Âzelli─čine sahip diziler ve dizi benzeri nesneler (bir fonksiyonun arg├╝man nesnesi gibi), 0'dan uzunluk-1'e kadar say─▒sal dizin taraf─▒ndan yinelenir. Di─čer nesneler, adland─▒r─▒lm─▒┼č ├Âzellikleri ├╝zerinden yinelenir.

$.each() ─░┼člev ile ayn─▒ de─čildir $(selector).each() bir jQuery nesnenin ├╝zerine, ├Âzel olarak, yineleme i├žin kullan─▒lan,. $.each() ─░┼člev, bir harita (JavaScript nesne) veya bir dizi olup, herhangi bir toplama yineleme kullan─▒labilir. Bir dizi durumunda, geri arama her seferinde bir dizi indeksinden ve buna kar┼č─▒l─▒k gelen bir dizi de─čerinden ge├žirilir. (De─čere this anahtar kelimeyle de eri┼čilebilir , ancak Javascript this de─čeri Object basit bir dize veya say─▒ de─čeri olsa bile her zaman bir de─čer olarak saracakt─▒r .) Y├Ântem, ilk arg├╝man─▒n─▒, yinelenen nesneyi d├Ând├╝r├╝r.


19







Ki┼čisel olarak en ├žok sevdi─čim bu varyasyonu hen├╝z g├Ârmedim:

Bir dizi verilen:

 var someArray = ["some", "example", "array"];
 

Length ├Âzelli─čine hi├žbir zaman eri┼čmeden, ├╝zerinden ge├žebilirsiniz:

 for (var i=0, item; item=someArray[i]; i++) {
  // item is "some", then "example", then "array"
  // i is the index of item in the array
  alert("someArray[" + i + "]: " + item);
}
 

Bunu g├Âsteren bu JsFiddle'a bak─▒n: http://jsfiddle.net/prvzk/

Bu sadece seyrek olmayan diziler i├žin ├žal─▒┼č─▒r . Dizideki her bir dizinde ger├žekte bir de─čer oldu─ču anlam─▒na gelir. Ancak, pratikte JavaScript'te seyrek diziler kulland─▒─č─▒m─▒ hemen hemen buldum ... Bu gibi durumlarda bir nesneyi harita / karma tablo olarak kullanmak genellikle ├žok daha kolayd─▒r. Seyrek bir diziniz varsa ve 0 .. uzunluk-1 ├╝zerinde d├Âng├╝ yapmak istiyorsan─▒z, for (var i = 0; i <someArray.length; ++ i) yap─▒s─▒na ihtiyac─▒n─▒z var, ancak yine if de bir d├Âng├╝ i├žine ihtiyac─▒n─▒z var Ge├žerli dizindeki ├Â─čenin ger├žekte tan─▒mlanm─▒┼č olup olmad─▒─č─▒n─▒ kontrol etmek i├žin.

Ayr─▒ca, CMS a┼ča─č─▒daki a├ž─▒klamada da belirtildi─či gibi, bunu yaln─▒zca herhangi bir sahte de─čer i├žermeyen dizilerde kullanabilirsiniz. ├ľrnekten gelen dizeler dizisi ├žal─▒┼č─▒r, ancak bo┼č dizeleriniz veya 0 veya NaN, vb. Say─▒lar─▒n─▒z varsa, d├Âng├╝ erken kopar. Yine pratikte bu benim i├žin hi├ž sorun de─čil, ama ak─▒lda tutulmas─▒ gereken bir ┼čey, bu kullanmadan ├Ânce d├╝┼č├╝nmek i├žin bir d├Âng├╝ yapar ... Baz─▒ insanlar i├žin diskalifiye olabilir :)

Bu d├Âng├╝ hakk─▒nda sevdi─čim ┼čey:

  • Yazmak k─▒sa
  • Length ├Âzelli─čine eri┼čmeye gerek yok (tek tek ├Ânbellek)
  • Eri┼čilecek ├Â─če, se├žti─činiz ad─▒n alt─▒ndaki d├Âng├╝ g├Âvdesinde otomatik olarak tan─▒mlan─▒r.
  • ├çok do─čal olarak array.push ve array.splice ile birle┼čtirerek listeleri / y─▒─č─▒nlar─▒ i├žeren dizileri kullanabilirsiniz.

Bunun i┼če yaramas─▒n─▒n nedeni, dizi belirtiminin, bir dizini>> dizinin uzunlu─čundan bir ├Â─če okudu─čunuzda tan─▒ms─▒z d├Ând├╝rmesini zorunlu k─▒lmas─▒d─▒r. B├Âyle bir yere yazd─▒─č─▒n─▒zda uzunlu─ču ger├žekten g├╝ncelleyecektir.

Benim i├žin bu yap─▒ en sevdi─čim Java 5 s├Âzdizimini en ├žok benzetiyor:

 for (String item : someArray) {
}
 

... ayr─▒ca, d├Âng├╝ i├žindeki mevcut indeks hakk─▒nda bilgi edinmenin de faydas─▒ var.


17







Prototipin ├Âzellikleri hari├ž, yaln─▒zca kendi nesne ├Âzellikleri ├╝zerinde yineleme yapmak i├žin bir y├Ântem var:

 for (var i in array) if (array.hasOwnProperty(i)) {
    // Do something with array[i]
}
 

ancak yine de ├Âzel tan─▒ml─▒ ├Âzellikler ├╝zerinde yinelenir.

JavaScript'te herhangi bir ├Âzel ├Âzellik, bir dizi de dahil olmak ├╝zere herhangi bir nesneye atanabilir.

Biri seyrek dizilim ├╝zerinden yineleme yapmak istiyorsa for (var i = 0; i < array.length; i++) if (i in array) veya array.forEach ile es5shim kullan─▒lmal─▒d─▒r.


15







En ┼č─▒k ve h─▒zl─▒ yol

 var arr = [1, 2, 3, 1023, 1024];
for (var value; value = arr.pop();) {
    value + 1
}
 

http://jsperf.com/native-loop-performance/8


D├╝zenlendi (├ž├╝nk├╝ hatal─▒yd─▒m)


100000 maddelik bir dizi boyunca d├Âng├╝ metotlar─▒ kar┼č─▒la┼čt─▒rmak ve her seferinde yeni de─čer ile minimal bir i┼člem yapmak.

Haz─▒rl─▒k:

 <script src="//code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js"></script>
<script>
    Benchmark.prototype.setup = function() {
        // Fake function with minimal action on the value
        var tmp = 0;
        var process = function(value) {
            tmp = value; // Hold a reference to the variable (prevent engine optimisation?)
        };

        // Declare the test Array
        var arr = [];
        for (var i = 0; i < 100000; i++)
            arr[i] = i;
    };
</script>
 

Testler:

 <a href="http://jsperf.com/native-loop-performance/16" 
   title="http://jsperf.com/native-loop-performance/16"
><img src="http://i.imgur.com/YTrO68E.png" title="Hosted by imgur.com" /></a>
 

14







JavaScript'te yapman─▒n birka├ž yolu vard─▒r. ─░lk iki ├Ârnek, JavaScript ├Ârnekleridir. ├ť├ž├╝nc├╝s├╝, bir JavaScript k├╝t├╝phanesini, yani, .each() i┼člevi kullanan jQuery'yi kullan─▒r .

 var myStringArray = ["hello", "World"];
for(var i in myStringArray) {
  alert(myStringArray[i]);
} 

 var myStringArray = ["hello", "World"];
for (var i=0; i < myStringArray.length; i++) {
  alert(myStringArray[i]);
} 

 var myStringArray = ["hello", "World"];
$.each(myStringArray, function(index, value){
  alert(value);
}) 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 


13







JavaScript'te, bir diziyi d├Âng├╝lemek i├žin ├žok fazla ├ž├Âz├╝m vard─▒r.

A┼ča─č─▒daki kod pop├╝ler olanlard─▒r

 /** Declare inputs */
const items = ['Hello', 'World']

/** Solution 1. Simple for */
console.log('solution 1. simple for')

for (let i = 0; i < items.length; i++) {
  console.log(items[i])
}

console.log()
console.log()

/** Solution 2. Simple while */
console.log('solution 2. simple while')

let i = 0
while (i < items.length) {
  console.log(items[i++])
}

console.log()
console.log()

/** Solution 3. forEach*/
console.log('solution 3. forEach')

items.forEach(item => {
  console.log(item)
})

console.log()
console.log()

/** Solution 4. for-of*/
console.log('solution 4. for-of')

for (const item of items) {
  console.log(item)
}

console.log()
console.log() 


11







En iyi duruma getirilmi┼č yakla┼č─▒m, dizinin uzunlu─čunu ├Ânbelle─če almak ve tek de─či┼čkenli anahtar kelimeyle t├╝m de─či┼čkenleri ba┼člatan tek var deseni kullanmakt─▒r.

 var i, max, myStringArray = ["Hello","World"];
for (i = 0, max = myStringArray.length; i < max; i++) {
    alert(myStringArray[i]);
   //Do something
}
 

E─čer yineleme s─▒ras─▒ sizin ters d├Âng├╝ denemelisiniz ├Ânemli de─čilse, genel gider durum testini azaltt─▒─č─▒ndan ve d├╝┼č├╝┼č bir a├ž─▒klamada oldu─ču i├žin en h─▒zl─▒d─▒r:

 var i,myStringArray = ["item1","item2"];
for (i =  myStringArray.length; i--) {
    alert(myStringArray[i]);
}
 

ya da daha iyisi ve d├Âng├╝ s─▒ras─▒nda kullanmak daha temiz:

 var myStringArray = ["item1","item2"],i = myStringArray.length;
while(i--) {
   // do something with fruits[i]
}
 

10







Bence en iyi yol Array.forEach i┼člevini kullanmak. Bunu kullanamazsan─▒z, polyN MDN'den alman─▒z─▒ ├Âneririm. Kullan─▒labilir hale getirmek i├žin, JavaScript'te bir dizi ├╝zerinde yineleme yapmak i├žin kesinlikle en g├╝venli yoldur.

Array.prototype.forEach ()

Di─čerlerinin ├Ânerdi─či gibi, bu hemen hemen her zaman istedi─činiz ┼čeydir:

 var numbers = [1,11,22,33,44,55,66,77,88,99,111];
var sum = 0;
numbers.forEach(function(n){
  sum += n;
});
 

Bu, dizinin i┼členmesiyle ilgili ihtiyac─▒n─▒z olan her ┼čeyin bu kapsamda kalmas─▒n─▒ ve i├žinde bulunan nesne ├Âzelliklerini ve di─čer ├╝yeleri de─čil yaln─▒zca dizinin de─čerlerini i┼člemenizi sa─člar for .. .

D├╝zenli bir C tarz─▒ for d├Âng├╝ kullanmak ├žo─ču durumda i┼če yarar. D├Âng├╝deki her ┼čeyin kapsam─▒n─▒ program─▒n─▒z─▒n geri kalan─▒yla payla┼čt─▒─č─▒n─▒ unutmamak ├Ânemlidir, {} yeni bir kapsam olu┼čturmaz.

Dolay─▒s─▒yla:

 var sum = 0;
var numbers = [1,11,22,33,44,55,66,77,88,99,111];

for(var i = 0; i<numbers.length; ++i){
  sum += numbers[i];
}

alert(i);
 

"11" ├ž─▒kt─▒s─▒n─▒ alacak - istedi─čin ┼čey olabilir ya da olmayabilir.

├çal─▒┼čan bir jsFiddle ├Ârne─či: https://jsfiddle.net/workingClassHacker/pxpv2dh5/7/


10







JQuery kullanmak istiyorsan─▒z, belgelerinde g├╝zel bir ├Ârnek var:

  $.each([ 52, 97 ], function( index, value ) {
      alert( index + ": " + value );
 });
 

9


2016-03-30





├ľrne─čin, bir Firefox konsolunda kulland─▒m:

 [].forEach.call(document.getElementsByTagName('pre'), function(e){ 
   console.log(e);
})
 

8







K─▒sa cevap: evet. Bununla yapabilirsiniz:

 var myArray = ["element1", "element2", "element3", "element4"];

for (i = 0; i < myArray.length; i++) {
  console.log(myArray[i]);
}
 

Bir taray─▒c─▒ konsolunda, "element1", "element2" vb. Gibi yaz─▒l─▒ bir ┼čey g├Ârebilirsiniz.


8







% 100 ayn─▒ de─čil, benzer:

    var myStringArray = ['Hello', 'World']; // array uses [] not {}
    for (var i in myStringArray) {
        console.log(i + ' -> ' + myStringArray[i]); // i is the index/key, not the item
    } 


8







 var x = [4, 5, 6];
for (i = 0, j = x[i]; i < x.length; j = x[++i]) {
    console.log(i,j);
}
 

Çok daha temiz ...


7







Tabii ki verimsiz ve bir├žok ki┼či bunu k├╝├ž├╝ms├╝yor, ancak belirtilenlere en yak─▒n olanlardan biri:

 var myStringArray = ["Hello","World"];
myStringArray.forEach(function(f){
    // Do something
})
 

6