기본정리 - Javascript(4)

given·2024년 10월 24일
0

FE-기본

목록 보기
9/14
post-thumbnail

Javascript 기본

1. 함수

1. 함수 선언문

function hello(){
	//code block	
}

2. 함수 표현식

값으로 평가될 수 있는 식

  1. 네이밍 함수(naming function

    const a = function b() {
      for (let i = 1; i < 10; i++) {
        console.log(`${i}`);
        for (let j = 1; j < 10; j++) console.log(`${i} x ${j} = ${i * j}`);
        console.log(`----`);
      }
    };
    
    b(); // X
    a(); // O
  2. 익명 함수(anonymous function)

    const gugudan = function () {
      for (let i = 1; i < 10; i++) {
        console.log(`${i}`);
        for (let j = 1; j < 10; j++) console.log(`${i} x ${j} = ${i * j}`);
        console.log(`----`);
      }
    };

3. 호출(call) → 함수를 실행한다.

4. 함수 → 재활용성이 좋다. → 애플리케이션 어디서든 호출해서 쓸 수 있다.

5. 화살표 함수(ES6)

// 화살표 함수(함수 표현식)
const gugudan = () -> {};

2. 매개변수(parameter)

function gugudan(dan) {
  for (let i = 1; i < 10; i++) {
    console.log(`${i}`);
    for (let j = 1; j < 10; j++) console.log(`${i} x ${j} = ${i * j}`);
    console.log(`----`);
  }
};

gugudan(10) // 인자

3. 반환(return)

function gugudan(dan) {
  // 3단은 출력하면 안됨
  if (dan === 3) {
    console.log("3단은 출력하면 안되");
    return; // 함수를 중단하는 역할도 한다. -> undefined
  }

  for (let i = 1; i <= 9; i++) {
    console.log(`${dan} x ${i} = ${dan * i}`);
  }
}

gugudan(4);

4. 가변인자

인자가 고정적이면 재사용성이 어려움 ← 가변인자로 해결

// 재사용성 떨어짐
function sum(n1,n2,n3){
	return n1 + n2 + n3		
}

// 가변인자
// arguments <- 화살표 함수에서는 사용 못함
function sum() {
  let sum = 0;
  // arguments, caller, name, length, prototype
  for (let value of arguments) {
    console.log(value);
    sum += value;
  }
  console.log(arguments);
  return sum;
}

sum(10);
sum(10, 20);
sum(10, 20, 30);

// 스프레드 연산자(...)
// 전개 연산자 또는 나머지 연산자 
const sum = (...args) => {
  let sum = 0;
  for (let value of args) {
    sum += value;
  }
  return sum;
};

5. 스코프(scope)

식별자를 참조할 수 있는 범위

1. 함수 스코프와 블록 스코프 ← 지역 스코프

2. 전역스코프

3. 지역 스코프 → 전역 스코프 O, / 전역 스코프 → 지역 스코프 X

// 함수 스코프
const a = 10;
function print() {
    // 함수에서만 유효한 범위 -> 함수 스코프 -> 지역 스코프
  const b = 20;
  console.log(`함수 내부: ${a} ${b}`); // 10 20
}
print();
console.log(`함수 외부: ${a} ${b}`); // Error

// 블록 스코프
const a = 10;
const b = 50;
{
	const b = 20;
	console.log(`함수 내부: ${a} ${b}`);// 10 20
}
 console.log(`함수 외부: ${a} ${b}`); // 10 50

// 
const a = 10;
{
	// 지역 스코프
	const b = 20; 
	{
		// 지역 스코프
		const c = 30
	}
}

⚠️ 주의: var는 지역 스코프가 따로 없다.

profile
osanThor⚡️블로그 이전했습니다. https://blog.given-log.com

0개의 댓글