프론트지식 썸네일형 리스트형 자바스크립트 Prototype 이해하기 const numbers = [4, 2, 1];numbers.sort();console.log(numbers); // [1, 2, 4]Q. array 자료형에 .sort()를 붙일 수 있는 이유가 뭘까? Array.prototype 이라는 부모로부터 sort라는 메서드를 물려받았기 때문 = 상속자바스크립트에서 상속을 어떻게 구현하는지 살펴보자. Prototype의 뜻은? "원형"자바, 파이썬 등 클래스 기반 언어는 클래스를 정의하고 -> 객체를 생성한다.자바스크립트는 클래스가 없는 대신 프로토타입이 있다. (ES6에서 프로토타입을 class로 쓸 수 있게 문법 추가됨)자바스크립트는 프로토타입으로 클래스의 상속을 흉내낸다.(상속: 자식 클래스에서 부모 클래스의 모든 프로퍼티와 메서드를 사용할 수 있는 것).. 더보기 이벤트 루프와 비동기 이해하기 (자바스크립트 동작원리) 자바스크립트는 싱글 쓰레드 언어이다. 코드가 순차적으로 실행된다.(멀티 쓰레드: C/C++ 등)싱글 쓰레드의 단점은 무엇일까?처리하는데 엄청난 시간이 걸리는 함수가 있다고 치자 (ex. 복잡한 이미지 변환 알고리즘)함수가 끝날 때 까지 앱이 멈춘다.이러한 단점을 극복하는 해결책이 브라우저의 '비동기 처리'이다.(자바스크립트의 런타임 = 실행환경 = 브라우저)(동기: 순차적 / 비동기: 순차적이지 않음) 브라우저는 '이벤트 루프'를 통해 비동기 처리를 한다.브라우저의 구성요소를 보자.힙에서 메모리 할당이 발생한다. (변수, 함수 등..)함수 호출시 콜 스택에 쌓인 후, 쌓인 순서대로 실행된다. (= 싱글 쓰레드)이러한 함수 중 Web API에 해당하는 함수들은, 바로 실행되는 것이 아니라 콜백 큐에 쌓인다.. 더보기 RxJs를 쓰는 이유가 뭘까? 이직을 하면서 앵귤러 프로젝트에 참여하게 되었다.앵귤러는 RxJs를 사용하여 비동기 처리를 하는데, 리액트의 useEffect와 유사하다고 느꼈다.어떤 점이 유사할까?RxJs는 한마디로 옵저버 패턴이다.옵저버는 특정 객체의 상태변화를 관찰하고 (구독)객체에 상태변화가 있을때마다, 객체가 옵저버에게 자동 전파한다. 객체의 상태변화는 Observable이라는 형태로 전달된다.(상태변화 ex: 비동기 통신, 이벤트 처리, 타이머 등) RxJs의 장점은 여기서 나온다.- 모든 상태변화가 Observable이라는 형태로 통일되기 때문에, 일관적인 프로그래밍이 가능하다.- 또한 Observable은 immutable(변경불가)이므로 더 안전하다.상태변화를 구독하면 데이터 스트림을 결과값으로 얻게 된다.아래는 aja.. 더보기 [JavaScript] 만 19세 이상인지 확인하기 const birthdate = "19921202";const today = new Date();const yyyy = today.getFullYear();const mm = today.getMonth() = 190000); 더보기 비밀번호 정규표현식 분리하기 (영문대소문자/숫자특수문자/길이) 회사에서 회원가입 페이지를 개편하면서기존에 한번에 처리하던 비밀번호 유효성 검사를 3개로 분리하게 되었다. 비밀번호 input에 onchange 이벤트 리스너를 걸어서한 글자 입력할 때마다 유효성 검사 3개를 실시하여 -> 그 결과에 따라 input 아래 3개 문구의 색상을 수정한다. 1. 영문대소문자 포함여부 확인하는 정규표현식function passwordEngCheck (password) { let reg = /(?=.*?[a-z])(?=.*?[A-Z])/; return reg.test(password));} 2. 숫자 특수문자 포함여부 확인하는 정규표현식function passwordNumSpcCheck (password) { let reg = /(?=.*?[0-9])(?=.*?[#?!@$%.. 더보기 이전 1 다음
