일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 안드로이드
- Router
- vue.js
- 뷰
- 세션스토리지
- 자바스크립트 #javascript #렌더링 #렌더링순서
- 예외처리
- 렌더링 최적화
- 세션
- lazy loading
- virtual dom
- VUE
- frontend
- vuetify
- 장고
- 프론트엔드
- 주니어 개발자
- jest
- vue-router
- NavigationDuplicated
- DOM
- 라우터
- cubic-bezier
- webpack
- vue #vue.js #font #web-font
- 성능 최적화
- css
- Django
- 로컬스토리지
- Transition
- Today
- Total
목록전체 글 (59)
한준호
다음 1 에서 출력될 값을 예측해보자 var x = 'global'; function foo() { console.log(x); // ① var x = 'local'; } foo(); console.log(x); // global foo 함수 내부에서 선언된 지역변수 x는 1의 시점에 이미 선언되었고 undefined로 초기화되어있다(호이스팅). 따라서 전역 변수 x를 참조하는 것이 아니라 지역 변수 x를 참조해 값을 출력한다. 이처럼 호이스팅은 스코프를 단위로 동작한다. 호이스팅은 변수 선언이 스코프의 선두로 끌여 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 말한다. ■전역 변수의 생명 주기 함수와 달리 전역 코드는 명시적인 호출 없이 실행된다. var 키워드로 선언한 전역 변수는 전역 객체의 프..

■스코프 - 모든 식별자(변수 이름, 함수 이름, 클래스 이름 등)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정된다. - 식별자가 유효한 범위 스코프 개념이 없다면 같은 이름을 갖는 변수는 충돌을 일으키므로 프로그램 전채에서 하나밖에 사용할 수 없다. ■스코프 종류 구분 설명 스코프 변수 전역 코드의 가장 바깥 영역 전역 스코프 전역 변수 지역 함수 몸체 내부 지역 스코프 지역 변수 전역에서 선언된 변수는 전역 스코프를 갖는 전역 변수 => 어디서든지 참조할 수 있다. 지역에서 선언된 변수는 지역 스코프를 갖는 지역 변수 => 자신의 지역 스코프와 하위 지역 스코프에서 유효하다. ■스코프 체인 중첩 함수 : 함수 몸체 내부에서 정의한 함수 외부 함수 : 중첩 ..
함수는 스코프, 실행 컨텍스트, 클로저, 생성자 함수에 의한 객제 생성, 메서드, this, 프로토타입, 모듈화 등 자바스크립트 핵심 개념과 관련이 깊다. 함수를 사용하는 이유 => 코드의 재사용성 -유지보수의 편의성을 높이고 코드의 신뢰성을 높인다. -코드의 가독성을 높인다. 함수 리터럴 함수 이름 함수 이름은 식별자다. 식별자 네이밍을 준수해야 한다. 함수 이름은 생략할 수 있다. (named function anonymous function) 함수 이름은 함수 몸체 내에서만 참조할 수 있는 식별자다. 매개변수 목록 0개 이상의 매개변수를 소괄호로 감싸고 쉼표로 구분 매개변수 목록은 순서에 의미가 있다 매개변수는 함수 몸체 내에서 변수와 동일하게 취급. 식별자 네이밍을 준수한다 함수 몸체 실행 단위로..
■원시타입과 객체타입 - 원시 값은 변경 불가능하지만 객체는 변경 가능하다. - 원시 값을 변수에 할당하면 변수(메모리)에는 실제 값이 저장되지만 객체를 변수에 할당하면 변수(메모리)에는 참조 값이 저장된다. - 원시 값은 값에 의한 전달, 객체는 참조에 의한 전달이다. var str = 'string'; // 문자열은 유사 배열이므로 배열과 유사하게 인덱스를 사용해 각 문자에 접근할 수 있다. // 하지만 문자열은 원시값이므로 변경할 수 없다. 이때 에러가 발생하지 않는다. str[0] = 'S'; console.log(str); // string c와 다르게 자바스크립트는 문자열이라는 원시 타입을 제공한다. 변수에 문자열을 할당하면 변수는 메모리 공간의 첫번째 메모리 주소를 가리킨다. 변수의 재할당이..
■자바스크립트는 객체 기반 프로그래밍 언어이다. - 원시 값을 제외한 나머지 값(함수, 배열, 정규표현식 등)은 모두 객체이다. - 원시 값은 변경 불가능한 값이지만 객체는 변경 가능한 값이다. - 객체는 0개 이상의 프로퍼티로 구성된 집합이며 프로퍼티는 키(key)와 값(value)으로 구성된다. ■자바스크립트는 프로토타입 기반 객체지향 언어로 클래스 기반 객체지향 언어와 달리 다양한 객체 생성 방법을 지원한다. - 객체 지향 함수는 new연산자와 함께 생성자를 호출하여 인스턴스를 생성한다. 인스턴스: 클래스에 의해 생성되어 메모리에 올라간 것 클래스: 인스턴스를 생성하기 위한 템플릿 - 객체 리터럴, Object 생성자 함수, 생성자 함수, Object.create 메서드, 클래스 ... - 식별자 ..
■명시적 타입 변환(타입 캐스팅) 개발자가 의도적으로 값의 타입을 변환 하는 것 ※문자열 타입으로 변환 1. String 생성자 함수를 new 연산자 없이 호출 2. Object.prototype.toString 메서드 3.문자열 연결 연산자 // 1. String 생성자 함수를 new 연산자 없이 호출하는 방법 // 숫자 타입 => 문자열 타입 String(1); // -> "1" String(NaN); // -> "NaN" String(Infinity); // -> "Infinity" // 불리언 타입 => 문자열 타입 String(true); // -> "true" String(false); // -> "false" // 2. Object.prototype.toString 메서드를 사용하는 방법 /..
레이블문 : 식별자가 붙은 문 foo: { console.log(1); break foo; console.log(2); } console.log("Done"); // 1 // "Done" 중첩된 for문의 내부 for문에서 break문을 실행하면 내부 for문을 탈출하여 외부 for문으로 진입한다. 이때 내부 for문이 아닌 외부 for문을 탈출하려면 레이블 문을 사용한다. outer: for (var i = 0; i < 3; i++) { for (var j = 0; j < 3; j++) { if (i + j === 3) break outer; console.log(`inner [${i}, ${j}]`); } } console.log("Done"); // inner [0, 0] // inner [0, 1..
숫자 타입이 아닌 피연산자에 + 단항 연산자를 사용하면 피연산자를 숫자 타입으로 변환한다. var x = "1"; // 문자를 숫자 타입으로 변환 console.log(+x); // 1 // 부수 효과 없음 console.log(x); // 1 x = true; // 불리언 값을 숫자 타입으로 변환 console.log(+x); // 1 // 부수 효과 없음 console.log(x); // true x = false; // 불리언 값을 숫자 타입으로 변환 console.log(+x); // 0 // 부수 효과 없음 console.log(x); // false x = "Hello"; // 변환 불가 console.log(+x); // Nan // 부수 효과 없음 console.log(x); // "Hel..

세션과 쿠키는 HTTP 프로토콜 기반이기 때문에 이를 이해하기 위해서는 http의 특성에 대해 이해하는 것이 좋다. ■HTTP => 비연결성 비상태성 서버의 자원을 절약하기 위해 HTTP는 연결 상태를 유지하지 않고 연결 해제 후에도 상태 정보를 저장하지 않음. 1. 비연결성 클라이언트가 서버에 요청했을 때 Response를 보낸 후 연결을 끊는 처리방식 2. 비상태성 클라이언트와 첫번째 통신에서 주고받은 데이터를 이후 통신에서 유지하지 않는다. 그러나 브라우저를 사용하다보면 자동 로그인과 같은 기능을 이용할 수 있는데(또는 이용해야 하는데) 바로 쿠키와 세션을 활용한 것이다. 쿠키 세션 저장 위치 클라이언트(PC) 웹서버 저장 형식 String Object 만료 시점 쿠키 저장시 설정함(브라우저 꺼져도..