JavaScript

Node.jsChrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임.Chrome V8 JavaScript 엔진: 자바스크립트 문법을 해석하고 실제로 동작시켜줄 수 있는 엔진JavaScript 런타임: JavaScript가 동작하는 환경자바스크립

01. NPM 개요 > NPM(Node Package Manager) 전 세계의 개발자들이 만든 다양한 기능(패키지, 모듈)들을 관리 > 패키지: 누군가 만들어놓은 기능을 우리의 프로젝트에 연결하여 완성할 수 있다. ex) Material Icons, Lodash,

package.json 파일에 scripts에 있는 test를 지우고 아래와 같이 변경해준다. 이후, 아래와 같이 입력하면 개발 서버를 실행할 수 있다.parcel은 타입스크립트를 지원한다. 하지만 브라우저에서 타입스크립트가 직접 동작하지 않기때문에 parcel이라는

Major: 기존 버전과 호환되지 않는 새로운 버전 (여기서는 4버전 이전인 3버전)Minor: 기존 버전과 호환되는기능이 추가된 버전Patch: 기존 버전과 호환되는 버그 및 오타 등이 수정된 버전^: Major 버전 안에서 가장 최신 버전으로 업데이트 가능여기서는

자바스크립트의 표준 이름 (ES = JS)초반 1997년 생겼다.6판이 2015년에 나오면서 인기를 끌기 시작했고 이때부터는 이름에 년도를 붙여서 매년 출시되고 있다.셋 중 하나 선택하면 된다.템플릿 리터럴: 마지막 백틱은 보간이라는 데이터를 문자 데이터 내부에 채워

나머지는 2로 나머지를 구해서 짝수, 홀수 구분하기에 좋다.두 결과가 동일

부정 연산자로 boolean 값을 반대로 바꿀 수 있다.부정 연산자는 여러개 사용가능하다Falsy 값인 0, null, undefined, NaN, 빈문자열에 부정 연산자를 사용하면 true가 된다.Truthy 데이터인 객체 데이터, 배열 데이터에 부정 연산자를 사용하

AND 연산자를 사용할 때 가운데 연산자를 기준으로 좌우의 값이 반환될 수도 있다.AND 연산자는 왼쪽에서부터 가장 먼저 만나는 거짓 데이터를 반환한다.만약 모두 다 참이라면 마지막 데이터를 반환한다.OR 연산자도 AND 연산자처럼 해석하는 방식이 정해졌다.OR 연산자

이런 상황에서 숫자 0을 거짓의 의미가 아닌 유효한 숫자 데이터로 사용하고 싶은 경우가 있다.Nullish 병합 연산자는 null, undefined를 제외한 나머지 모든 데이터를 만나면 반환하게 된다.코드를 간소화할 수 있어서 많이 사용된다.

대괄호 기호만 없어지고 안에 있는 내용 남겨 진다.

배열의 구조를 분해해서 각각의 변수에다가 재할당하는 것arr 배열에서 마지막 데이터 3만 필요하다면 구조 분해 할당에서 ,(쉼표)로 구분하고 마지막에만 변수를 할당해주면 된다. → 순서가 중요하다a에 첫번째 값만 할당하고 나머지를 rest에 할당하고 싶었는데 첫번째와

null 이나 undefined 또는 객체에 없는 변수를 점표기법으로 속성을 조회할 수 없는 상황에서는 선택적 체이닝을 사용할 수 있다.에러가 출력됐던 것이 에러 없이 undefined가 출력된 것을 볼 수 있다.userA에는 address에 city가 있지만 user

주의할 점: 각 케이스에 break를 적어주어야지만 각 케이스 코드를 실행하고 다름 케이스로 넘어가는 것을 방지한다.Swich 문을 사용할 때 기본적으로 break 키워드를 통해서 각 case의 동작이 마무리될 수 있도록 하지만 상황에 따라서 return 키워드를 사용

break가 실행되면 반복문 자체가 종료된다.현재 반복을 종료하고 다음 반복으로 넘어가게 한다.위 예시에서는 홀수일때만 출력하고 짝수 일때는 다음 반복문으로 넘어가게 한다.위 예시를 For of 반복문으로 표현할 수 있다.훨씬 간단하게 똑같은 결과를 만들 수 있다.fo

while문은 조건이 참일 경우 계속 반복되지만 거짓일 경우 반복이 멈취게 된다.무한 반복될 수 있기 때문에 조건이 거짓이 될 수 있도록 코드를 짜야한다.n은 0이고 0은 false 데이터이기 때문에 아무것도 출력되지 않는다.조건이 false 여도 n이 무엇인지 출력하

