본문 바로가기

JavaScript

(15)

[ JavaScript ] var, let, const 파헤치기. 자바스크립트에서 변수를 선언할 때 사용하는 키워드는 var, let, const 이렇게 총 3가지가 존재한다. 1. var var 키워드는 ES6 이전( let, const가 나오기 이전 )에 변수를 선언할 때 사용하던 키워드였다. var 키워드를 사용하여 변수를 선언하면 런타임 이전에 자바스크립트 엔진에 의해 암묵적으로 "선언"단계와 "초기화"단계를 거치게 된다. 선언 단계에서는 스코프에 변수 식별자를 등록해 자바스크립트 엔진에 변수의 존재를 알리고 그 즉시 초기화 단계에서 undefined로 변수를 초기화한다. var 키워드는 변수 블록을 고려하지 않고, 현재 함수(var 키워드를 선언한 함수)또는 전역 스코프 어디에서나 접근할 수 있는 변수를 선언한다. // 변수 a에 대해 선언. var a; 이렇..

[ JavaScript / Error ] 자바스크립트의 Error 객체 자바스크립트에서 런타임 오류가 발생하면 Error 객체를 던져주고 개발자들은 이를 통해 에러 처리를 해주고 디버깅을 할 수 있다. Error생성자 함수를 통해 에러 객체를 생성할 수 있다. Error 생성자 함수를 통해 생성된 에러 객체는 message 프로퍼티(Error 생성자 함수에 인수로 전달된 에러 메세지)와 stack 프로퍼티(에러를 발생시킨 콜스택의 호출 정보를 나타내는 문자열)를 갖는다. 아래의 표를 통해 자바스크립트의 표준 내장 오류 유형에 대해 알아보자. 유형(생성자 함수) 인스턴스 EvalError 전역 함수 eval()에서 발생하는 에러 객체 RangeError 숫자 변수나 매개변수가 유효 범위를 벗어났을 때 발생하는 에러 객체 ReferenceError 잘못된 참조에 대해 발생하는 ..

[ Javascript ] 원시 값과 객체의 차이에 대해 알아보기. 원시 값 (Primitive) MDN - 원시 값 설명 원시 값 - 용어 사전 | MDN JavaScript에서 원시 값(primitive, 또는 원시 자료형)이란 객체가 아니면서 메서드도 가지지 않는 데이터입니다. 원시 값에는 7종류, string, number (en-US), bigint (en-US), boolean, undefined, symbol, 그리고 null이 developer.mozilla.org 자바스크립트에서 원시 값은 객체가 아니고, 메서드를 가지지 않는 데이터로 아래와 같이 총 7가지의 종류가 존재한다. - string - number - bigint - boolean - undefined - symbol - null 원시 타입의 값은 변경 불가능한 값으로, 변수에 원시 값을 재할..

[ Javascript ] 자바스크립트 String 정리. String String은 표준 빌트인 객체로, 문자열(원시 타입)을 다룰 때 사용되는 프로퍼티와 메서드를 제공한다. String 특징 → String 생성자 함수에 인수를 전달하지 않고 new 연산자와 함께 호출하면 [[StringData]] 내부 슬롯에 빈 문자열을 할당한 String 래퍼 객체를 생성한다. → String 래퍼 객체는 배열처럼 length프로퍼티와 index(인덱스를 나타내는 숫자로 된 문자열의 프로퍼티 키)를 갖고, 각각의 문자를 프로퍼티 값으로 갖는 유사 배열 객체 이면서, 이터러블 이기 때문에 배열과 유사하게 index를 사용하여 각 문자에 접근이 가능하다. → 문자열에 index로 접근하여 프로퍼티 값을 변경해도 에러는 발생하지 않지만, 문자열은 원시 값이기 때문에 값이 변..

[ JavaScript / 연산자 ] 연산자를 이용하여 null 또는 undefined 처리 방법. 자바스크립트에서 데이터의 값이 유효한지 여부에 따라 프로퍼티를 참조 할 경우 연산자를 사용하여 처리하는 방법에 대해 정리하는 글-! 👉 우선 falsy값에 대해 알아보자-! 아래와 같은 아이들이 falsy값으로 분류된다. - false; - null; - NaN; - 0; - empty string ("" or '' or ``); - undefined. 1. 데이터가 null 또는 undefined 만 해당될 때 null 병합 연산자(??) 사용 let data = { name: null, age: 20 }; const userName = data.name ?? '이름을 입력해 주세요.'; console.log(userName); // 이름을 입력해 주세요. E11에서 도입된 null 병합 연산자(??)..

[ JavaScript / 정규표현식 ] 자바스크립트 정규표현식 정리 <1> 출처: MDN Web Docs 정규표현식 (정규식) - Regular expression 정규 표현식은 문자열에 나타나는 특정 문자 조합과 대응시키기 위해 사용되는 패턴으로, 자바스크립트에서 정규 표현식 또한 객체이다. 이 패턴들은 RegExp의 exec, test 메소드와 String의 match, replace, search, split 메소드와 함께 쓰인다. 정규 표현식을 만드는 방법 1. 정규식 리터럴을 사용하는 방법 ( 정규식이 값(=패턴)이 변하지 않는 상수일 때 사용하는 것을 추천 ) 슬래시( / )로 감싸는 패턴을 사용하여 만드는 방법이다. 정규식 리터럴을 사용하게 되면 스크립트가 불러와질 때 컴파일 된다. var re = /ab+c/; 2. RegExp 객체의 생성자 함수를 호출하는 방법..

[ JavaScript / 강제변환 ] 동등비교 '=='와 '===' 의 정확한 차이에 대하여 자바스크립트에서 동등 연산자는 == 연산자 (loose equlas) === 연산자 (strict equlas) 이렇게 2가지가 각각 쓰인다. 두 연산자 모두 값의 동등함을 비교하지만, loose(느슨한)와 strict(엄격한)이라는 차이가 있다. 이 '느슨한' 비교와 '엄격한' 비교의 정확한 차이는 무엇일까? You Don't Know JS를 읽기 전까지의 나는 '== 연산자'는 값이 동등한 지를 비교하고, '=== 연산자'는 값과 타입 또한 동등한 지 비교한다고 생각했었다. 하지만 이 책에서는 위와 같은 생각을 비슷하지만 정확하지 않다고 꼬집는다. 수많은 자바스크립트 책에서도 이렇게 쓰여있지만 불행하게도 다 틀렸다고 이야기한다. 이 책에서 나오는 '==연산자'와 '===연산자'의 정확한 정의는 ==는..

티스토리툴바