[ES6] 22. funtion과 for 문 실습

 

변수,  변수 참조로 alert 불러오기

 

const 변수 = {
  '김치국': '맛있어요!',
  '된장국': '좋아하지 않아요.',
  '미역국': '한번 먹어보고 싶어요.',
};

alert(`${변수['김치국']}`);

 

i 가 5까지 for문 

 

for (  i=1 ,i<=5 , i++ ){

 

}

let person_name = "";

for (let i = 1; i <= 5; i++) {
  person_name += `홍길동${i} <br>`;
}

document.write(person_name);

 

 

let person_name = "";

for (let i = 1; i <= 5; i++) {
  person_name += `홍길동${i}입니다. <br>`;
}

document.write(person_name);

 

 인자값 전달받은 function 과 변수 값이 변경되다(?)

 

let person = "홍길동";

function replaceName(str) {
  str = "을지문덕";
  document.write("을지문덕");
}

replaceName(person);

(2)

let person = "홍길동";

function replaceName(str) {
  str = "을지문덕";
  document.write("을지문덕");
}

replaceName(person);

document.write("<br>" + person);

 

 const ar = []는 빈 배열을 생성하는 코드

 

해당 요청에 대해 설명드리겠습니다.
먼저, const ar = []는 빈 배열을 생성하는 코드입니다. 이 배열은 ar이라는 변수에 할당되며, 이후에 배열에 값을 추가하거나 삭제할 수 있습니다.
ar.push('korea')는 ar 배열의 맨 뒤에 'korea'라는 문자열을 추가하는 코드입니다. push() 메서드는 배열의 맨 뒤에 값을 추가하는 메서드로, 인자로 전달된 값을 배열의 맨 뒤에 추가합니다.
예를 들어, 다음과 같은 코드를 실행하면 ar 배열에 'korea'라는 문자열이 추가됩니다.

 

const ar = [];
ar.push('korea');
console.log(ar); // ['korea']

위 코드에서 console.log(ar)를 실행하면 ['korea']라는 결과가 출력됩니다. 이는 ar 배열에 'korea'라는 문자열이 추가되어 배열의 요소가 하나만 있는 것을 의미합니다.

 const ar = []는 빈 배열을 생성하는 코드

 

for in과 for of는 JavaScript에서 반복문을 수행하는 방법 중 두 가지입니다.
for in은 객체의 속성을 반복하며, for of는 배열의 요소를 반복합니다.
예를 들어, 다음과 같은 객체와 배열이 있다고 가정해보겠습니다.

 

const obj = {
  name: 'John',
  age: 30,
  gender: 'male'
};

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

이제 for in과 for of를 사용하여 객체와 배열을 반복해보겠습니다.

// for in을 사용한 객체 반복
for (let prop in obj) {
  console.log(`${prop}: ${obj[prop]}`);
}

// for of를 사용한 배열 반복
for (let num of arr) {
  console.log(num);
}

위 코드에서 for in은 obj 객체의 속성을 반복하며, for of는 arr 배열의 요소를 반복합니다.
for in은 객체의 속성을 반복하며, 반복할 때는 객체의 속성 이름을 변수에 할당합니다. 따라서 prop 변수에는 obj 객체의 속성 이름이 하나씩 할당되며, obj[prop]을 통해 해당 속성의 값을 가져올 수 있습니다.
for of는 배열의 요소를 반복하며, 반복할 때는 배열의 요소 값을 변수에 할당합니다. 따라서 num 변수에는 arr 배열의 요소 값이 하나씩 할당되며, console.log(num)을 통해 해당 요소 값을 출력할 수 있습니다.
결과적으로 위 코드를 실행하면 다음과 같은 결과가 출력됩니다.

 

name: John
age: 30
gender: male
1
2
3
4
5

 

---

      for (const key in obj) {     ,  for (const value of arr) {

 for ( 자료형 key 전치사 변수명) {   ,  for ( 자료형 value 전치사 변수명) {

 

 

for 문, for...in 문 그리고 for...of 문은 JavaScript에서 반복 작업을 처리하기 위한 3가지 유용한 반복문입니다.

for 문: 초기 표현식, 조건문 및 증감 표현식을 사용하여 반복을 제어합니다.
예시:

javascript
for (let i = 0; i < 5; i++) {
  console.log(i);
}
// 출력: 0, 1, 2, 3, 4

for...in 문: 객체의 열거 가능한 속성에 대해 반복하며, 각 반복에서 속성의 키(인덱스)를 반환합니다. 주로 객체의 속성들을 반복하거나 배열의 인덱스를 반복할 때 사용합니다.
예시:

javascript
const obj = {
  firstName: 'John',
  lastName: 'Doe'
};

for (const key in obj) {
  console.log(key);
}
// 출력: firstName, lastName
3.for...of` 문: 반복 가능한 객체 (Array, Map, Set, 등)에 대해 반복하며, 각 반복에서 해당 요소의 값을 반환합니다. 주로 배열의 요소들을 반복할 때 사용합니다.

예시:

javascript
const arr = ['apple', 'banana', 'cherry'];

for (const value of arr) {
  console.log(value);
}
// 출력: apple, banana, cherry
위의 예시들을 통해 for, for...in, 그리고 for...of 문 사이의 차이점을 이해할 수 있습니다. 이들은 서로 다른 상황에 따라 JavaScript에서 반복 작업을 처리하는 데 매우 유용합니다.

 

 

---

 

forEach() 메서드는 배열의 각 요소에 대해 지정된 함수를 차례대로 한 번씩 호출해주는 함수입니다. 함수의 인자로 아이템(item), 인덱스(index) 및 원본 배열(array)을 전달할 수 있습니다.

상세한 설명:

아이템(item): 배열의 각 요소
인스(index): 현재 요소의 인덱스 (0부터 시작)
원본 배열(array): forEach()가 호출된 원본 배열
예시:

javascript
const fruits = ['apple', 'banana', 'cherry'];

fruits.forEach(function(item, index, array) {
  console.log(`Item: ${item}, Index: ${index}, Array: ${array}`);
});
출력:

Item: apple, Index: 0, Array: apple,banana,cherry
Item: banana, Index: 1, Array apple,banana,cherry
Item: cherry, Index: 2, Array: apple,banana,cherry
forEach() 메서드를 사용하면, 배열의 각 요소에 대해 함수를게 적용할 수 있습니다. 이 예시의 경우, 배열의 각 요소와 해당 요소의 인덱스 및 원본 배열을 출력하고 있습니다.

 

const fruits = ["apple", "banana", "cherry"];

fruits.forEach(function (item, index, array) {
  document.write(
    `Item: ${item},
     Index: ${index}, 
     Array: ${array}</br>`
  );
});

---