Programming 썸네일형 리스트형 [JavaScript] 원시값과 참조값 (Primitive & Reference) 자바스크립트의 데이터 타입은 그 작동 원리에 따라 두 종류로 나눌 수 있다. - 원시값 : string, number, boolean, null, undefined - 참조값 : object, symboll Primitive(원시값)과 Reference(참조값)의 차이점 모든 변수는 선언과 할당의 과정을 거친다. 선언: 메모리의 빈 공간에 식별자를 저장한다. * 선언된 순간 이 공간은 비어있다. 그러나 이 시점에서 변수를 호출하면 undefined가 출력되는데, 그 이유는 자바스크립트 엔진이 값이 없는 변수를 출력하려고 할 때 빈 공간 대신 undefined를 보여주기 때문이다. 할당: 변수의 데이터 영역에 주소를 연결한다. 원시값과 참조값의 차이는 이 주소의 차이에서 발생하는데, 간단히 말해서 원시값은.. 더보기 [Javascript] Executive context(실행 콘텍스트) 1. 실행 콘텍스트란 실행 가능한 코드가 실행되기 위해 필요한 환경 정보들을 모아놓은 객체이다. 실행 가능한 코드에는 전역코드, 함수코드, eval()코드가 있다. 실행에 필요한 환경 정보들 - 변수 (전역변수, 지역변수, 매개변수, 객체의 프로퍼티) - 함수 선언문 - 변수의 유효 범위(scope) - This binding 실행 컨텍스트는 스택(stack)의 형태로 되어있어 FILO(First In Last Out)의 프로세스로 작동한다. 즉, 가장 최근에 등록된 객체부터 먼저 실행되고 맨 처음에 등록된 객체가 가장 마지막으로 실행된다. 2. 실행 콘텍스트에 담기는 정보 다음 설명에서 LexicalEnvironment와 lexical environment라는 단어가 혼용되어 쓰일 것이다. (lexic.. 더보기 [JavaScript] This값이 판별되는 4가지 경우 함수 내부에 위치한 this의 값은 함수의 실행문에 의해 결정되고 함수 밖(전역 공간)에 위치한 this값은 전역객체가 된다. 함수의 실행문에 의해 this의 값이 결정되는 4가지의 경우와 그 특징들을 알아보자. *전역객체는 브라우저에서는 window, node.js환경에서는 global이다. 우선 전역 공간에서의 this의 값부터 살퍼보자. 아래 예시에 나온 모든 this값은 모두 전역공간에 정의되어있으므로 window이다. 특히 24, 25번 코드에 있는 객체 내부에 선언된 this값에 주의하자. 함수 내부에 포함되어있지 않기 때문에 this의 값은 전역 객체, 즉 window가 된다. 단, 이러한 this사용은 매우 좋지 않다. this는 함수 내부에서 실행 방식에 따라 다른 값을 가지며 코드의 재.. 더보기 [javaScript] map 메소드 자바스크립트의 객체를 간편하게 다룰 수 있게 해주는 map 메소드를 알아보고 Object(객체)와의 차이점도 알아보자. map 메소드 : 배열의 요소 각각을 callback 함수에 넣어 그 결과값으로 새로운 배열을 만들어주는 메소드이다. - map 메소드의 기본적인 문법 array.map( callbackFunction ( currentValue, index, array), thisArg) callbackFunction : 모든 배열의 요소에 실행할 function을 정의한다. callbackFuction은 reurn을 함축적으로 가지고있다. thisArg : callbackFunction 내에서 this로 사용될 값 (이게 몬소리지?) currentValue : 배열 내 현재 값 index : 배열 내.. 더보기 [JavaScript] textContent / innerText / innerHTML JavaScript에서 HTML문서의 요소를 가져오는 방법에는 textContent, innerText, innerHTML가 있다. 각각의 차이점을 알아보고 특정 상황에서 어떤 방법이 가장 좋을지 알아보자. 결론부터 말하자면, 오늘날에는 textContent를 사용하는 것이 더 현명한 방법이다. 그 이유를 알아보자. Hello World 위 코드에서 innerText로 반환되는 값은 "Hello"이고 textContent로 반환되는 값은 "Hello World"이다. This element is strong and has some super fun code! 이제 자바스크립트에서 id값 blog-test를 이용해 요소를 불러왔을 때 어떤 차이점이 있는지 비교해보자. 1. innerHTML document.. 더보기 [JavaScript] var vs. let vs. const 변수명을 효율적이고 올바르게 선언하기 위해서는 전역 변수의 사용을 최소화하여야 한다. 즉, 최대한 변수의 사용 가능한 범위를 최소화 하는 것이 좋다. poiemaweb.com/es6-block-scope#3-var-vs-let-vs-const let, const | PoiemaWeb ES5까지 변수를 선언할 수 있는 유일한 방법은 var 키워드를 사용하는 것이었다. var 키워드로 선언된 변수는 아래와 같은 특징이 있다. 이는 다른 언어와는 다른 특징으로 주의를 기울이지 않으면 poiemaweb.com 변수는 값의 위치(주소)를 기억하는 저장소이다. 값의 위치란 값이 위치하고 있는 메모리상의 주소를 의미한다. 즉, 변수란 값이 위치하고 있는 메모리 주소에 접근하기 위해 사람이 이해할 수 있는 언어로 명명.. 더보기 [JavaScript] 배열(Array) 1. 배열 배열은 다수의 데이터를 묶어서 처리해야 하는 경우에 유용하게 사용된다. 특히 배열과 for문을 같이 활용하면 100개 혹은 10000개 혹은 그 이상의 개수의 데이터들도 단 몇줄로 구현할 수 있게되고 인덱스를 비롯한 배열을 처리하는 여러가지 함수들을 통해 해당 데이터들에 손쉽게 접근하여 활용할 수 있게 된다. 즉 배열을 통해 코드를 훨씬 더 축소하여 효율적으로 사용할 수 있게 된다. - 배열을 선언하는 방법 var arr1 = New Array(); var arr2 = New Array(1, 2, 3); var arr3 = [1, 2, 3]; var arr4 = []; - 배열에 원소를 추가, 제거하는 방법(push, unshift, pop, shift) 배열에 원소를 추가하는 메소드는 두 가.. 더보기 [Javascript] DOM이란? | DOM의 선택자 | DOM tree | node vs element HTML을 위한 프로그래밍 인터페이스인 DOM(Documnet Object Model)에 대해 알아보자. issabmsangare.medium.com/nodes-vs-elements-in-the-dom-1865885d0b9b Nodes vs Elements in the DOM In my early JavaScript learning process, I came across two objects: ‘nodes’ and ‘elements’ which triggered some confusion in my mind. I… issabmsangare.medium.com developer.mozilla.org/ko/docs/Web/API/Document_Object_Model/Introduction DOM 소개 -.. 더보기 이전 1 2 3 4 5 다음
