Bae

ㅁ 선언형 프로그래밍과 배열 - 함수형, 선언형, 명령형 프로그래밍 관계도 - 명령형 프로그래밍과 선언형 프로그래밍 입력 데이터를 얻고 가공한 다음, 결과를 출력하는 형태로 구성 1) 입력 데이터 얻기 2) 입력 데이터 가공해 출력 데이터 생성 3) 출력 데이터 출력 명령형 프로그래밍에서는 여러 개의 데이터를 대상으로 할 때 for문을 사용해서 구현 for( ; ; ) { 입력 데이터 얻기 입력 데이터 가공해 출력 데이터 생성 출력 데이터 출력 } 반면 선언형 프로그래밍은 시스템 자원의 효율적인 운용보다는 일괄된 문제 해결 구조에 더 집중함 for문을 사용하지 않고 모든 데이터를 배열에 담고, 문제가 해결될 때까지 끊임없이 또 다른 형태의 배열로 가공하는 방식으로 구현 1) 문제를 푸는 데 필요한 모든 ..

ㅁ 배열 이해하기(2) - 인덱스 연산자 배열이 담고 있는 아이템 중 특정 위치에 있는 아이템을 얻고자 할 때는 인덱스 연산자(index operator)[인덱스]를 사용함 인덱스 연산자는 배열의 특정 위치에 있는 아이템을 얻음 다음 코드에서 05행은 numbers[index] 형태로 배열의 특정 위치(index)에 담긴 값을 얻음 // array-index-operator.ts const numbers: number[] = [1, 2, 3, 4, 5] for(let index = 0; index < numbers.length; index++){ const item: number = numbers[index] console.log(item)// 1 2 3 4 5 } - 배열의 비구조화 할당 객체뿐만 아니..

ㅁ 배열 이해하기 자바스크립트에서 배열은 Array 클래스의 인스턴스이며 다음처럼 선언함 let 배열 이름 = new Array(배열 길이) 다음 코드는 Array 클래스의 인스턴스를 만든 후 push 메소드를 이용해 [1, 2, 3]으로 구성된 배열을 만듦 // array.ts let array = new Array array.push(1); array.push(2); array.push(3); console.log(array)// [1, 2, 3] 배열에 담긴 각각의 값을 아이템(item) 또는 원소(element)라고 하는데, 이 글에서는 아이템이라고 부르겠음 즉, 앞 코드의 array 변수에는 3개의 아이템을 담고 있음 - [] 단축 구문 자바스크립트는 []라는 단축 구문을 제공함 다음 코드는 [..

ㅁ 클래스 메소드 - function 함수와 this 키워드 타입스크립트의 function 키워드로 만든 함수는 Function이란 클래스의 인스턴스, 즉 함수는 객체라고 했음 객체지향 언어에서 인스턴스는 this 키워드를 사용할 수 있음 타입스크립트에서는 function 키워드로 만든 함수에 this 키워드를 사용할 수 있음 반면에 화살표 함수에는 this 키워드를 사용할 수 없음 - 메소드란? 타입스크립트에서 메소드(method)는 function으로 만든 함수 표현식을 담고 있는 속성임 다음 코드에서 클래스 A는 value와 method라는 두 개의 속성을 가짐 value에는 1이라는 값을 설정하지만, method는 () => void 타입의 함수 표현식을 설정함 여기서 method 구현 내용 중 ..

ㅁ 함수 구현 기법 - 매개변수 기본값 지정하기 선택적 매개변수는 항상 그 값이 undefined로 고정됨 만일, 함수 호출 시 인수를 전달하지 않더라도 매개변수에 어떤 값을 설정하고 싶다면 매개변수의 기본값을 지정할 수 있고 이를 디폴트 매개변수(default parameter)라고 함 (매개변수: 타입 = 매개변수 기본값) 다음 코드에서 3행의 makePerson 함수는 호출 때 매개변수 age에 해당하는 값을 전달받지 못하면 기본으로 10이 설정 // default.ts export type Person = {name: string, age: number} export const makePerson = (name: string, age: number = 10): Person => { const pe..

