JavaScript
-
실행컨텍스트란 ? 실행할 코드에 제공할 환경 정보들을 모아놓은 객체로, 자바스크립트의 동적언어로서의 성격을 가장 잘 파악할 수 있는 개념이다. 스택 : a,b,c,d 저장했다면 꺼낼때는 반대로 d,c,b,a 순으로 (깊은 우물 같은 구조) 큐: 양쪽이 모두 열려있는 파이프 ! 저장한 순서대로 꺼낼 수 있음 (크롬의 뒤로 가기 버튼은 큐인가 스택인가? 한번 생각해 보고 정리해보면 좋을 것 같다 !) 동일한 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고, 이를 콜 스택에 쌓아올렸다가 가장 위에 쌓여있는 컨텍스와 관련 있는 코드들을 실행하는 식으로 전체 코드의 환경과 순서를 보장한다. 스택 구조를 잘 생각해보면 한 실행 컨텍스트가 콜 스택 맨 위에 쌓이는 순간이 곧 현재 실행할..
[코어자바스크립트] 실행 컨텍스트실행컨텍스트란 ? 실행할 코드에 제공할 환경 정보들을 모아놓은 객체로, 자바스크립트의 동적언어로서의 성격을 가장 잘 파악할 수 있는 개념이다. 스택 : a,b,c,d 저장했다면 꺼낼때는 반대로 d,c,b,a 순으로 (깊은 우물 같은 구조) 큐: 양쪽이 모두 열려있는 파이프 ! 저장한 순서대로 꺼낼 수 있음 (크롬의 뒤로 가기 버튼은 큐인가 스택인가? 한번 생각해 보고 정리해보면 좋을 것 같다 !) 동일한 환경에 있는 코드들을 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고, 이를 콜 스택에 쌓아올렸다가 가장 위에 쌓여있는 컨텍스와 관련 있는 코드들을 실행하는 식으로 전체 코드의 환경과 순서를 보장한다. 스택 구조를 잘 생각해보면 한 실행 컨텍스트가 콜 스택 맨 위에 쌓이는 순간이 곧 현재 실행할..
2022.11.07 -
01. 데이터 타입의 종류 기본형 숫자(Number) 문자열(String) boolean null undefind symbol 참조형 객체 배열 함수 날짜 정규표현식 02. 데이터 타입에 관한 배경지식 식별자란? 어떤 데이터를 식별하는데 사용하는 이름으로 변수명이다. 변수란? 변할 수 있는 데이터(숫자, 문자열, 객체, 배열 )이다. 변수란 결국 변경가능한 데이터가 담길 수 있는 공간 또는 그릇이라 생각하면 된다. 03. 변수 선언과 데이터 할당 var a; a='abc' var a= 'abc'; 변수를 선언하고 데이터를 할당하면 해당위치에 값('abc')을 직접 저장하지 않는다. 데이터를 저장하기 위한 별도의 메모리 공간을 확보해서 값을 저장하고 그 주소를 변수영역에 저장하는 식으로 이루어 진다. 변수..
[코어 자바스크립트] 데이터 타입01. 데이터 타입의 종류 기본형 숫자(Number) 문자열(String) boolean null undefind symbol 참조형 객체 배열 함수 날짜 정규표현식 02. 데이터 타입에 관한 배경지식 식별자란? 어떤 데이터를 식별하는데 사용하는 이름으로 변수명이다. 변수란? 변할 수 있는 데이터(숫자, 문자열, 객체, 배열 )이다. 변수란 결국 변경가능한 데이터가 담길 수 있는 공간 또는 그릇이라 생각하면 된다. 03. 변수 선언과 데이터 할당 var a; a='abc' var a= 'abc'; 변수를 선언하고 데이터를 할당하면 해당위치에 값('abc')을 직접 저장하지 않는다. 데이터를 저장하기 위한 별도의 메모리 공간을 확보해서 값을 저장하고 그 주소를 변수영역에 저장하는 식으로 이루어 진다. 변수..
2022.10.31 -
친한듯 친하지 않은 map 함수를 위와 같이 수기로 정리 했다. map함수는 반복문을 돌며 배열안의 요소들을 1:1로 짝지어준다. 어떻게 짝지어 줄 것인가 정의한 함수를 메서드의 인자로 넣어주면 된다. map을 실행하는 배열과 결과로 나오는 배열은 다른객체가 된다. 기존 배열 수정하지 않고 새로운 배열을 만들어 낸다. 즉 map 함수는 --> arr의 값을 하나씩 불러와 thisArg 값에 맞게 실행한 후 새로운 배열 보내는 것이다. 프로그래머스 코딩테스트에서 리뷰했던 문제이다. function solution(a, b) { var answer = 0; for(let i = 0; i < a.length; i++) { answer += a[i]*b[i] } return answer } for문을 돌려 a,..
[Javascript] map 메소드친한듯 친하지 않은 map 함수를 위와 같이 수기로 정리 했다. map함수는 반복문을 돌며 배열안의 요소들을 1:1로 짝지어준다. 어떻게 짝지어 줄 것인가 정의한 함수를 메서드의 인자로 넣어주면 된다. map을 실행하는 배열과 결과로 나오는 배열은 다른객체가 된다. 기존 배열 수정하지 않고 새로운 배열을 만들어 낸다. 즉 map 함수는 --> arr의 값을 하나씩 불러와 thisArg 값에 맞게 실행한 후 새로운 배열 보내는 것이다. 프로그래머스 코딩테스트에서 리뷰했던 문제이다. function solution(a, b) { var answer = 0; for(let i = 0; i < a.length; i++) { answer += a[i]*b[i] } return answer } for문을 돌려 a,..
2022.08.11 -
호이스팅에 대해 알아보기 전, 자바스크립트의 변수 생성 3단계를 알아야한다. Javascript 변수 생성 3단계 선언 -> 초기화 -> 할당 var myname; //변수선언 undefined //초기화 myname = "gong" // 할당 호이스팅이란 ? 호이스팅이란 함수 안에 있는 선언(변수명, 함수명)을 모두 끌어 올려서 해당 함수 유효 범위의 최상단에 선언하는 것이다. var 변수 선언과 함수선언문에서 호이스팅이 일어난다 let/const 변수 선언도 호이스팅 되지만 TDZ에 의해 Reference Error가 발생한다. 함수표현식은 호이스팅이 일어나지 않는다. 호이스팅은 자바스크립트 인터프리터가 코드를 해석 할 때 1.변수, 함수의 선언처리 + 2.실제 코드 시행 두 단계로 나누어 처리하기 ..
[JavaScript] 호이스팅과 TDZ는 무엇일까?호이스팅에 대해 알아보기 전, 자바스크립트의 변수 생성 3단계를 알아야한다. Javascript 변수 생성 3단계 선언 -> 초기화 -> 할당 var myname; //변수선언 undefined //초기화 myname = "gong" // 할당 호이스팅이란 ? 호이스팅이란 함수 안에 있는 선언(변수명, 함수명)을 모두 끌어 올려서 해당 함수 유효 범위의 최상단에 선언하는 것이다. var 변수 선언과 함수선언문에서 호이스팅이 일어난다 let/const 변수 선언도 호이스팅 되지만 TDZ에 의해 Reference Error가 발생한다. 함수표현식은 호이스팅이 일어나지 않는다. 호이스팅은 자바스크립트 인터프리터가 코드를 해석 할 때 1.변수, 함수의 선언처리 + 2.실제 코드 시행 두 단계로 나누어 처리하기 ..
2022.08.10 -
자바스크립트의 얕은 복사(shallow Copy)와 깊은 복사(deep copy)에 대해 이해 하기 위해서는 자바스크립트의 원시타입과 객체 타입에 대해 이해해야한다.(이전글 참고) 원시 값을 변수에 할당하면 변수에는 실제 값이 저장된다. 그러나 객체를 변수에 할당하면 변수에는 참조 값이 저장된다. 객체를 복사 할 경우에는 참조값을 복사하기 때문에 얕은 복사가 일어난다. 얕은복사(shallow Copy) 객체를 복사 할 때, 해당 객체만 복사하여 새 객체를 생성한다. 복사된 객체의 인스턴스 변수는 원본 객체의 인스턴스 변수와 같은 메모리 주소를 참조하며, 해당 메모리 주소의 값이 변경되면 다른 객체의 변수 값 역시 동일하게 변경된다. 원본 객체는 하나인 상태에서, 참조 값만 복사한다. 깊은복사(deep C..
[Javascript] 얕은 복사와 깊은 복사자바스크립트의 얕은 복사(shallow Copy)와 깊은 복사(deep copy)에 대해 이해 하기 위해서는 자바스크립트의 원시타입과 객체 타입에 대해 이해해야한다.(이전글 참고) 원시 값을 변수에 할당하면 변수에는 실제 값이 저장된다. 그러나 객체를 변수에 할당하면 변수에는 참조 값이 저장된다. 객체를 복사 할 경우에는 참조값을 복사하기 때문에 얕은 복사가 일어난다. 얕은복사(shallow Copy) 객체를 복사 할 때, 해당 객체만 복사하여 새 객체를 생성한다. 복사된 객체의 인스턴스 변수는 원본 객체의 인스턴스 변수와 같은 메모리 주소를 참조하며, 해당 메모리 주소의 값이 변경되면 다른 객체의 변수 값 역시 동일하게 변경된다. 원본 객체는 하나인 상태에서, 참조 값만 복사한다. 깊은복사(deep C..
2022.08.10 -
Data() 실행 var date1 = new Date(); // 현재 날짜+시간 var date2 = new Date(2022,08,10,3,50); // 2022년 09월 10일 3:50:00 var date3 = new Date('2022-08-01'); // 2020년 9월 1일 09:00:00 var date4 = new Date('2012-05-17 10:20:30'); // 2012년 5월 17일 10:20:30 get/set 비교 get : 반환의 역할. set: 대입 역할. var dt = new Date('2010-12-25'); 일때 dt.getDate(); 는 25 를 반환 dt.setDate(13); 은 dt 객체를 2010년 12월 13일로 변경 만약 받은 날짜함수를 스트링으로 ..
[Javascript] Date()Data() 실행 var date1 = new Date(); // 현재 날짜+시간 var date2 = new Date(2022,08,10,3,50); // 2022년 09월 10일 3:50:00 var date3 = new Date('2022-08-01'); // 2020년 9월 1일 09:00:00 var date4 = new Date('2012-05-17 10:20:30'); // 2012년 5월 17일 10:20:30 get/set 비교 get : 반환의 역할. set: 대입 역할. var dt = new Date('2010-12-25'); 일때 dt.getDate(); 는 25 를 반환 dt.setDate(13); 은 dt 객체를 2010년 12월 13일로 변경 만약 받은 날짜함수를 스트링으로 ..
2022.08.10