| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | |
| 7 | 8 | 9 | 10 | 11 | 12 | 13 |
| 14 | 15 | 16 | 17 | 18 | 19 | 20 |
| 21 | 22 | 23 | 24 | 25 | 26 | 27 |
| 28 | 29 | 30 | 31 |
- 카카오로그인
- 위크셋
- react-slick
- 중첩 구조 분해
- Map
- TypeScript
- 이메일 전송
- logstash
- 구조 분해 할당
- nestjs
- 객체
- MongoDB
- JavaScript
- DB
- 위크맵
- 로그스태시
- JSON.parse
- nextjs
- AGGREGATE
- 화살표 함수
- 참조에 의한 객체 복사
- nodemailer
- 자바스크립트
- context switch
- Mongoose
- JSON.stringify
- 카카오 소셜로그인
- javacript
- nest
- 캐러셀
- Today
- Total
목록Language/JavaScript (46)
뚜sh뚜sh
- 자바스크립트는 눈에 보이지 않는 곳에서 메모리 관리를 수행함 - 원시값, 객체, 함수 등 우리가 만드는 모든 것은 메모리를 차지함 - 자바스크립트 엔진 내에선 가비지 컬렉터가 끊임없이 동작함 - 가비지 컬렉터는 모든 객체를 모니터링하고, 도달할 수 없는 객체는 삭제함 - 외부로 나가는 참조는 도달 가능한 상태에 영향을 주지 않음 - 가비지 컬렉션은 엔진이 자동으로 수행하므로 개발자는 이를 억지로 실행하거나 막을 수 없음 가비지 컬렉션 기준 - 자바스크립트는 도달 가능성이라는 개념을 사용해 메모리 관리를 수행함 - '도달 가능한' 값은 어떻게든 접근하거나 사용할 수 있는 값을 의미함 - 도달 가능한 값은 메모리에서 삭제되지 않음 1. 아래 값들은 태생부터 도달 가능하기 때문에, 명백한 이유 없이는 삭제..
참조에 의한 객체 복사 - 객체와 원시 타입의 근본적인 차이 중 하나는 객체는 '참조에 의해' 저장되고 복사된다는 것이고 원시값(문자열, 숫자, 불린 값)은 '값 그대로' 저장,할당되고 복사됨 객체의 동작 방식 let user = { name: "John" }; - 변수엔 객체가 그대로 저장되는 것이 아니라, 객체가 저장되어 있는 '메모리 주소'인 객체에 대한 '참조 값'이 저장됨 - 객체는 메모리 내 어딘가에 저장되고, 변수 user엔 객체를 '참조'할 수 있는 값이 저장됨 - 따라서 객체가 할당된 변수를 복사할 땐 객체의 참조 값이 복사되고 객체는 복사되지 않음 객체 복사, 병합과 Object.assign Object.assign(dest, [src1, src2, src3...]) - 첫 번째 인수 ..
객체 - 객체는 중괄호 {...} 를 이용해 만들 수 있음 - 중괄호에는 '키: 값' 쌍으로 구성된 프로퍼티를 여러 개 넣을 수 있는데 키에는 문자형, 값에는 모든 자료형이 허용됨 빈 객체를 만드는 방법 - 객체 리터럴 : 중괄호를 이용해 객체를 선언하는 것 let user = new Object(); // '객체 생성자' 문법 let user = {}; // '객체 리터럴' 문법 리터럴과 프로퍼티 - 프로퍼티 키는 프로퍼티 '이름' 혹은 '식별자'라고도 부름 - 여러 단어를 조합해 프로퍼티 이름을 만든 경우엔 프로퍼티 이름을 따옴표로 묶어줘야 함 프로퍼티 삭제 delete user.age; 상수 객체는 수정될 수 있음 - const는 user의 값을 고정하지만, 그 내용은 고정하지 않음 const us..
디버깅 - 스크립트 내 에러를 검출해 제거하는 일련의 과정을 의미함 - 모던 브라우저와 호스트 환경 대부분은 개발자 도구 안에 UI 형태로 디버깅 툴을 구비해 놓음 - 디버깅 툴을 사용하면 디버깅이 훨씬 쉬워지고, 실행 단계마다 어떤 일이 일어나는지를 코드 단위로 추적할 수 있음 'Source' 패널 - 개발자 도구(Cmd + Opt + I)를 열기 - Sources 탭을 클릭해 Sources 패널을 열기 - Sources 패널은 크게 세 개의 영역으로 구성됨 1. 파일 탐색 영역 - 페이지를 구성하는 데 쓰인 모든 리소스(HTML, JavaScript, CSS, 이미지 파일 등)를 트리 형태로 보여줌 2. 코드 에디터 영역 - 리소스 영역에서 선택한 ㅏㅍ일의 소스 코드를 보여줌 3. 자바스크립트 디버깅..
본문이 여러 줄인 화살표 함수 - 이때는 중괄호 안에 평가해야 할 코드를 넣어주어야 함 - 그리고 return 지시자를 사용해 명시적으로 결괏값을 반환해 주어야 함
자바스크립트는 함수를 특별한 종류의 값으로 취급함 (다른 언어에서는 특별한 동작을 하는 구조로 취급함) 함수 표현식 - 자바스크립트에서는 괄호가 있어야만 함수가 호출됨 let sayHi = function() { alert( "Hello" ); }; 함수 표현식 끝에는 왜 세미 콜론이 있나요? - if { ... }, for { }, function f { } 같이 중괄호로 만든 코드 블록 끝엔 ;이 없어도 됨 - 함수 표현식은 구문의 끝이기 때문에 붙여짐 function sayHi() { // ... } let sayHi = function() { // ... }; 함수 표현식과 함수 선언문의 차이 첫번 째, 자바스크립트 엔진이 언제 함수를 생성하는지에 있음 - 함수 표현식은 실제 실행 흐름이 해당 함..
함수 선언 - 함수 선언 방식은 함수 선언문이라고 부르기도 함 - 매개변수가 여러 개 있다면 각 매개변수를 콤마로 구분해 줌 function showMessage(parameter1, parameter2, ... parameterN) { alert( '안녕하세요!' ); } showMessage(); // 함수 호출 지역 변수 - 함수 내에서 선언한 변수인 지역 변수는 함수 안에서만 접근할 수 있음 function showMessage() { let message = "안녕하세요!"; // 지역 변수 alert( message ); } showMessage(); // 안녕하세요! alert( message ); // ReferenceError: message is not defined (message는 ..
switch문 - 복수의 if 조건문은 switch문으로 바꿀 수 있음 - 하나 이상의 case문으로 구성됨, default문도 있지만 이는 필수가 아님 - case문에서 변수 x의 값과 일치하는 값을 찾으면 해당 case문의 아래의 코드가 실행됨, 이 때 break문을 만나거나 switch문이 끝나면 코드의 실행이 멈춤 - 값과 일치하는 case문이 없다면, default문 아래 코드가 실행됨 - case문 안에 break문이 없으면 조건에 부합하는지 여부를 따지지 않고 이어지는 case문을 모두 실행함 switch(x) { case 'value1': ... [break] case 'value2': ... [break] default: ... [break] } 여러 개의 "case"문 묶기 let a ..
자바스크립트를 사용해서 개발하고 있으면서 동작원리에 대해 모르는 건 아닌거 같아서 공부하게 되었다 먼저 모르는 단어가 많아서 모르는 단어들부터 정리해보았다 ! [단어 정리] 싱글 스레드 - 하나의 프로세스에서 한가지 작업을 실행하기 위해 순차적으로 실행되는 하나의 흐름 - 동시에 하나의 코드만 실행할 수 있다는 뜻임 - 하나의 힙 영역과 하나의 콜 스택을 가짐 - 하나의 콜 스택을 가져서 한번에 하나의 일 밖에 못하며, 앞에 일이 완료될 때까지 다음 일을 못하고 기다리는 동기적 처리를 함 - 자바스크립트는 싱글 스레드가 맞으나, 실제 자바스크립트가 구동되는 환경(자바스크립트 런타임 / 브라우저나 Node.js)에서는 주로 멀티 스레드를 사용 동기적 방식 - 이전 작업이 진행 중일 때는 다음 작업을 수행하..
'while' 반복문 - condition(조건)이 truthy 하면 반복문 본문의 코드가 실행됨 while (condition) { // 코드 // '반복문 본문'이라 불림 } 'do...while' 반복문 - 이때 본문이 먼저 실행되고, 조건을 확인한 후 조건이 truthy인 동안엔 본문이 계속 실행됨 - 대다수의 상황에선 do...while보다 while(...) {...} 이 적합함 do { // 반복문 본문 } while (condition) 'for' 반복문 - while 반복문보다는 복잡하지만 가장 많이 쓰이는 반복문 - step : 각 반복의 body가 실행된 이후에 실행됨 - begin이 한 차례 실행된 이후에, condition 확인과 body, step이 계속해서 반복 실행됨 - fo..