저장소

들어가며 고차 함수는 함수를 매개변수로 사용하거나 함수를 반환하는 함수(연산의 결과로 반환해주는 메서드)로, 함수형 프로그래밍의 핵심이자, 자바스크립트를 함수형 프로그래밍에 알맞은 언어로 만들어주는 특성. 자바스크립트의 filter(), map(), reduce() 함수도 고차 함수 개념을 활용해 만들어져 있다. 함수형 프로그래밍이란? 함수형 프로그래밍은 함수를 다른 함수의 파라미터로 넘길 수도 있고 반환(return) 값으로 함수를 받을 수도 있는 프로그래밍 형태를 말한다. 함수형 프로그래밍에서, 개발자는 함수라는 용어 하에서 생각하고 코딩하게 된다. 고차 함수와 비슷한 개념으로는 고차 컴포넌트(HOC: Higher-Order Component)가 있다. 고차 컴포넌트가 주로 리엑트(React)와 연관..

async와 await라는 특별한 문법을 사용하면 프라미스를 좀 더 편하게 사용할 수 있다. async, await는 놀라울 정도로 이해하기 쉽고 사용법도 어렵지 않다. async 함수 async 키워드부터 알아보자. async는 function 앞에 위치. async function f() { return 1; } function 앞에 async를 붙이면 해당 함수는 항상 프라미스를 반환. 프라미스가 아닌 값을 반환하더라도 이행 상태의 프라미스(resolved promise)로 값을 감싸 이행된 프라미스가 반환되도록 함. 아래 예시의 함수를 호출하면 result가 1인 이행 프라미스가 반환된다. async function f() { return 1; } f().then(alert); // 1 명시적으로..

1. 프로미스란? 자바스크립트는 비동기 처리를 위한 하나의 패턴으로 콜백 함수를 사용한다. 하지만 전통적인 콜백 패턴은 콜백 헬로 인해 가독성이 나쁘고 비동기 처리 중 발생한 에러의 처리가 곤란하며 여러 개의 비동기 처리를 한번에 처리하는 데도 한계가 있다. ES6에서는 비동기 처리를 위한 또 다른 패턴으로 프로미스(Promise)를 도입했다. 프로미스는 전통적인 콜백 패턴이 가진 단점을 보완하며 비동기 처리 시점을 명확하게 표현할 수 있다는 장점이 있다. 2. 콜백 패턴의 단점 2.1 콜백 헬 먼저 동기식 처리 모델과 비동기식 처리 모델에 대해 간단히 살펴보자. 동기식 처리 모델(Synchronous processing model)은 직렬적으로 태스크(task)를 수행한다. 즉, 태스크는 순차적으로 실..

들어가며 고급 예외 처리 구문 사용하면 예외 처리와 관련 추가 기능들을 활용할 수 있다. => 예외 객체와 throw 구문. 현실에서 어떤 사건 발생하면 '누가, 언제, 어디서, 무엇을, 어떻게, 왜' 라는 정보가 생기는데, 프로그래밍 언어에서도 예외가 발생하면 예외와 발생된 정보 확인 가능. 이러한 정보를 확인할 수 있게 해주는 것 => 예외 객체(exception object) 자바스크립트는 다른 프로그래밍 언어와 비교해서 예외가 거의 발생하지 않는 프로그래밍 언어. 프로그램에 수많은 버그를 일으킬 수 있는 요소가 되기도 하며, 개발자가 예외를 강제로 발생시켜줘야 하는 경우가 많다. 예외를 강제로 발생시킬 때 => throw 키워드 사용 예외 객체 try catch 구문을 사용할 때 catch의 괄호..

들어가며 자바스크립트는 코드를 작성했을 때 '코드가 실행조차 되지 않는 오류'와 '코드 실행 중간에 발생하는 오류'라는 2가지 종류의 오류가 있다. 괄호 개수를 잘못 입력하는 등의 오류로 코드가 실행조차 되지 않는 오류 => 구문 오류(syntax error) 이러한 문법적 오류를 제외하고 코드 실행 중간에 발생하는 오류 => 예외(exception), 그리고 이를 처리하는 것 => 예외 처리(exception handling) 오류의 종류 프로그래밍 언어의 오류(errro)에는 크게 2가지 종류가 있다 프로그램 실행 전에 발생하는 오류 프로그램 실행 중에 발생하는 오류 2가지 모두 '오류'라고 부르며, 프로그램 실행 전에 발생하는 오류를 구문 오류(syntax error) , 프로그램 실행 중에 발생하..

