일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- Linux 파일 관리 명령어
- AWS EC2 서버 만들기
- Logback
- JavaScript EventLoop
- EC2 zsh
- EC2 Apache2
- Linux mkdir
- Linux 디렉터리 역할
- Linux apt
- EC2 HTTP 호스팅
- Navigation Pattern
- linux background
- Linux cat
- linux foreground
- Linux rmdir
- 자바스크립트 이벤트 루프
- EC2 oh my zsh
- Linux ls
- 서버의 서비스 방식
- Linux oh my zsh
- Linux apt-get
- Linux 디렉터리 명령어
- Linux 디렉터리 구조
- 자바스크립트 런타임
- Linux cd
- JavaScript 실행 디버깅
- javascript 정렬
- Linux pwd
- HTTP Web Server
- javascript scope
- Today
- Total
목록JavaScript (36)
HyunJun 기술 블로그
1. This 기본적으로 this는 자기 자신을 가리키는 키워드이다. 1) 전역 스코프 전역 스코프에서의 this는 전역 객체인 window 객체를 가리킨다. 2) 객체 this 객체 내의 this는 객체 자기 자신을 가리킨다. 3) 인스턴스 this 클래스에서 this를 사용하고 클래스를 통해서 인스턴스를 만들었을 때의 인스턴스로 접근했을 때의 this는 클래스 그 자체가 아닌, 인스턴스를 가리킨다. 4) 프로토타입 this 기본적으로 클래스와 같이 동작하지만, 화살표 함수에 있어서의 차이가 좀 있다. 화살표 함수의 경우 this가 인스턴스를 가리키는 게 아닌, window 즉 전역 객체를 가리키고 있다. 이것을 이해하려면 바인딩과 화살표 함수에서의 바인딩에 대해서 알아야 한다. 2. bind(bind..
1. Prototype based VS Class based 기본적으로 자바스크립트는 프로토타입 기반으로 시작했고, 프로토타입 기반의 언어이다. Class는 ES6에서 나온 기능이기 때문에, 클래스도 내부적으로 조금의 차이만 있을 뿐, 결국 프로토타입을 활용해서 만든 것이다. 1) Prototype based Prototype based란, 생성자 함수를 통한 인스턴스 생성 즉, 원래의 자바스크립트에서의 인스턴스 생성 방식을 말한다. 어떠한 특징을 가진 객체(프로토타입) 원형을 정의하고 해당 객체로부터 비슷한 객체들을 만들어 프로토타입으로 연결하여 사용한다. 여기서의 상속 개념은 프로토타입을 연결하여 프로토타입 객체에서 필요한 정보를 가지고 오는 상속의 개념이다. 2) Class based Class b..
1. 비동기 함수 비동기 함수란, 하나의 요청(함수 실행)에 따른 응답(리턴)을 즉시 처리하지 않아도, 동기적인 함수를 실행하는 동안 뒤에서 따로 실행되는 함수이다. 자바스크립트에서의 비동기 함수는 아래와 같은 특징을 가진다. 자바스크립트 런타임의 콜 스택 내에 글로벌 컨텍스트(전체적인 코드를 담고 있는 컨텍스트)까지 제거되어야 비동기 함수의 콜백 함수가 동작한다. 비동기 함수의 종류에는 아래와 같은 것들이 있다. setTimeout 이벤트 리스너 setInterval 2. setTimeout setTimeout 함수의 콜백 함수와, 지연 시간을 입력하면 해당 ms가 지난 뒤 콜백 함수의 내용이 동작한다. setTimeout(() => { console.log("내용"); },3000) 만약 아래처럼..
1. Form 버튼 1 버튼 2 버튼 3 form의 경우 기본적으로 submit 타입의 버튼 사용 시 폼 데이터 전송과 동시에 페이지 이동이 일어난다. form 태그 안의 button 태그들의 경우 타입을 지정해 주지 않으면 submit type으로 동작한다. onsubmit 핸들러를 통해 submit 할 때의 event에 preventDefault()를 사용해 주면, 폼의 동작(데이터 전송, 페이지 이동)을 막는다. document.getElementById("test-form").onsubmit = (e) => { e.preventDefault(); console.log(e); }; 2. Focus 활용 onfocus: input에 포커싱 됐을 때 동작한다. onblur: input에서 포커싱이 빠져..
1. Template literal 템플릿 리터럴은 ES6에서 나온 문자열 표기법이다. 템플릿 리터럴은 `` 백틱으로 감싼다. 템플릿 리터럴 안에서 String interpolation을 통해 변수, 삼항 연산자, 배열, 객체, 함수 등을 사용할 수 있다. let temp = 5678; let tempObj = { a: 1234, b: 5678, }; let templateLiteral = ` string ${1234}, ${temp} ${1 + 2 + 3 + 4} ${[1, 2, 3, 4]} ${tempObj.a} ${tempObj.b} `; console.log(templateLiteral);
1. Math 자바스크립트에서는 수학(수)과 관련된 여러 가지 편리한 프로퍼티, 메서드를 위해 Math를 제공한다. 1) Math.abs 숫자의 절대값을 반환한다. // absolute: 절대값 console.log(Math.abs(12345)); console.log(Math.abs(-12345)); 2) Math.min, Math.max 입력된 매개 변수 중, 최소값과 최대값을 찾는 메서드이다. console.log(Math.max(1, 120, -7, 0.6, 0, -900)); // 최대값을 찾는 메서드. console.log(Math.min(1, 120, -7, 0.6, 0, -900)); // 최소값을 찾는 메서드. 3) Math.pow 거듭제곱을 해주는 메서드이다. 거듭제곱 연산자인 (**)..