자바스크립트 6

[Javascript] this 함수, 메서드 차이 (2)

실행컨텍스트를 활성화할 당시에 this가 지정되지 않을경우 this는 전역객체를 가리킨다고 이전에도 설명한바 있다. 이를 더글라스 크락포드(자바스크립트 언어 개발 참여자, json포멧 보급 등)는 명백한 설계상 오류 라고 지적했다. 이에 대해서 알아보고자한다. 내부함수에서의 this var obj1 = { outer: function(){ console.log(this) // (1) var innerFunc = function(){ console.log(this); // (2),(3) } innerFunc(); var obj2 = { innerMethod: innerFunc }; obj2.innerMethod(); } }; obj1.outer(); 다음과 같이 this를 함수내에서 console.log ..

[Javascript] this, 전역변수, 전역객체 feat . configurable, defineProperty()

this this는 실행 컨텍스트가 생성될때 함께 결정된다. 즉 this는 함수를 호출할 때 결정된다. 상황마다 this값이 달라진다. 전역공간에서 this는 전역 객체이고 브라우저환경에서 전역객체는 window, node.js 환경에서는 global 이다. 브라우저환경 console.log(this); console.log(window); console.log(this===window); //true Node.js환경 console.log(this); console.log(global); console.log(this===global); //true 전역변수를 선언하면 자바스크립트 엔진은 이를 전역객체의 프로퍼티로도 할당한다. var a = 1; console.log(a); // 1 console.lo..

[Javascript] 깊은복사, 얕은복사

객체를 복사할때 객체안에 직접적인 프로퍼티에 해당한다면 (1차복사, 얕은복사)값만 복사하여 복사한 객체의 프로퍼티값을 바꾸거나 원본객체의 프로퍼티값을 바꿔도 서로 같은것을 참조하지않기 때문에 서로 다른값의 프로퍼티가 된다. 하지만 객체 안의 프로퍼티가 또다른 객체를 가지고 있다면(2차 복사, 깊은복사) 이는 깊은 복사가 필요하다. 만약 깊은복사를 하지않는다면 원본객체에서 값을 바꾸면 복사된 객체에서도 값이 바뀌게 된다. 즉 불변객체를 만들어줘야한다. 이때 깊은 복사하는 방법은 몇가지 있다. 1. 재귀함수 var copyObject = function(target){ var result ={}; if(typeof target==='object'&& target!==null){ for(var prop in ..

[TIL] XML, JSX, Babel(바벨)

리액트를 사용하면 JSX 문법을 자연스럽게 접하게 된다. 막상 쓰는법은 알지만 이것이 정확히 무슨뜻이고 무슨 원리이고 어떤 배경이 있는지는 자세히 알지못했다. 풀어쓰면 Javascript XML 인데 이때 XML은 html과 비슷하지만 다른 확장성 마크업 언어이다. 따라서 무엇이 JSX이고 그안에 있는 XML 은 무엇인지 정리해보기로 했다. XML eXtensible Markup Language 약자이며 확장성 마크업 언어 이다. 보통 XML 형태는 html 태그와 비슷하지만 분명한 차이점이 많이 존재한다. XML은 data를 전달하는 데에 포커스를 맞춘 언어이고 HTML은 data를 표현하는 데에 포커스를 맞춘언어이다. XML은 HTML과 달리 tag가 미리 정의 되어 있지 않다. 장점으로는 문서 자체..

TIL 2022.02.15

Today I Learned(TIL) 1

오늘 항해99 1일차를 하며 프로젝트 구상을 했고 정신없는 하루가 지났다. 같이 이야기하고 공유하면서 내가 무슨부분이 부족한지 체크를했고 따로 공부하여 개념을 정리하기로했다. 웹개발 종합반을 복습하면서 헷갈리거나 까먹고 잘알지 못한걸 자기 공부때 개념들을 아래와같이 정리하였다. jquery 는 javascript 로 이루워진 라이브러리 이다. Ajax 는 query 안에 있는 asynchronous Javascript And XML 의 약자 기술이다. 한국어로는 비동기적 자바스크립트 그리고 XML 라는 뜻으로, 보통 동기적인 경우는 웹 화면을 재 로딩하면서 html, css, js 를 다시 다 불러온다 하지만 ajax는 웹 화면을 갱신하지 않고 필요한 데이터를 서버로 보내고 가져오는 방법을 말한다 보통 ..

항해/항해99 2021.11.01

스파르타코딩 종합반 1주차 끝

현재 많은 시간을 여기에 투자할수없어 간단한 일기식으로 쓰고 나중에 제대로 정리하자. 순서대로 html, css, javascript 순으로 간단하게 원리를 배우고 간단한 웹만들기를 통해 응용하는법 찾아서 쓰는법을 배웠다. 기본적인 태그, class, style, div, script 등등 많이 써보고 배운거같다. bootstrap을 통해 실질적으로 이미 만들어진 내용을 가져와쓰는 것 또한 알게되었다. font 글씨체를 구글폰트에서 가져와 쓰고, bootstrap 을 통해 목록이나 글상자 등을 잘 알게 되었다.

항해/항해99 2021.10.20