본문 바로가기

📰 언어

(31)

정규 표현식 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. 정규 표현식을 사용하는 이유? 2. 정규 표현식 만들기 3. 정규식 패턴 3-1) 패턴 작성하기 정규식 표현식(더보기 클릭! : 특수 문자 사용 예시) 자주 사용되는 특수 문자(더보기 클릭! : 기타 특수 문자) 4. 그룹 4-1) 그룹화 4-2) 캡처(capturing) 정규표현식 테스트 사이트 내용을 이해하면서 실제로 적용해 보는 것이 좋습니다. 아래의 사이트들을 이용하여 정규식을 테스트해 봅시다. 단, 각 사이트의 설정된 환경이 다르기 때문에 일부 작동하지 않거나 자바스크립트에서 다루는 정규식과 다르게 작동할 수 있으므로 사이트에서 테스트한 정규식의 결과를 맹신하지 말고 자신의 환경에 맞는지 꼭 테스트하세요. https://regex101.c..

비동기적 프로그래밍(1) - 동기vs비동기, 콜백 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. 자바스크립트의 비동기적 프로그래밍 2. 콜백 2-1) 스코프와 비동기적 실행 2-2) 오류 우선 콜백 2-3) 콜백 헬 동기식 처리 모델(Synchronous processing model)은 직렬적으로 태스크(task)를 수행한다. 즉, 태스크는 순차적으로 실행되며 어떤 작업이 수행 중이면 다음 작업은 대기하게 된다. 서버에 데이터를 요청하고 데이터가 응답될 때까지 이후 태스크들은 블로킹(blocking, 작업 중단)된다. #동기식으로 동작 - 순차적으로 실행됨. function func1() { console.log('func1'); func2(); } function func2() { console.log('func2'); func3(); }..

ES6의 심볼, 이터레이터와 제네레이터 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. Symbol 2. 심볼의 생성 2-1) 대표적인 상용심볼 1. 이터레이터(Iteratoe) 1-1) 이터레이션 프로토콜 2. 제너레이터(generator) 1. Symbol ES6에서 새로 선보인 원시 타입이다. typeof Symbol(); // 'symbol' 객체에 Unique한 속성을 만들어 다른 라이브러리와의 충돌을 막기 위해 Symbol이 필요하다. 원래 객체의 속성 이름은 문자열로 표현했다. 그러나 새로 추가한 라이브러리가 Array 같이 범용적으로 쓰이는 타입을 확장했다고 했을 때, 내가 확장한 것과 같은 이름으로 확장했다면? 심볼은 Unique하기 때문에, description이 같아도 충돌하지 않는다. 내가 Array의 속성의 갯..

map과 set 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. Map 1-1) Map vs Object 2. WeakMap 2-2) WeakMap vs Map 3. Set 1. Map Map 객체는 요소의 삽입 순서대로 원소를 순회한다. for...of 반복문은 각 순회에서 [key, value]로 이루어진 배열을 반환한다. const u1 = {name : 'jackson'} const u2 = {name : 'olive'} //맵 생성 const userRoles = new Map(); //맵의 set() 사용해 사용자 역할 할당 ###### userRoles.set(u1, 'User') userRoles.set(u2, 'Admin') ###또는### userRoles .set(u1, 'User') .se..

객체지향 프로그래밍(OOP) 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. 객체지향 프로그래밍 용어 2. 자바스크립트의 언어적 특징 1. 객체 생성 2. 클래스(ES5 vs ES6) 생성 3. 인스턴스 생성 4. construnctor(생성자) 5. 프로토타입 체인과 메소드 정의 6. 상속 - 의사 클래스 패턴 상속, 프로토타입 패턴 상속 7. 캡슐화, 추상화, 다형성 1. 자바스크립트의 언어적 특징 자바스크립트는 멀티-패러다임 언어로 명령형(imperative), 함수형(functional), 프로토타입 기반(prototype-based) 객체지향 언어이다. 자바스크립트는 이미 생성된 인스턴스의 자료구조와 기능을 동적으로 변경할 수 있다는 특징이 있다. 객체 지향의 상속, 캡슐화(정보 은닉) 등의 개념은 프로토타입 체인..

