본문 바로가기

자바스크립트

[JavaScript] 변수 선언과 값 할당의 메모리 구조 JavaScript에서 변수 선언과 할당에 따른 메모리 구조는 다음과 같습니다. JavaScript는 변수 선언과 값 할당을 함께 표현하여도 변수 선언과 할당을 나눠서 표현합니다. // 개발자가 작성한 코드 let value = 'hello'; // 자바스킯트 엔진이 실행하는 코드 let value = undefined; value = 'hello'; 같은 변수에 값을 할당하기 때문에 사용했던 메모리 공간에 값을 할당할 것이라고 생각할 수 있지만 실제로는 새로운 메모리 공간을 생성하여 값을 저장합니다. 새로운 값을 할당하여도 새로운 메모리 공간을 생성하여 값을 저장합니다. 이후 참조되지 않은 불필요한 값들은 가비지컬렉터에 의해 정리됩니다. 더보기
[JavaScript] 호이스팅(hosting)의 이해 JavaScript에서 var 키워드를 사용하는 경우 호이스팅을 조심해야합니다. 즉, 변수 사용 시 예상하지 못한 결과를 반환할 수 있습니다. 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. https://developer.mozilla.org/ko/docs/Glossary/Hoisting 호이스팅 - 용어 사전 | MDN JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다 developer.mozilla.org 호이스팅으로 인해 발견되는 문제점을 보완하기 위해 ES6에서.. 더보기
[JavaScript] 배열 내 특정 값 찾기 - find(), includes() ,Set 객체의 has() find() 메서드를 통해 배열 내 특정 값 찾기 const array = [1, 2, 3, 4]; array.find(data => data === 1);// 1 array.find(data => data === 3);// 3 array.find(data => data === 5);// undefinded 주어진 조건을 만족하는 값을 출력한다. 주어진 조건을 만족하는 값이 존재하지 않을 경우 undefinded를 리턴한다. includes() 메서드를 통해 배열 내 특정 값 찾기 const array = [1, 2, 3, 4]; array.includes(1)// true array.includes(3)// true array.includes(5)// false 값이 존재하는 경우 true를 리턴한다... 더보기
[JavaScript] reverse 함수 reverse()는 배열의 순서를 반전시킵니다. const num = [10, 20, 30, 40, 50]; const value = num.reverse(); console.log(value); // [50, 40, 30, 20, 10] 더보기
[JavaScript] reduce() 함수 간단한 사용 예 const num = [10, 20, 30, 40, 50]; const value = num.reduce((a, b) => { return a + b; }); console.log(value); // 150 상세 설명 및 예시 reduce 함수는 배열의 각 요소에 대해 함수를 실행하고 하나의 결과값을 반환합니다. arr.reduce(callback[, initialValue]) callback은 총 네 가지 인수를 사용할 수 있으며 두 가지의 필수 옵션과 두 가지의 선택 옵션이 존재합니다. 인수 이름 설명 필수 accumulator callback의 반환값을 저장 initalValue를 설정했을 경우 최초 호출 시 intalValue 값을 제공 initalValue를 설정하지 않았을 경우.. 더보기
[JavaScript] setInterval, clearInterval 사용법 setInterval 함수는 호출 주기에 따라 콜백 함수를 동작시키며 기본 구조는 다음과 같습니다. setInterval(콜백 함수, 호출 주기) clearInterval 함수를 이용하면 setInterval 함수를 멈출 수 있습니다. const period = 1000; let count = 0; console.log('program started...'); const id = setInterval(() => { if(count >= 3) { clearInterval(id); console.log('program finished...'); } else { console.log(++count); } }, period); // 1초마다 출력 // === 실행 결과 === // program started... 더보기
yield 사용법 - 생성기(generator) 그리고 반복기와 반복기 제공자 yield란 yield는 마치 return 처럼 동작하며 정해진 구간을 순서대로 실행하며 반드시 'function*' 을 사용한 함수에서 사용합니다. 생성기 'function*' 로 만든 함수를 생성기(generator)라고 부릅니다. 주의할 점은 'function*'은 하나의 키워드이기때문에 화살표 함수[()=>{}]를 만들 수 없습니다. function* generator() { console.log('generator started...'); let value = 1; while (value < 4) { yield value++; } console.log('generator finished...'); } // case 1 for (let value of generator()) { console.lo.. 더보기
JavaScript - 단축 평가 논리 계산법 단축 평가 논리 계산법은 선행 인자의 값이 유효(true)할 때 후행 인자의 값을 출력하고 선행 인자 값이 유효하지 않을 때(false) 선행 인자를 출력한다. var a = 'Hello'; var b = undefined; console.log(a && 'World') // World console.log(b && 'World') // undefined console.log( true && 'Hello World' ); // Hello World console.log( false && 'Hello World' ); // false console.log( 1 && 'Hello World' ); // 1 console.log( 0 && 'Hello World' ); // 0 console.log( null.. 더보기

반응형