함수

1. 함수란?

input을 받아서 output을 내보내는 일련의 과정
함수는 함수 정의(Function definition)를 통해 생성한다.
JS의 함수는 다양한 방법으로 정의할 수 있다.
함수의 정의만으로 함수가 실행되지 않는다. 인수 -> 매개변수를 통해 함수에게 전달하면서 함수의 실행을 명시적으로 지시해야한다.
이를 함수호출(Function call/invoke)이라 한다.

1
2
3
4
5

// f(x, y) = x + y
function add(x, y) {  //함수 정의
  return x + y;
}
add(2, 5);   //7     //함수 호출

함수를 호출하면 코드 블록에 담긴 문들이 일괄적으로 실행되고 반환값을 반환한다.

2. 함수의 사용 이유

• 동일한 작업을 반복적으로 수행한다면, 미리 정의된 함수를 재사용하는 것이 효율적이다.
  함수는 얼마든지 호출할 수 있으므로 코드의 재사용의 측면에서 매우 유용하다.
• 함수는 유지보수의 편의성을 높이고 실수를 줄여 코드의 신뢰성을 높이는 효과가 있다.
• 코드의 가독성을 향상시킨다. (객체타입의 값이라 식별자를 붙일 수 있음)

스코프

스코프는 변수, 함수와 관련있다. 스코프는 식별자가 유효한 범위를 말한다.

함수의 매개변수는 함수 몸체 내부에서만 참조할 수 있고, 함수 몸체 외부에서는 참조할 수 없다.
매개변수의 스포크가 함수 몸체 내부로 한정되기 때문이다.

변수는 코드의 가장 바깥영역(window)뿐만 아니라 코드 블록이나 함수 몸체 내에서도 선언할 수 있다. 코드 블록이나 함수는 중첩될 수 있다.
변수는 자신이 선언된 위치에 의해 자신이 유효한 범위(다른 코드가 변수 자신을 참조할 수 있는 범위)가 결정된다.
이를 스코프라 한다.

프로그래밍 언어에서 스코프를 통해 식별자인 변수 이름의 충돌을 방지하여 같은 이름의 변수를 사용할 수 있도록 한다. 스코프 내에서 식별자는 유일해야 하지만 다른 스코프에는 같은 이름의 식별자를 사용할 수 있다.

스코프의 종류

코드는 전역(global)과 지역(local)으로 구분할 수 있다.

이때 변수는 자신이 선언된 위치(전역 or 지역)에 의해 자신이 유효한 범위인 스코프가 결정된다.

객체란?

• 자바스크립트는 객체기반의 프로그래밍 언어, 원시 값을 제외한 나머지 모든 값들이 객체이다.

• 원시 값이랑 반대로 객체는 변경 가능한 값이다.