객체 지향 언어 - 프로토타입 기반 언어(JS) 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 클래스 기반 언어 vs 프로토타입 기반 언어(JS) 1. property 2. 프로토타입 (개념 설명) 3. 프로토타입 기반 언어 객체 지향 언어는 크게 두 가지 줄기로 나눌수 있다. 클래스 기반 언어(C++, Java, C#, Ruby, Python 등) 프로토타입 기반 언어(JavaScript, ActionScript, JScript 등) 클래스 기반 & 프로토타입 기반 객체 지향 언어 자바스크립트의 모든 객체는 자신의 부모 역할을 담당하는 객체와 연결되어 있다. 그리고 이것은 (마치 객체 지향의 상속 개념과 같이) 부모 객체의 프로퍼티 또는 메소드를 상속받아 사용할 수 있게 한다. 이러한 부모 객체를 Prototype(프로토타입) 객체 또는 줄여서..

배열과 배열처리 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. 배열의 요소 조작 2. 배열 검색 3. 배열의 요소 변형 4. 배열 자체를 변형 5. 문자열 병합 배열의 요소 조작 배열에 요소 하나 추가/제거 push/pop(끝) unshift/shif(처음) 배열의 끝에 여러 요소 추가 concat 배열일부 가져오기 slice 임의의 위치에 요소 추가/제거 splice 배열 안에서 요소 교체하기 copyWithin 특정 값으로 배열 채우기 fill 배열 정렬 sort/reverse 배열 검색 조건에 맞는 요소의 인덱스 검색 indexOf/lastIndexOf 또는 findIndex 조건에 맞는 요소 검색 find some과 every 배열의 요소 변형 요소 변형, 사본 반환 map 요소 변형, 배열에서 필요한..

스코프(2) 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. 즉시 실행 함수, IIFE 2. 호이스팅 3. 사각지대와 스트릭트 모드 1. IIFE : 즉시 호출하는 함수 표현식 1-1) 즉시 실행 함수의 기본 형식 #일반적인 함수 표현식 const g = function 함수이름(){ //... } #즉시 실행 함수 표현식 (function () { //IIFE 바디 })() 1-2) 즉시 실행 함수의 종류 #1. 기명 즉시 실행 함수 (function square(x) { console.log(x*x); })(2); #2. 익명 즉시 실행 함수 (function (x) { console.log(x*x); })(2); #3. 변수에 즉시 실행 함수 저장 (mySquare =function (x) { cons..

스코프(1) 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. 스코프 2. 스코프 체인 3. 변수 숨기는 방법 3가지 4. 클로져 1. 스코프 : 변수의 유효 범위(어디까지 참조 가능한가) 1-1) 스코프의 종류 전역 스코프 : 코드 어디에서든 참조 가능(남용x, 의존x) 지역 스코프 : 함수 코드 블록이 만든 스코프로 함수 자신과 하위 함수에서만 참조 가능 함수 스코프 : 함수 내부에서 선언한 변수는 지역 변수이며 함수 외부에서 선언한 변수는 모두 전역 변수 블록 스코프 : 코드 블록 내부에서 선언한 변수는 지역 변수. len과 const로 선언된 변수는 그 변수를 둘러싼 아무 블록의 스코프에 속함. 1-2) 자바스크립트 스코프의 특징 함수 단위의 유효범위 : if문, for문 등 구문들이 사용되었을 때, ..

데이터 타입 & 함수 책 를 기본으로 배운 자바스크립트 내용입니다. 목차 1. 변수와 상수, 리터럴 2. 식별자 3. 자바스크립트의 값 - 원시 타입과 객체 1. 함수 선언 2. 함수 표현식, 화살표 표기법 3. 함수 호출, (call, apply, bind) 1. 변수와 상수, 리터럴 1-1) 변수(let)와 상수(const) : 초깃값 생략가능, 생략하면 undefined으로 대체됨 let/const 변수/상수이름; let/const 변수/상수이름 = 초깃값; let/const 변수/상수이름1 = 초깃값1, 변수/상수이름2 = 초깃값2; ※ 변수 vs 상수 우선 상수로 만들고 변하는게 자연스럽다고 생각되면 변수로 변경 예외) 상수x, 항상 변수인 경우 : 루프, 시간이 지나면서 값이 바뀌는 경우 1-2) 리터럴 : 값을 ..

이전 1 2 3 4 다음

티스토리툴바