MINYA

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. Promise 프로미스는 비동기 작업을 조금 더 편하게 처리 할 수 있도록 ES6 에 도입된 기능입니다. 이전에는 비동기 작업을 처리 할 때에는 콜백 함수로 처리를 해야 했었는데요, 콜백 함수로 처리를 하게 된다면 비동기 작업이 많아질 경우 코드가 쉽게 난잡해지게 되었습니다. 한번 숫자 n 을 파라미터로 받아와서 다섯번에 걸쳐 1초마다 1씩 더해서 출력하는 작업을 setTimeout 으로 구현해봅시다. function increaseAndPrint(n, callback) { setTimeout(() => { const increased = n + 1; console.log(increased); if (callback) { callback(in..

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. Scope Scope 란, 우리가 변수 혹은 함수를 선언하게 될 때 해당 변수 또는 함수가 유효한 범위를 의미합니다. Scope 는 총 3가지 종류가있습니다. Global (전역) Scope: 코드의 모든 범위에서 사용이 가능합니다. Function (함수) Scope: 함수 안에서만 사용이 가능합니다. Block (블록) Scope: if, for, switch 등 특정 블록 내부에서만 사용이 가능합니다. const value = 'hello!'; function myFunction() { console.log('myFunction: '); console.log(value); } function otherFunc..

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. spread 와 rest 이번에는 ES6 에서 도입된 spread 와 rest 문법에 입니다. 서로 완전히 다른 문법인데요, 은근히 좀 비슷합니다. spread 일단 spread 문법부터 알아봅시다. spread 라는 단어가 가지고 있는 의미는 펼치다, 퍼뜨리다 입니다. 이 문법을 사용하면, 객체 혹은 배열을 펼칠수있습니다. 예를 들어서 다음과 같은 객체들이 있다고 가정해봅시다. const slime = { name: '슬라임' }; const cuteSlime = { name: '슬라임', attribute: 'cute' }; const purpleCuteSlime = { name: '슬라임..

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 비구조화 할당 (구조분해) 문법 비구조화 할당 문법을 사용하면 다음과 같이 객체 안에 있는 값을 추출해서 변수 혹은 상수로 바로 선언해 줄 수있었습니다. const object = { a: 1, b: 2 }; const { a, b } = object; console.log(a); // 1 console.log(b); // 2 그리고, 함수의 파라미터에서도 비구조화 할당을 할 수 있었습니다. const object = { a: 1, b: 2 }; function print({ a, b }) { console.log(a); console.log(b); } print(object); 그런데 여기서 만약 b 값이 주어지지 않았다고 가정해봅시다. c..

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 조건문 더 스마트하게 사용해보자 특정 값이 여러 값중 하나인지 확인해야 할 때 만약, 여러분이 특정 값이 여러 값 중 하나인지 확인을 해야 하는 상황이 생겼다고 해봅시다. 그러면, 이러한 시도를 할 수도 있을 것입니다. function isAnimal(text) { return ( text === '고양이' || text === '개' || text === '거북이' || text === '너구리' ); } console.log(isAnimal('개')); // true console.log(isAnimal('노트북')); // false 비교해야 할 값이 ..

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 함수의 기본 파라미터 한번, 우리가 원의 넓이를 구하는 함수를 만들어보겠습니다. function calculateCircleArea(r) { return Math.PI * r * r; } const area = calculateCircleArea(4); console.log(area); // 50.26548245743669 여기서 Math.PI 는 원주율 파이(π) 값을 가르킵니다. 만약 우리가 이 함수에 r 값을 넣어주지 않으면 어떤 결과가 나타날까요? function calculateCircleArea(r) { return Math.PI * r * r; } const area = calculateCircleArea(); console.lo..

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 단축 평가 (short-circuit evaluation) 논리 계산법 true && true // true true && false // false true || false // true false || true // true 논리 연산자를 사용 할 때에는 무조건 우리가 true 혹은 false 값을 사용해야 되는 것은 아닙니다. 문자열이나 숫자, 객체를 사용 할 수도 있고, 해당 값이 Truthy 하냐 Falsy 하냐에 따라 결과가 달라집니다. 예를 들어서 다음과 같은 코드가 있다고 가정해보겠습니다. const dog = { name: '멍멍이' }; function getName(animal) { return animal...

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. Truthy and Falsy 이것은 자바스크립트 문법까지는 아니지만, 알아둬야 하는 개념입니다. Truthy: true 같은거... Falsy: false 같은거... 라고 이해를 하면 되는데요, 예를 들어서 다음과 같은 함수가 있다고 가정해봅시다. function print(person) { console.log(person.name); } const person = { name: 'John' }; print(person); 만약에 이러한 상황에서, 만약 print 함수가 다음과 같이 파라미터가 비어진 채로 실행됐다고 가정해봅시다. function print(person) { console.log(person.name); }..

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 삼항 연산자 이 문법은 ES6 문법은 아닙니다. 참고로 해주세요. const array = []; let text = ''; if (array.length === 0) { text = '배열이 비어있습니다.'; } else { text = '배열이 비어있지 않습니다.'; } console.log(text); 예를 들어 위와 같이 특정 조건에 따라 text 값이 달라야 하는 상황이 있다고 가정해봅시다. 그런 경우에는 다음과 같이 코드를 작성 할 수 있습니다. const array = []; let text = array.length === 0 ? '배열이 비어있습니다' : '배열이..

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 프로토타입과 클래스 객체 생성자 객체 생성자는 함수를 통해서 새로운 객체를 만들고 그 안에 넣고 싶은 값 혹은 함수들을 구현 할 수 있게 해줍니다. function Animal(type, name, sound) { this.type = type; this.name = name; this.sound = sound; this.say = function() { console.log(this.sound); }; } const dog = new Animal('개', '멍멍이', '멍멍'); const cat = new Animal('고양이', '야옹이', '야옹');..