함수가 선언되어있는 부분의 유효한 범위 내에서 제일 꼭대기로 끌어올려서 동작하는 개념🎈 호이스팅은 함수 선언문에서만 발생하고 함수 표현식에서는 발생하지 않는다.

return 을 통해서 ‘Hello~’를 반환시킴과 동시에 함수를 종료 시켜서 return 이후에 코드인 console.log(’Wow’)는 동작하지 않는다.

매개 변수로 들어와야할 데이터가 들어오지 않으면 사용할 기본 값을 지정해줄 수 있다.두번째 코드와 같이 매개변수에서 구조 분해 할당을 하면 첫번 째 코드보다 간략하게 코드를 짤 수 있다....rest 처럼 매개변수에 전개 연산자를 이용해서 나머지 매개 변수로 사용할 수

ES6에서 새롭게 나온 문법이다. 이전보다 훨씬 더 단순하고 간결하게 함수 문법을 작성할 수 있다.위 코드를 아래와 같이 줄일 수 있다.return {} 와 함께 줄일 수 있어서 간단하게 작성할 수 있다.객체는 괄호로 감싸 주어야 한다.

원래는 함수를 호출해 주어야지만 함수가 동작한다.즉시실행함수로 작성하면 따로 호출할 필요없이 함수 선언과 동시에 호출되어 실행된다.

위 코드와 같이 파라미터로 함수를 전달하는 함수를 콜백 함수라고 한다.콜백 함수를 이용하면 위 코드와 같이 setTimeout을 이용해서 시간이 지연되는 코드를 유용하게 사용할 수 있다.콜백 함수를 이용해서 위와 같은 코드로 Loading…이라는 글자가 1초 동안 나오

함수가 자신을 다시 호출하는 함수로 재귀함수는 종료 조건이 없다면 무한 반복하기 때문에, 종료 조건이 무조건 있어야한다.계속 재귀함수를 돌아서 결국 userA의 값을 호출하게된다.

일정 시간이 지난 후에 원하는 함수를 예약 실행(호출)할 수 있게 하는 것일정 시간이 지난 후에 함수를 실행하는 방법func|code실행하고자 하는 코드로, 함수 또는 문자열 형태이다. 대개는 이 자리에 함수가 들어가며, 하위 호환성을 위해 문자열도 받을 수 있게 해놓

일반 함수의 this는 호출 위치에서 정의일반 함수this는 this는 호출 위치에서 정의되기 때문에 여기서 this는 getFullName가 호출될 때 붙어있는 user가 된다. 화살표 함수의 this는 자신이 선언한 함수(렉시컬) 범위에서 정의화살표 함수의 this

자바스크립트는 클래스기반 언어는 아니고 프로토타입 기반 언어이다하지만 그러한 개념과 상관없이 자바스크립트에서 클래스 방식을 사용할 수 있다.mdn 사이트에 Array에 대한 설명을 보면 위와 같이 메소드들 앞에 prototype이 있는 것을 볼 수 있다.Array 객체

위 코드처럼 prototypes 방식으로 작성한 코드를 ES6에서 새로 나온 Class방식으로 바꿔서 작성할 수 있다.첫번째 코드와 동일하게 동작한다. new라는 키워드로 함수처럼 호출해서 나온 인스턴스를 활용할 수 있다.

Getter: 값을 얻는 용도의 메소드Setter: 값을 지정하는 용도의 메소드fullName이라는 setter 함수를 통해 값을 받아 console.log하여 ‘Neo Anderson’이 출력되었지만 아직 jigu라는 객체의 firstName, lastName은 Ne

Array의 메소드 중에서 isArray는 다른 메소드들과 다르게 위 사진처럼 앞에 prototypes가 붙어 있지 않다. prototypes이 붙어 있는 메소드와 prototypes이 없는 메소드의 차이점은 무엇인지 알아보자.prototypes 메소드: prototy

어떤 클래스를 상속받은 인스턴스인지 확인할 수 있다.

instanceof라는 키워드로 각각의 클래스와 비교하게되면 해당하는 인스턴스의 정확한 클래스(C)와도 true가 출력되지만 그 클래스가 상속받고 있는 부모 클래스(A, B)들도 true가 출력된다.따라서, 한 인스턴스가 어느 클래스로 만들어진건지 확인하려면 const