ㅁ 일등 함수 살펴보기 - 콜백 함수 일등 함수(first-class function)는 프로그래밍 언어가 제공하는 기능임 일등 함수 기능을 제공하는 언어에서 함수는 '함수 표현식'이라는 일종의 값임 따라서 변수에 담을 수 있음(함수 표현식을 매개변수로 받을 수 있다는 것을 의미) 이처럼 매개변수 형태로 동작하는 함수를 콜백 함수(callback function)라고 함 다음 코드에서 함수 f는 callback이라는 매개변수가 있는데, 함수 몸통에서 함수로서 호출함 const f = (callback: () => void): void => callback() 다음 코드는 좀 더 현실적인 콜백 함수 사용 예임 init 함수는 중간에 매개변수로 받은 callback에 담긴 함수 표현식을 실행함 // init..

ㅁ 화살표 함수와 표현식 문 ESNext 자바스크립트와 타입스크립트는 function 키워드가 아닌 => 기호로 만드는 화살표 함수도 제공함 const 함수 이름 = (매개변수1: 타입1, 매개변수2: 타입2[, ...]): 반환 타입 => 함수 몸통 그런데 화살표 함수의 몸통은 function 때와는 다르게 다음처럼 중괄호를 사용할 수도 있고 생략할 수도 있음 const arrow1 = (a: number, b: number): number => { return a + b }//실행문 방식 몸통 const arrow2 = (a: number, b: number): number => a + b//표현식 문 방식 몸통 중괄호 사용 여부에 따라 타입스크립트 문법이 동작하는 방식이 실행문 방식과 표현식 문 방..

ㅁ 함수 표현식 - 함수는 객체다 자바스크립트는 객체지향 언어와 함수형 언어의 특징이 모두 있음 타입스크립트 또한 자바스크립트의 이런 특징을 모두 포함함 자바스크립트에서 함수는 Function 클래스의 인스턴스(instance)임 다음 코드를 실행해보면 3이 출력되는데, 이는 add가 함수로서 동작한다는 의미임 // function.ts let add = new Function('a', 'b', 'retrun a + b') let result = add(1, 2) console.log(result)// 3 1행의 내용이 조금 특이함 add가 함수라면 다음과 같은 구문이어야 하는데, 1행은 변수 선언문 형태로 add 함수를 구현했기 때문 function add(a, b) { return a + b } 사실..

ㅁ 함수 선언문 자바스크립트에서 함수는 function 키워드로 만드는 함수와 => 기호로 만드는 화살표 함수 두 가지 있음 다음 function 키워드로 만드는 함수 선언문의 구조임 function 함수 이름(매개변수1, 매개변수2[, ...]) { 함수 몸통 } 타입스크립트 함수 선언문은 자바스크립트 함수 선언문에서 매개변수와 함수 반환값(return type)에 타입 주석을 붙이는 다음 형태로 구성됨 function 함수 이름(매개변수1: 타입1, 매개변수2: 타입2[, ...]): 반환값 타입{ 함수 몸통 } 다음 코드는 타입스크립트 함수 선언문의 예임 function add(a: number, b: number): number { return a + b; } * 매개변수와 인수, 인자 일반적으로..

ㅁ 객체의 타입 변환 - 타입 변환 타입이 있는 언어들은 특정 타입의 변수값을 다른 타입의 값으로 변환할 수 있는 기능을 제공함 이를 타입 변환(type conversion)이라고 함 1행의 person 변수의 타입은 object임 그런데 object 타입은 name 속성을 가지지 않으므로 오류가 발생함 let person: object = { name: 'Jack', age: 32 }; person.name// object 형식에 name 속성이 없습니다. 다음은 이 오류를 타입 변환 구문을 사용해 해결한 것임 person 변수를 일시적으로 name 속성이 있는 타입 즉, { name: string } 타입으로 변환해 person.name 속성값을 얻게 했음 let person: object = { n..