전체 글 (10) 썸네일형 리스트형 자바스크립트 클래스2 클래스 필드 Class Field 클래스 블록 안에서 할당 연산자를 이용해 인스턴스 속성을 지정할 수 있는 문법 예시 class Counter { static initial = 0; // static class field count = Counter.initial; // class field inc() { return this.count++; } } const counter = new Counter(); console.log(counter.inc()); // 0 console.log(counter.inc()); // 1 Counter.initial = 10; console.log(new Counter().count); // 10 클래스 필드와 this class 블록은 새로운 블록 스코프를 형성하고, 내.. 자바스크립트 클래스 ES2015 이전 ES2015 이전에는 객채 생성을 위해 생성자를 사용 예시 function Person({name, age}) { this.name = name; this.age = age; } Person.prototype.introduce = function() { return `안녕하세요, 제 이름은 ${this.name}입니다.`; }; const person = new Person({name: '홍길동', age: 19}); console.log(person.introduce()); // 안녕하세요, 제 이름은 홍길동입니다. console.log(typeof Person); // function console.log(typeof Person.prototype.constructor); // fu.. 자바스크립트 자료구조와 자료형4 1. Stack 말 그대로 쌓는 자료를 쌓는 형식임 가장 나중에 들어간 자료가 가장 먼저 빠져나오는 후입선출 방식 - push, pop 등등 - 뒤로가기 2. Queue 먼저 집어넣은 데이터가 먼저나오는 선입선출 방식임 - 이메일전달 - 푸쉬알림 3. Tree 트리는 중첩된 자료구조임 자식을 가진 부모로 부터 출발함 4. Hash Table 임의의 길이의 테이터를 고정된 길이의 데이터로 매핑하는 함수 key value 시스템으로 작동 자바스크립트 자료구조와 자료형3 1. 배열과 메서드 앞에서 다뤘던 push, pop, shift,unshift를 제외하고 서술함 1.1 splice 배열에서 요소 하나만 지울때는 delete를 사용할 수 도 있음 예시 let arr = ["I", "go", "home"]; delete arr[1]; // "go"를 삭제 alert( arr[1] ); // undefined // delete를 써서 요소를 지우고 난 후 배열 --> arr = ["I", , "home"]; alert( arr.length ); // 3 delete로 요소를 지웠지만 배열의 요소는 그대로 3개이다. delete는 해당 키에 상응하는 값을 지우는 역할이지 배열 자체를 지우는 역할이 아님 배열 그 자체를 지우거나 추가,삭제,교체 등을 하려면 splice를 하면.. 자바스크립트 자료구조와 자료형2 1. map 맵은 키가 있는 데이를 저장하고 다양한 자료형을 사용가능 키를 객체로도 사용가능 함 예시 let john = { name: "John" }; // 고객의 가게 방문 횟수를 카운트 let visitsCountMap = new Map(); // john을 맵의 키로 사용 visitsCountMap.set(john, 123); alert( visitsCountMap.get(john) ); // 123 주요 메서드와 프로퍼티: new Map([iterable]) – 맵을 만듭니다. [key,value]쌍이 있는 iterable(예: 배열)을 선택적으로 넘길 수 있는데, 이때 넘긴 이터러블 객체는 맵 초기화에 사용됨 map.set(key, value) – 키를 이용해 값을 저장함 map.get(key.. 자바스크립트의 자료구조와 자료형1 자료형 1. 원시값의 메서드 자바스크립트는 원시값(문자열,숫자 등)을 마치 객체처럼 다룰 수 있게 해준다. 원시값에도 객체에서처럼 메서드를 호출할 수 있다. 원시값 !== 객채 원시값 - 원시형 값이다 - 원시형의 종류는 string, number, bigint*, boolean, symbol*, null, undefined * bright : Number 원시 값이 안정적으로 나타낼 수 있는 최대치인 2^53 - 1보다 큰 정수를 표현할 수 있는 내장 객체 *symbol : 심볼은 Symbol 함수를 호출함으로써 생성할 수 있다. 이때 생성되는 심볼은 변경이 불가능한 원시 값이다. Symbol 함수를 호출할 때 인자로 전달하는 문자열 값은 생성될 심볼에 대한 일종의 설명문 객체 - 프로퍼티에 다양한 종.. [자바스크립트] 정규표현식 및 이메일/비밀번호 유효성검사 - 비밀번호는 `8`자 이상 `20`자 이하로 구성합니다. - 영문 대/소문자, 숫자, 그리고 특수문자가 최소 `1`개 이상 포함되어야 합니다. - 특수문자는 `!`, `@`, `~` 만 입력 가능합니다. const pass = /^(?=.*?[A-Za-z])(?=.*?[0-9])(?=.*?[!@~]).{8,20}$/ // `P@ssw0rd20chars` => true // `qwe123` =>false 전화번호 정규 표현식 유효성 검사 const regex = /\d{3}-\d{4}-\d{4}/; // (\d는 숫자를 의미하고, {} 안의 숫자는 갯수를 의미한다.) regex.test('010-1234-5678') // true; regex.test('01-12-56') // false; 이메일 정규 .. [자바스크립트] URL에서 특정 파라미터 찾기 //.com/manage/newpost/?type=post const url = new URL(window.location.href) const urlParams = url.searchParams urlParams.get('type') //'post' 이전 1 2 다음