일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- 투포인터알고리즘 js
- 프로그래머스 K_Digital Training
- Vue3 Router
- 개발자 특강
- 모던 자바스크립트 Deep Dive
- 모던 자바스크립트 TIL
- useEffect return
- 백준 js
- KDT 프로그래머스
- Frontend Roadmap
- 프로그래머스 데브코스
- K_Digital Training
- 모던 javascript Deep Dive
- 모던 자바스크립트 딥다이브
- react 프로젝트 리팩토링
- frontend roadmap study
- 우테캠 회고록
- useRef 지역 변수
- 머쓱이
- 백준 node.js
- 인프런 자바스크립트 알고리즘 문제풀이
- Vue3
- TypeScript 문법 소개
- 모던 자바스크립트 Deep Dive TIL
- 리팩토링 회고
- KDT 프로그래머스 데브코스 프론트엔드
- 프로그래머스 데브코스 프론트엔드 TIL
- react customHook 예시
- 프로그래머스 데브코스 프론트엔드
- 프로그래머스 K_Digital Training 프론트엔드
- Today
- Total
목록모던 자바스크립트 Deep Dive (39)
프론트엔드 개발자의 기록 공간
정규 표현식은 일정한 패턴을 가진 문자열의 집합을 표현하기 위해 사용하는 형식 언어다. 정규 표현식은 문자열을 대상으로 패턴 매칭 기능을 제공한다. 패턴 매칭 기능이란 특정 패턴과 일치하는 문자열을 검색하거나 추출 또는 치환할 수 있는 기능을 말한다. // 사용자로부터 입력받은 휴대폰 전화번호 const tel = '010-1234-567팔'; // 정규 표현식 리터럴로 휴대폰 전화번호 패턴을 정의한다. const regExp = /^\d{3}-\d{4}-\d{4}$/; // tel이 휴대폰 전화번호 패턴에 매칭하는지 테스트(확인)한다. regExp.test(tel); // -> false 전화번호를 체크하는 형식이 필요할 때 위와 같이 정규표현식으로 패턴을 파악하면 간단하다. 하지만 이를 조건문을 통해..
표준 빌트인 객체인 Date는 날짜와 시간을 위한 메서드를 제공하는 빌트인 객체이면서 생성자 함수다. UTC(협정 세계시)는 국제 표준시를 말한다. UTC는 GMT(그리니치 평균시)로 불리기도 한다. 기술적인 표기에서는 UTC가 사용된다. KST(한국 표준시)는 UTC에 9시간을 더한 시간이다. 즉, 9시간이 더 빠르다. 현재 날짜와 시간은 자바스크립트 코드가 실행된 시스템의 시계에 의해 결정된다. ✍ Date 생성자 함수 Date는 생성자 함수다. Date 생성자 함수로 생성한 Date 객체는 내부적으로 날짜와 시간을 나타내는 정수값을 갖는다. Date 생성자 함수로 객체를 생성하는 방법은 다음과 같이 4가지가 있다. 📌 New Date() Date 생성자 함수를 인수 없이 new 연산자와 함께 호출하..
표준 빌트인 객체인 Math는 수학적인 상수와 함수를 위한 프로퍼티와 메서드를 제공한다. Math는 생성자 함수가 아니다. 따라서 Math는 정적 프로퍼티와 정적 메서드만 제공한다. ✍ Math 메서드 📌 Math.abs Math.abs 메서드는 인수로 전달된 숫자의 절대값을 반환한다. 절대값은 반드시 0 또는 양수이어야 한다. Math.abs(-1); // -> 1 Math.abs('-1'); // -> 1 Math.abs(''); // -> 0 Math.abs([]); // -> 0 Math.abs(null); // -> 0 Math.abs(undefined); // -> NaN Math.abs({}); // -> NaN Math.abs('string'); // -> NaN Math.abs(); //..
표준 빌트인 객체인 Number는 원시타입인 숫자를 다룰 때 유용한 프로퍼티와 메서드를 제공한다. ✍ Number 생성자 함수 Number 객체는 생성자 함수 객체다. 따라서 new 연산자와 함께 호출하여 Number 인스턴스를 생성 할 수 있다. Number 생성자 함수에 인수를 전달하지 않고 new 연산자와 함께 호출하면 [[NumberData]] 내부 슬롯에 0을 할당한 Number 래퍼 객체를 생성한다. const numObj = new Number(); console.log(numObj); // Number {[[PrimitiveValue]]: 0} const numObj = new Number(10); // 값을 할당한 경우 console.log(numObj); // Number {[[Prim..
배열은 여러 개의 값을 순차적으로 나열한 자료구조다. 자바스크립트는 배열을 다루기 위한 유용한 메서드를 다수 제공한다. 자바스크립트에 배열이라는 타입은 존재하지 않는다. 배열은 객체 타입이다. 하지만 일반 객체와는 구별되는 독특한 특징이 있다. 구분 객체 배열 구조 프로퍼티 키와 프로퍼티 값 인덱스와 요소 값의 참조 프로퍼티 키 인덱스 값의 순서 X O length 프로퍼티 X O 일반 객체와 배열을 구분하는 가장 명확한 차이는 "값의 순서"와 "length 프로퍼티"다. 인덱스로 표현되는 값의 순서와 length 프로퍼티를 갖는 배열은 반복문을 통해 순차적으로 값에 접근하기 적합한 자료구조다. ✍ 자바스크립트 배열은 배열이 아니다 자료구조에서 말하는 배열은 동일한 크기의 메모리 공간이 빈틈없이 연속적으..
✍ 함수의 구분 ES6 이전의 함수는 동일한 함수라도 다양한 형태로 호출할 수 있다. 일반적인 함수로서 호출할 수도 있고, new 연산자와 함께 호출하여 생성자 함수로서 호출할 수도 있으며, 객체에 바인딩되어 메서드로서 호출할 수도 있다. var foo = function () { return 1; }; // 일반적인 함수로서 호출 foo(); // -> 1 // 생성자 함수로서 호출 new foo(); // -> foo {} // 메서드로서 호출 var obj = { foo: foo }; obj.foo(); // -> 1 즉 ES6 이전의 모든 함수는 일반 함수로서 호출할 수 있는 것은 물론 생성자 함수로서 호출할 수 있다. 다시 말해, ES6 이전의 모든 함수는 callable이면서 construct..