속성 존재 여부 확인 객체 내부에 어떤 속성이 있는지 확인해보느 코드는 자주 사용하는 코드. 객체에 없는 속성에 접근하면 undefined 자료형이 나옴. 따라서 조건문으로 undefined인지 아닌지 확인하면 속성 존재 여부를 확인할 수 있다. 속성 존재 여부 확인하기 // 객체를 생성 const object = { name : '혼자 공부하는 파이썬', price : 18000, publisher : '한빛미디어' } // 객체 내부에 속성이 있는지 확인 if (object.name !== undefined) { console.log('name 속성이 있습니다') } else { console.log('name 속성이 없습니다.') } if (object.author !== undefined) { c..

들어가며 현대 프로그래밍 언어는 모두 객체 지향이라는 패러다임을 기반으로 하고 모든 개발이 객체로 이루어진다. 자바스크립트에서 사용하는 자료는 크게 기본 자료형(primitives)과 객체 자료형(object)으로 구분할 수 있다. 유연함의 대명사인 자바스크립트는 기본 자료형이 객체 자료형이 될 수도 있다. 어떤 경우에 그렇게 되는지 알아보고, 이를 활용하는 prototype 객체를 알아보자. 그리고 자바스크립트의 기본적인 객체들이 갖고 있는 속성과 메소드, 마지막으로 외부 자바스크립트를 읽어들이고 사용하는 방법을 알아보자. 객체 자료형 속성과 메소드를 가질 수 있는 모든 것 객체. 예를 들면 배열도 객체. 다음과 같이 a라는 이름의 배열을 선언하고 배열에 속서을 지정한 후 확인해보면 배열이 속성을 가질..

들어가며 객체(object) 란 추상적 의미로 한 마디로 정의하면 '실제로 존재하는 사물'을 의미. '이름(name)과 값(value) 으로 구성'된 속성(property)을 가진 자바스크립트의 기본 데이터 타입. 배열(array)도 객체라고 할 수 있음. 객체 자바스크립트에서 여러 자료를 다루 때 객체(object)를 사용. 배열(array)도 객체이기 때문에 여러 자료를 다룰 수 있다. 배열을 typeof로 실행해보면? => object라는 문자열 출력. > typeof ([ ]) "object" => 객체를 의미하는 object 출력 배열과 객체 const array = ['사과', '바나나', '망고', '딸기'] 배열에는 인덱스(index)와 요소(element)가 있다. array[0] -->..

들어가며 다른 프로그래밍 언어는 함수를 지정된 위치에서 만들어야 하지만, 자바스크립트는 '함수도 하나의 자료' 라는 개념을 가지고 있어 중간에 만들 수 있다. 이는 2010년 전후 등장한 비동기 프로그래밍을 이끌었고, 익명 함수는 문법적 가치를 크게 인정받아 다른 프로그래밍 언어로 전파되었다. 람다 또는 익명 함수라는 이름으로 기본 문법에 포함되었다. 콜백 함수 자바스크립트는 함수도 하나의 자료형이므로 매개변수로 전달할 수 있음. 이렇게 매개변수로 전달하는 함수 => 콜백함수 콜백 함수(1) : 선언적 함수 사용 // 함수 선언 function callThreeTimes(callback) { for (let i = 0; i < 3; i++) { callback(i) // callback이라는 매개변수는 ..

자바스크립트의 객체 자바스크립트는 프로토타입 기반 객체지향 프로그래밍 언어다. 원시값을 제외한 거의 모든 것이 객체로 분류되며 원시값과는 달리 객체는 변경이 가능한 값이다. 객체는 0개 이상의 프로퍼티들의 집합이다. 프로퍼티는 key와 value로 이루어져 있다. var obj = { name: 'JK Cho',//프로퍼티 location: 'Korea', //location은 key, Korea는 value }; 객체 생성 자바스크립트는 다른 객체지향 언어와는 달리 프로토타입 기반의 객체지향 언어로서 다양한 객체 생성 방법을 지원한다. 객체 리터럴 Object 생성자 함수 생성자 함수 Object.create Class 객체 리터럴을 이용한 객체 생성 코드의 경우 중괄호는 코드블럭이 아닌 값으로 평가된..