공부하기

부족한 점 공부 2

Hyeon been 2023. 3. 5. 19:58

한번씩 읽고 가세요.

“ 지연되는 프로젝트에 인력을 더 투입하면 오히려 더 늦어진다. ”

- Frederick Philips Brooks
Mythical Man-Month 저자
728x90

for in,for of 의 차이점

 

for-in

for-in 루프는 객체의 속성을 반복하는 데 사용됩니다. for-in 루프는 객체의 속성 이름을 열거하고, 해당 속성의 값을 사용할 수 있습니다.

const person = {
  name: "John",
  age: 30,
  address: "123 Main St"
};

for (let property in person) {
  console.log(`${property}: ${person[property]}`);
}

위의 코드는 person 객체의 속성을 반복하며, 각 속성의 이름과 값을 출력합니다. 출력 결과는 다음과 같습니다.

name: John
age: 30
address: 123 Main St

for-in 루프는 객체의 모든 속성을 열거하기 때문에, 프로토타입 체인에서 상속받은 속성도 포함됩니다. 이는 예기치 않은 동작을 유발할 수 있으므로, 객체의 속성을 반복할 때는 항상 hasOwnProperty 메서드를 사용하여 객체 자체에 정의된 속성만 반복하는 것이 좋습니다.

 

for-of

for-of 루프는 배열, 문자열, 맵(Map), 셋(Set)과 같은 Iterable 객체를 반복하는 데 사용됩니다. for-of 루프는 객체의 값을 반복하며, 해당 값을 사용할 수 있습니다.

const arr = [1, 2, 3];

for (let item of arr) {
  console.log(item);
}

위의 코드는 arr 배열의 요소를 반복하며, 각 요소의 값을 출력합니다. 출력 결과는 다음과 같습니다.

1
2
3

for-of 루프는 객체의 값을 열거하기 때문에, 객체의 속성을 반복하는 데는 사용할 수 없습니다. 따라서 객체의 속성을 반복할 때는 for-in 루프를 사용해야 합니다.

 

함수

자바스크립트에서 함수는 일련의 작업을 수행하고 값을 반환하는 코드 블록입니다. 함수는 코드를 모듈화하여 코드의 재사용성, 유지보수성 및 가독성을 향상시키는 데 도움이 됩니다.

JavaScript에서 함수는 다음과 같은 기본 구성 요소로 이루어져 있습니다.

  1. 함수 이름 (Function Name)
    • 함수를 호출할 때 사용하는 이름입니다.
    • 함수 이름은 생략할 수 있습니다.
  2. 매개변수 (Parameters)
    • 함수가 호출될 때 전달되는 입력 값입니다.
    • 함수는 매개변수를 사용하여 입력 값을 처리하고 결과를 반환합니다.
  3. 함수 몸체 (Function Body)
    • 함수가 실행되었을 때 실행되는 코드 블록입니다.
    • 함수 몸체에는 함수가 수행할 작업과 반환할 값을 정의하는 코드가 포함됩니다.
  4. 반환 값 (Return Value)
    • 함수가 수행한 작업의 결과를 반환하는 값입니다.
    • 함수는 return 키워드를 사용하여 값을 반환합니다.

JavaScript에서 함수는 function 키워드를 사용하여 정의할 수 있습니다. 함수는 다른 함수 내부에 중첩될 수 있으며, 변수에 할당될 수도 있습니다.

함수는 코드의 재사용성을 높이고, 변수의 스코프를 제어하여 변수 충돌을 방지하며, 코드를 모듈화하여 가독성을 높이는 데 도움이 됩니다.

 

함수 종류

  1. 일반 함수 (function declaration)
    • function 키워드를 사용하여 정의되는 함수입니다.
    • 호이스팅에 영향을 받습니다.
    • 함수 이름이 필수적으로 필요합니다.
    • 함수를 호출할 때, 함수 이름을 사용합니다.
  2. 함수 표현식 (function expression)
    • function 키워드를 사용하여 변수에 할당하는 함수입니다.
    • 변수 이름을 통해 함수에 접근할 수 있습니다.
    • 변수를 호출하여 함수를 호출합니다.
  3. 익명 함수 (anonymous function)
    • 이름이 없는 함수로 변수에 할당하여 사용합니다.
    • 콜백 함수나 즉시 실행 함수(IIFE) 등에서 사용합니다.
  4. 화살표 함수 (arrow function)
    • => 화살표를 사용하여 함수를 정의합니다.
    • 간단한 함수를 작성할 때 사용합니다.
    • this와 arguments를 바인딩하는 방식이 일반 함수와 다릅니다.
  5. 생성자 함수 (constructor function)
    • function 키워드와 new 연산자를 사용하여 객체를 생성하는 함수입니다.
    • 객체 생성자로서, 클래스와 비슷한 역할을 합니다.
  6. 제너레이터 함수 (generator function)
    • function* 키워드를 사용하여 정의되는 함수입니다.
    • 함수 실행 중에 멈출 수 있는 여러 개의 값을 반환하는 함수입니다.
    • yield 키워드를 사용하여 값을 반환합니다.
  7. 메서드 (method)
    • 객체에 속한 함수를 의미합니다.
    • 객체 내에서 function 키워드를 사용하여 정의합니다.
    • 객체에 속한 속성에 접근하듯이 . 표기법으로 호출합니다.
  8. 콜백 함수 (callback function)
    • 다른 함수에 인수로 전달되는 함수입니다.
    • 비동기적인 작업을 수행할 때 자주 사용됩니다.
  9. 즉시 실행 함수 (IIFE, Immediately Invoked Function Expression)
    • 함수를 정의하면서 즉시 실행하는 함수입니다.
    • () 괄호를 사용하여 함수를 즉시 실행합니다.
    • 함수 스코프 내부에 있는 변수를 다른 곳에서 접근할 수 없습니다.

prompt()

prompt() 함수는 JavaScript에서 제공하는 함수 중 하나로, 사용자에게 메시지를 표시하고 입력 창을 제공하여 입력을 받을 수 있습니다. 사용자가 입력한 값을 문자열 형태로 반환합니다.

 

null

 

null은 자바스크립트의 기본 데이터 타입 중 하나입니다. null은 값이 없음을 나타내는 특별한 값으로, 변수에 할당하여 사용할 수 있습니다.

null 값은 변수가 초기화되었지만, 값이 아직 설정되지 않았거나, 변수에 값이 할당되었지만 그 값이 의미 없는 경우에 사용됩니다. 예를 들어, 데이터베이스에서 어떤 값이 존재하지 않을 때, 해당 값을 null로 처리할 수 있습니다.

null 값은 falsy 값으로 간주되므로, 조건문에서 null 값을 사용할 때 주의해야 합니다. null 값은 false와 같지 않으므로, null 값을 조건식에 사용할 때는 null 값이 아닐 때를 검사해야 합니다.