용성월드

유저스크립트 설정하기 // ==UserScript== // @name kakao-pg // @match https://pg-web.kakao.com/v1/*/info // @grant localStorage // ==/UserScript== @match: 유저 스크립트가 실행될 URL의 형태. * 는 모든 문자열로 대응이 가능한 와일드카드 문자입니다. 예를 들어 a*는 a, ab, abc 등 a로 시작하는 모든 글자를 의미합니다. @grant : 유저스크립트에게 줄 브라우저 권한. 여러분이 실습을 하며 필요하지 않고, 저의 경우 개인정보를 미리 localStorage 에 넣었기 때문에 사용했습니다. @name: 유저스크립트의 이름 일시적인 스크립트 주입에서 영구적으로 주입을 유지할려면 브라우저마다 다른 ..

DOM - 문서 객체 모델 - HTML을 프로그래밍적으로 다루기 위한 도구 - 문서의 논리적 구조, 문서가 접근되고 조작되는 방법을 정의 - 구조화된 노드와 속성, 기능을 가지고 있는 개체로 표현 - 웹페이지는 문서다. DOM 트리 - Tree 구조와 비슷함 - 위에서 아래로 노드가 쌓인다. doucument - 웹페이지의 document(문서) 객체 document.querySelector(""); - 해당 선택자를 가진 요소 ex) const 생년월일 = '840301' document.querySelector('#userBirth).value = 생년월일

이벤트 개념 브라우저에서의 이벤트란 사용자가 버튼을 클릭하거나 웹페이지가 로드되었을 때와 같은 것인데 브라우저는 이벤트를 감지할 수 있으며 이벤트 발생 시에 이를 통지함으로써 사용자가 웹페이지가 상호작용 할 수 있게 해준다. 이벤트가 발생하기 전에는 실행되지 않다가 이벤트가 발생되면 실행하는 함수를 이벤트 핸들러라 칭한다. 이벤트 루프와 동시성 브라우저는 단일 쓰레드에서 이벤트 드리븐 방식으로 동작한다. 단일 쓰레드이므로 한 번에 하나의 작업만을 처리할 것 같지만, 이벤트 루프를 통해 자바스크립트의 동시성(Concurrency)를 지원한다. Call Stack (호출 스택) 자바스크립트는 단 하나의 Call Stack을 가지고 있다. 함수가 호출되면 순차적으로 Call Stack에 쌓인다. 순차 실행되므..

Closure 클로저(closure)는 자바스크립트 고유의 개념이 아니라 함수를 일급 객체로 취급하는 함수형 프로그래밍 언어(Erlang, Scala, Haskell, Lisp ...)에서 사용되는 특성이다. MDN은 클로저를 다음과 같이 정의하고 있다. 클로저는 함수와 그 함수가 선언됐을 때의 렉시컬 환경(Lexical environment)과의 조합이다. function outerFunc() { var x = 10; var innerFunc = function () { console.log(x); }; innerFunc(); } outerFunc(); // 10 위 예제에서 innerFunc은 outerFunc에서 정의된 x를 사용할 수 있는데, 이는 자신이 속한 렉시컬 스코프를 참조할 수 있기 때문..

스코프와 this 스코프 스코프는 참조 대상 식별자(identifier, 변수, 함수의 이름과 같이 어떤 대상을 다른 대상과 구분하여 식별할 수 있는 유일한 이름)를 찾아내기 위한 규칙이다. var x = 'global'; function foo () { var x = 'function scope'; console.log(x); } foo(); // ? console.log(x); // ? 위 예제에서 전역에 선언된 변수 x는 어디에든 참조할 수 있으나, 함수 foo 내에서 선언된 변수 x는 함수 foo 내부에서만 참조할 수 있고 함수 외부에서는 참조할 수 없다. 스코프가 없다면 같은 식별자 이름은 충돌을 일으키므로 프로그램 전체에서 하나밖에 사용할 수 없다. 스코프의 구분 JS에서 스코프는 2가지로 나..

기본 문법 변수 값을 할당하고 저장된 값을 참조하기 위해 사용한다. 메모리상 주소 값 프로그램에 의해 조작 될 수 있는 대상 JS가 지원하는 데이터 타입 Primitive data type number string boolean null undefined symbol (ECMAscript 6) Object data type object 변수 선언시 데이터 타입을 미리 지정하지 않는다. 연산자 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입 연산 등을 수행해 하나의 값을 만든다. 피연산자 : 연산의 대상 피연산자 타입은 반드시 일치할 필요가 없다. JS는 암묵적 타입 강제 변환을 통해 연산을 수행한다. 키워드 수행할 동작을 규정하는 것 var, function, while ... 주석 작성..

자바스크립트란 자바스크립트의 탄생 정적인 HTML을 동적으로 표현하기 위해 경량의 프로그래밍 언어인 자바스크립트를 도입. HTML, CSS와 함께 웹을 구성하는 요소 중 하나로 웹 브라우저에서 동작하는 유일한 프로그래밍 언어이다. 현재 모든 브라우저의 표준 프로그래밍 언어가 되었다. 물론 이전에 경쟁적으로 개발하며 파편화되었었다. 크로스 브라우징 이슈 (브라우저에 따라 웹 페이지가 정상 동작하지 않음)를 막기위해 ECMA 인터네셔널에 자바스크립트의 표준화를 요청 1997년 7월, 표준 자바스크립트 초판 ECMAScript 1의 명세가 완성된다. ❗️ 초창기 자바스크립트는 웹 페이지의 보조적인 기능을 수행하기 용도 이 시기에 로직은 웹 서버에서 대부분 수행, 브라우저는 HTML/CSS를 렌더링하는 수준이었..