사용자 도구

사이트 도구


wiki:javascript:javascript_note:js_loop_for_in

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

다음 판
이전 판
wiki:javascript:javascript_note:js_loop_for_in [2021/04/26 20:26]
emblim98 만듦
wiki:javascript:javascript_note:js_loop_for_in [2023/01/13 18:44] (현재)
줄 9: 줄 9:
 \\ \\
 ===the source of this article=== ===the source of this article===
-[[https://www.w3schools.com/js/js_loop_for.asp|JavaScript Loop For In]]+[[https://www.w3schools.com/js/js_loop_forin.asp|JavaScript Loop For In]]\\ 
 +\\ 
 +%%JavaScript%% ''%%for/in%%'' 스테이트먼트는 오브젝트의 속성을 반복합니다.\\
  
 +====Syntax====
 +<code javascript>
 +for (key in object) {
 +  // code block to be executed
 +}
 +</code>
 +\\
  
 +<code javascript>
 +let txt = "";
 +let person = { fname: "John", lname: "Doe", age: 25 };
 +let x;
 +for (x in person) {
 +  txt += person[x] + " ";
 +}
 +document.getElementById("demo").innerHTML = txt;  // John Doe 25
 +</code>
  
 +\\
 +====예제 설명====
 +  * **for in** 루프는 person 오브젝트를 반복합니다.
 +  * 각 반복은 **키(x)**를 반환합니다.
 +  * 키는 키 값에 액세스하는 데 사용됩니다.  
 +  * 키의 값은 person[x]입니다.
  
 +=====For/In Over Arrays=====
 +%%JavaScript%% ''%%for/in%%'' 문은 배열의 속성을 반복할 수도 있습니다.\\
  
 +====Syntax====
 +<code javascript>
 +for (variable in array) {
 +  code
 +}
 +</code>
 +\\
  
 +<code javascript>
 +let txt = "";
 +let numbers = [45, 4, 9, 16, 25];
 +let x;
 +for (x in numbers) {
 +  txt += numbers[x] + "<br>";
 +}
 +document.getElementById("demo").innerHTML = txt;  // 45<br>4<br>9<br>16<br>25
 +</code>
 +\\
  
 +  인덱스 **순서**가 중요한 경우에는 배열에 대해 **%%for in%%**을 사용하지 마세요.
 +  인덱스 순서는 구현에 종속적이고, 배열의 값은 예상 순서대로 액세스하지 못할 수 있습니다.
 +  인덱스 순서가 중요한 경우, **for** 루프, **for of** 루프, **Array.forEach()**를 사용하는 것이 좋습니다.
 +\\
  
 +=====Array.forEach()=====
 +''%%forEach()%%'' 메서드는 각 배열 요소에 대해 한 번씩 함수 (콜백 함수)를 호출합니다.\\
 +\\
  
 +<code javascript>
 +let txt = "";
 +let numbers = [45, 4, 9, 16, 25];
 +numbers.forEach(myFunction);
 +document.getElementById("demo").innerHTML = txt;
  
 +function myFunction(value, index, array) {
 +  txt = txt + value + "<br>";   // 45<br>4<br><br>9<br>16<br>25<br>
 +}
 +</code>
 +\\
  
 +상기 함수는 3 개의 인수(arguments)를 취합니다.\\
 +\\
 +  * The item value
 +  * The item index
 +  * The array 자체
 +
 +위의 예제에서는 value 매개변수 만 사용합니다. 예제는 다음과 같이 다시 작성할 수 있습니다.\\
 +\\
 +<code javascript>
 +let txt = "";
 +let numbers = [45, 4, 9, 16, 25];
 +numbers.forEach(myFunction);
 +document.getElementById("demo").innerHTML = txt;
 +
 +function myFunction(value) {
 +  txt = txt + value + "<br>";   // 45<br>4<br><br>9<br>16<br>25<br>
 +}
 +</code>
  
  
  
 {{tag>오션 Javascript For Loop In}} {{tag>오션 Javascript For Loop In}}
/volume1/web/dokuwiki/data/attic/wiki/javascript/javascript_note/js_loop_for_in.1619436363.txt.gz · 마지막으로 수정됨: 2022/03/10 19:52 (바깥 편집)