Front-End/JavaScript

    [JavaScript] Generator란 무엇일까?

    Generator👀 function* generateSequence() { yield 1; yield 2; return 3; } 일반 함수는 function 키워드로 시작한다면, 제너레이터 함수는 function* 키워드로 시작한다. (화살표 함수는 사용할 수 없다.) 제너레이터 함수 안에는 yield 구문이 존재한다. yield 구문의 문법은 return 구문과 비슷하다. 차이점은 return은 한번만 실행되지만, 제너레이터 함수의 yield는 여러번 실행된다는 것이다. yield 구문은 제너레이터의 실행을 멈췄다가 다음에 다시 시작할 수 있게 만든다. 제너레이터 함수는 일반 함수와 동작 방식이 다른데, 제너레이터 함수를 호출하면 코드가 실행되지 않고, 제너레이터 객체가 반환된다. let generat..

    [JavaScript] for-of와 Iterator

    for-of문 for(let value of myArray){ console.log(value); } for-in 문이 객체의 속성들을 순회하기 위한 구문이라면, for-of 문은 배열의 요소들, 즉 data 를 순회하기 위한 구문이다. 정확히는 일반 Object 요소를 제외한 Array, Map, Set 등의 객체 타입을 순회할 수 있다. (추가로 String도 가능하다. 문자열로 이루어진 배열로 보기 때문) forEach와는 다르게 break, continue, 그리고 return 구문과 함께 사용할 수 있다. for-of문은 어떤 메소드를 반복 호출하는 방식으로 동작한다. Array, Map, Set 등의 객체들은 공통적으로 이터레이터(iterator) 메소드를 제공한다. 일반 객체는 이터레이터 메..

    [JavaScript] Symbol을 알아보자

    Symbol이란?🤔 심볼(Symbol) 은 ES6에서부터 추가된 7번째 타입의 값이다. 심볼(Symbol)은 프로그램이 이름 충돌의 위험 없이 속성(property)의 키(key)로 쓰기 위해 생성하고 사용할 수 있는 값이다. let newSymbol = Symbol(); Symbol()을 호출하면 새로운 심볼 값이 생성된다. 이 값은 고유하다. 즉, 다른 어떤 값과도 다르다. 심볼을 키값으로 사용하게 된다면 다른 어떤 속성과도 충돌하지 않는다. Symbol의 특징 심볼은 이런 식으로 사용할 수 있다. let isOpen = Symbol('isOpen'); ... element[isOpen] = true; 위 코드에서 isOpen문자열은 주석일 뿐이다. 심볼 값을 console.log()로 찍거나, .t..

    [JavaScript] 값과 레퍼런스

    JavaScript의 타입👀 JavaScript의 데이터 타입은 크게 두가지로 나눌 수 있다. 원시 타입(Primitive data type)과 객체 타입(Object / reference type)이다. 원시 타입은 다음과 같다. Number(숫자) String(문자열) boolean(논리형) undefined null Symbol(ES6부터 제공) 객체 타입은 다음을 포함한다. function(함수) Array(배열) Object(객체) JavaScript에서 원시 타입을 제외한 모든 값은 '객체' 이다. 즉, 함수나 배열 모두 객체로 본다. 원시타입과 객체 타입의 차이점은 값의 저장 형태이다. 원시 타입 흔히 원시 타입은 불변성(immutable)을 갖는다고 말한다. 원시 타입을 변수에 할당할 때값..