wiki:javascript:javascript_note:js_loop_for_in

차이

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

차이 보기로 링크

--- wiki:javascript:javascript_note:js_loop_for_in [2021/04/26 20:35]
emblim98
+++ wiki:javascript:javascript_note:js_loop_for_in [2023/01/13 18:44] (현재)
@@ 줄 9: / 줄 9: @@
 \\
 ===the source of this article===
-[[https://www.w3schools.com/js/js_loop_forin.asp|JavaScript Loop For In]]
+[[https://www.w3schools.com/js/js_loop_forin.asp|JavaScript Loop For In]]\\
+\\
-%%JavaScript%5 ''%%for/in%%'' 스테이트먼트는 오브젝트의 속성을 반복합니다.\\
+%%JavaScript%% ''%%for/in%%'' 스테이트먼트는 오브젝트의 속성을 반복합니다.\\
 ====Syntax====
@@ 줄 20: / 줄 20: @@
 </code>
 \\
-<code javascript>
+<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}}

/var/services/web/dokuwiki/data/attic/wiki/javascript/javascript_note/js_loop_for_in.1619436954.txt.gz · 마지막으로 수정됨: 2022/03/10 19:52 (바깥 편집)