분류 전체보기(20)
-
[JavaScript] DOM(Document Objecet Model)
DOM - 웹문서를 브라우저에 렌더링 하려면 웹 문서를 로드한 후, 파싱하여 웹 문서를 브라우저가 이해할 수 있는 구조로 구성하여 메모리에 적재해야한다. - DOM은 네종류의 노드로 구성된다. 문서노드(Document Node) 요소 노드 (Element Node) 어트리뷰트 노드(Attribute Node) 텍스트 노드(Text Node) - 모든 요소와 요소의 어트리뷰트, 텍스트를 각각의 객체로 만들고(파싱하여) 이들을 트리 구조로 구성한 것이 DOM이다. - DOM은 HTML 요소를 Object처럼 조작 할 수 있는 Model이다. 따라서 웹 페이지를 동적으로 움직일수 있게 만들 수 있다. - DOM은 document객체에 구현되어있기 때문에 js어디에서나 호출이 가능하다. console.log(d..
2022.07.14 -
[JavaScript] 배열, 객체
코딩하면서 모르는 내장함수가 있거나 헷갈릴때마다 정리예정.. # 배열 - 빈 배열인지 검사 let arr1 = []; console.log(arr1.length === 0) // true console.log(arr1 === [])// false -> arr1과 []의 주소값이 다르기 때문에 false라고 나온다. - 유사 배열 객체 (Array.form return value) https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/from //특정 데이터로 부터 배열을 만듬. console.log(Array.from('foo')); // expected output: Array ["f", "o", "o"] ..
2022.07.14 -
[JavaScript] 호이스팅(Hoisting)
# Hoisting - 코드를 실행하기 전 실행 가능한 코드를 형상화 하고 구분하는 과정을 거치는데 이 과정에서 var, let, const, function등 을 스코프에 등록을 한다. - 위의 과정 덕분에 해당 코드가 실행전에 이미 변수 or 함수 선언이 되어 있기 때문에 선언문보다 호출문이 먼저 나와도 오류 없이 동작이 가능하다. 그러나 var키워드로 선언한 문장만 오류가나지 않고 값은 undefined인 상태이다. - const는 재할당이 불가능 하기때문에 호이스팅현상이 일어날 수 없다. - let, const는 선언만 메모리에 저장이되고 초기화 되지 않은 상태이기 때문에 변수를 참조할 수 없다. 따라서 에러가 난다. /* 정상 작동 */ console.log(text); //undefined t..
2022.07.13 -
[npm] npm, Package.json에 관하여
# NPM - node package manager 으로 남이 만들어 놓은 프로젝트에서 필요한 라이브러리, 모듈들을 다운 받기위한 모듈 스토어. npm말고도 다양한 모듈 스토어가 있다. 예) MacOs - brew , Linux - apt # Package.json - npm모듈을 이용하기 위해 해당 모듈에 대한 정보를 담은 파일. 프로젝트 전반에 관한 정보를 가지고 있다. //package.json { /* 프로젝트에 관한 정보 */ "name": "modern-javascript-koans", "version": "1.0.0", "description": "", "main": "index.js", /* CLI에서 사용가능한 명령어 */ "scripts": { "test": "mocha modern-j..
2022.07.13 -
[JavaScript] 블록 스코프 vs 함수 스코프
# 스코프 - 특정 범위에서 다른 범위에 있는 변수에 접근할 수 있는 범위 - 전역 스코프, 지역 스코프로 나뉜다 (전역 변수, 지역변수 느낌) # 지역스코프 - 함수 스코프와 블록 스코프로 나뉜다. - 함수 스코프는 함수에서 선언한 변수는 해당 함수 내에서만 접근이 가능하다. var global = 10; //전역스코프 function func1(){ let a = 1; //지역 스코프 } if(a!==global){ var global2 = "전역변수"; } console.log(a) //error! console.log(global) // 10 console.log(global2) // 전역변수 # var, let ,const의 스코프 차이 function func2(){ for(var i = 0 ..
2022.07.13 -
[JavaScript] 클로져
MSN 정의 : 함수와 함수가 선언된 어휘적(lexical) 환경의 조합을 말한다. 이때의 환경은 클로저가 생성된 시점의 유효 범위 내에 있는 모든 지역변수로 구성된다. - 클로저 함수란 외부 함수의 컨텍스트에 접근할 수 있는 내부 함수를 뜻한다. : 이 현상이 없으면 클로저라고 할수가 없다. 꼭 외부함수의 컨텍스트에 접근하는 무언가가 있어야 한다. - 데이터를 보존하는 함수다. : 외부 함수의 실행이 끝나더라도 외부 함수 내의 변수가 메모리에 저장이 된다. (메모리 해제 전까지 할당) - 현업에서는 코드가 방대하기 때문에 특정 기능에서 다른 부분을 참고 하기보다는 그자체에서 해결하기위해서 클로져를 쓴다. - Closure는 일급함수로서 전달할 수 있는 함수인데, 함수를 이리 저리 전달해서 사용할 때, ..
2022.07.12