• 객체는 키(key) 값(value)로 구성된 프로퍼티(Property)들의 집합

  1 2 3 4 5

  var person = { name : 'Lee' // 프로퍼티 age : 20 // 프로퍼티 //name, age 프로퍼티 키 / 'Lee' 20 프로퍼티 값 };

• 프로퍼티 값으로 함수를 사용할 수도 있다.

• 프로퍼티 값이 함수일 경우, 메소드(Method)라 부른다.

  • 프로퍼티: 객체의 상태를 나타내는 값
  • 메소드: 프로퍼티를 참조하고 조작할 수 있는 동작

1
2
3
4
5
6

var counter = {
  num: 0,                    //프로퍼티
  increase: function(){      //메소드
    this.num++;
  }
}

타입변환이란?

명시적 타입 변환(Explicit coercion), 타입캐스팅(Type casting)
개발자가 의도적으로 값의 타입을 변환

암묵적 타입 변환(Implicit coercion), 타입 강제 변환(Type coercion)
자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환

두 타입변환이 기존 원시값을 직접 변경하는 것은 아니다. (원시값은 변경 불가능한 값이므로 변경할 수 없음)
타입변환이란 기존 원시값을 사용해 다른 타입의 새로운 원시값을 생성하는 것이다.

암묵적 타입 변환

1. 문자열 타입으로 변환

1

1 + '2'    //"12"

• +연산자는 피연산자 중 하나 이상이 문자열이므로 문자열 연결 연산자로 동작한다.

• 문자열 연결 연산자의 모든 피연산자는 코드의 문맥 상 모두 문자열 타입이여야 한다.

제어문

제어문은 주어진 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용한다.
일반적으로 코드는 위에서 아래 방향으로 순차적으로 실행된다.
코드의 흐름을 이해하기 어렵게 만들어 가독성을 해치는 단점이 있다.

1. 블록문

• 0개 이상의 문을 중괄호로 묶은 것으로 코드 블록 또는 블록이라고 부른다.
• 자바스크립트는 블록문을 하나의 실행 단위로 취급한다.
• 단독으로 사용할 수 있으나, 일반적으로 제어문이나 함수를 정의 할때 사용한다.
• 블록문의 끝에는 세미콜론을 붙이지 않는다.

2. 조건문

조건문은 주어진 조건식의 평가 결과에 따라 코드블록(블록문)의 실행을 결정한다.
불리언 값으로 평가될 수 있는 표현식이다.
if..else 문은 논리적 참, 거짓으로 실행 코드 블록을 결정
switch 문은 다양한 상황(case)에 따라 실행할 코드 블록을 결정할 때 사용한다.

연산자 (Operator)

• 연산자는 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산 등을 수햏애 하나의 값을 만든다.
• 연산의 대상을 피연산자(Operand)라 한다.
• 피연산자는 값을 평가 될 수 있는 표현식이여야 한다.
• 피연산자와 연산자의 조합으로 이루어진 연산자 표현식도 값으로 평가될 수 있는 표현식이다.
• 피연산자는 연산의 대상이 되어야 하므로 값으로 평가할 수 있어야 한다.

1. 산술연산자

산술 연산자(Arithmetic Operator)는 피연산자를 대상으로 수학적 계산을 수행해 새로운 값을 만든다.
산술 연산이 불가능한 경우, NaN을 반환한다.

이항 산술 연산자

• 이항 산술 연산자는 2개의 피연산자를 산술 연산하여 숫자타입의 값을 만든다.
• 모든 이항 산술 연산자는 피연산자의 값을 변경하는 side effect가 없다.
  (어떤 산술 연산을 해도 피연산자의 값이 바뀌는 경우는 없다.)

단항 산술 연산자

• 1개의 피연산자를 산술하여 숫자 타입의 값을 만든다.
• 증가/감소 (++/–) 연산자는 피연산자의 값을 변경하는 부수효과가 있다. (암묵적 할당이 이루어진다.)
• 증가/감소 (++/–) 연산자는 위치에 의미가 있다.

• 피연산자 앞에 위치한 전위 증가/감소 연산자는 먼저 피연산자의 값을 증가/감소시킨 후, 다른 연산을 수행한다.
• 피연산자 뒤에 위치한 후위 증가/감소 연산자는 먼저 다른 연산을 수행한 후, 피연산자의 값을 증가/감소시킨다.

데이터 타입

자바스크립트의 모든 값은 데이터 타입을 갖는다.
자바스크립트(ES6)는 7개의 데이터 타입을 제공한다.

• 원시타입 (primitive type)

  • 숫자(number): 숫자, 정수와 실수 구분없이 하나의 숫자 타입만 존재
  • 문자열(string): 문자열
  • 불리언(boolean): 논리적 true, false
  • undefined: var 키워드로 선언된 변수에 암묵적으로 할당되는 값
  • null: 값이 없다는 것을 의도적으로 명시할 때 사용하는 값
  • symbol: 이름의 충돌 위험이 없는 객체의 유일한 프로퍼티 키를 만들기 위해 사용

• 객체타입 (object/reference type)

  • 객체, 함수, 배열 등

expresstion and statement

값(value)?

값(value)는 표현식(expression)이 평가(evaluate)되어 생성된 결과

1

10 + 20 ;  //30

10 + 20은 평가되어 숫자 값 30을 생성

1

var sum = 10 + 20;

변수에는 10 + 20이 평가되어 생성된 숫자 값 30이 할당된다.
sum에 할당(assignment)되는 것은 10 + 20이 아니라, 10 +20이 평가된 결과인 숫자 값 30.
10 + 20은 할당 이전에 평가되어 값을 생성해야 한다.