반응형

프로그래밍/Javascript(ES6) 22

[Javascript/ECMAScript6/ES6] Truthy and Falsy

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 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); }..

[Javascript/ECMAScript6/ES6] 삼항 연산자

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

[Javascript/ECMAScript6/ES6] 프로토타입과 클래스

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 프로토타입과 클래스 객체 생성자 객체 생성자는 함수를 통해서 새로운 객체를 만들고 그 안에 넣고 싶은 값 혹은 함수들을 구현 할 수 있게 해줍니다. 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('고양이', '야옹이', '야옹');..

[Javascript/ECMAScript6/ES6] 배열 내장함수

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 배열 내장함수 forEach forEach 는 가장 쉬운 배열 내장함수입니다. 기존에 우리가 배웠던 for 문을 대체 시킬 수 있습니다. const superheroes = ['아이언맨', '캡틴 아메리카', '토르', '닥터 스트레인지']; 만약, 배열 안에 있는 모든 원소들을 모두 출력해야 한다면 for 문을 사용하여 다음과 같이 구현 할 수 있는데요, const superheroes = ['아이언맨', '캡틴 아메리카', '토르', '닥터 스트레인지']; for (let i = 0; i < superheroes.length;..

[Javascript/ECMAScript6/ES6] 반복문

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 반복문 반복문은 특정 작업을 반복적으로 할 때 사용할 수 있는 구문입니다. for for 문은 가장 기본적인 반복문입니다. 특정 값에 변화를 주어가면서 우리가 정한 조건이 만족된다면 계속 반복합니다. for (let i = 0; i 0; i--) { console.log(i); } for 문은 이렇게 숫자에 변화를 주어가면서 반복적으로 ..

[Javascript/ECMAScript6/ES6] 배열

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 배열 객체는 한 변수 혹은 상수에 여러가지 정보를 담기 위함이였다면, 배열은 여러개의 항목들이 들어있는 리스트와 같습니다. const array = [1, 2, 3, 4, 5]; 배열을 선언 할 때에는 이렇게 [ ] 안에 감싸주시면 됩니다. 배열 안에는 어떤 값이던지 넣을 수 있습니다. const objects = [{ name: '멍멍이' }, { name: '야옹이' }]; 배열을 선언하고 나서, n 번째 항목을 조회하고 싶을 땐 다음과 같이 할 수 있습니다. objects[n]; 한번 다음 코드를 입력해보세요. const objects = [{ name: '멍멍이' }, { name: '..

[Javascript/ECMAScript6/ES6] 객체

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 객체 객체는 우리가 변수 혹은 상수를 사용하게 될 때 하나의 이름에 여러 종류의 값을 넣을 수 있게 해줍니다. const dog = { name: '멍멍이', age: 2 }; console.log(dog.name); console.log(dog.age); 결과물은 다음과 같습니다. 멍멍이 2 객체를 선언 할 때에는 이렇게 { } 문자 안에 원하는 값들을 넣어주면 됩니다. 값을 집어 넣을 때에는 키: 원하는 값 형태로 넣으며, 키에 해당하는 부분은 공백이 없어야합니다. 만약에 공백이 있어야 하는 상황이라면 이를 따옴표로 감싸서 문자열로 넣어주면 됩니다. const sample = { 'key with space':..

[Javascript/ECMAScript6/ES6] 함수

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 함수 함수는, 특정 코드를 하나의 명령으로 실행 할 수 있게 해주는 기능입니다. const a = 1; const b = 2; const sum = a + b; 한번, 이 작업을 함수로 만들어보겠습니다. function add(a, b) { return a + b; } const sum = add(1, 2); console.log(sum) 결과는 3이 됩니다. 함수를 만들 때는 function 키워드를 사용하며, 함수에서 어떤 값을 받아올지 정해주는데 이를 파라미터(매개변수)라고 부릅니다. 함수 내부에서 return 키워드를 사용하여 함수의 결과물을 지정 할 수 있습니다. 추가적으로, return 을 하게 되면 함수가 끝납니다. 만약 다음과 ..

[Javascript/ECMAScript6/ES6] 조건문

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 조건문 조건문을 사용하면 특정 조건이 만족됐을 때 특정 코드를 실행할 수 있습니다. if 문 가장 기본적인 조건문은 if 문입니다. if문은, "하다면 ~를 해라" 를 의미합니다. const a = 1; if (a + 1 === 2) { console.log('a + 1 이 2 입니다.'); } 결과는, "a + 1 이 2 입니다." 이 출력됩니다. 하지만, 만약에 여기서 a 를 0 으로 바꾼다면 어떨까요? const a = 0; if (a + 1 === 2) { console.log('a + 1 이 2 입니다.'); } 결과는, 아무것도 출력되지 않습니다. if문을 사용하면, 이렇게 특정 조건이 만족 될 때에만 ..

[Javascript/ECMAScript6/ES6] 연산자

이글은 "벨로퍼트"님의 동영상 강의를 보고 정리한 내용입니다. 연산자 연산자는 프로그래밍 언어에서 특정 연산을 하도록 하는 문자입니다. let value = 1; // 변수 선언 value = 2; // 대입 연산자 기서 두번째 줄에서 사용된 = 문자가 바로 연산자입니다. 연산자의 종류는 굉장히 많습니다. 그 중에서 = 는, 대입 연산자에 해당합니다. 첫번째 줄은 새로운 변수를 선언하는 것으로서, 대입 연산자에 해당하지 않습니다. 산술 연산자 산술 연산자는 사칙연산과 같은 작업을 하는 연산자를 의미합니다. +: 덧셈 -: 뺼셈 *: 곱셈 /: 나눗셈 위 4가지가 가장 기본적인 산술 연산자입니다. 이 외에도 몇가지가 더 있는데요, 먼저 위 연산자들을 한번 사용해봅시다. let a = 1 + 2; conso..

반응형