mystery

1. 구조 분해 할당 개발을 하다 보면 함수에 객체, 배열을 전달해야 할 경우가 있습니다. 객체, 배열에 저장된 데이터 전체가 아닌 일부만 필요한 경우도 생깁니다. 이럴 때 객체, 배열을 변수로 분해 할 수 있게 해주는 구조 분해 할당을 사용 할 수 있습니다! 2. 배열 분해 2-1. 기본 문법 let arr = ['Do hyeon','Lee'] let [firstName, lastName] = arr console.log(firstName) // Do hyeon console.log(lastName) // Lee 구조 분해 할당을 이용하면 인덱스로 배열에 접근하지 않아도 됩니다! 2-2. 배열을 리턴한다면 무엇이든지 let [firstName, lastName] = 'Dohyeon Lee'.split(..

객체는 키가 있는 컬렉션을 저장합니다. 배열은 순서가 있는 컬렉션을 저장합니다. 위 2개의 자료구조 만으론 부족해서 Map과 Set이 등장했습니다! Map Map은 키가 있는 데이터를 저장한다는 점에서 객체와 유사합니다. 다만 Map은 키에 다양한 자료형을 허용합니다. Map에는 다음과 같은 주요 메서드와 프로퍼티가 있습니다! new Map( [iterable] ) - Map을 만듭니다. [key, value] 쌍이 있는 iterable 객체를 선택적으로 넘길 수 있습니다. map.set( key, value ) - key를 이용해 value를 저장하고 map 자신을 리턴합니다. map.get( key ) - key에 해당하는 값을 리턴합니다, key가 존재하지 않으면 undefined를 리턴합니다. m..

iterable 객체 iterable 객체는 배열을 일반화한 객체입니다! iterable 개념을 사용하면 어떤 객체에든 for..of문을 사용할 수 있습니다. 배열은 대표적인 이터러블이고, 문자열 역시 이터러블의 예입니다! 배열 외에도 다수의 내장 객체가 이터러블입니다. Symbol.iterator let range = { from: 1, to: 5 }; 위와 같은 객체가 있습니다. 1부터 5까지의 간격을 나타내고 있죠. 위 객체에 for... of 문을 사용하면 다음과 같은 에러 메세지가 나타납니다. 위 range객체를 iterable로 만들려면 ( for..of 사용 가능한 상태 ) 객체에 Symbol.iterator 라는 메서드를 추가해야 합니다. 메서드 추가 후 for ...of 문을 사용하면 다..

배열에는 다양한 메서드가 있습니다. 요소 추가,제거 method splice arr.splice ( index [ , 삭제를 원하는 요소의 갯수 , 추가할 요소, ...... , 추가할 요소N ] ) 배열에서 원하는 인덱스로 부터 원하는 요소의 갯수만큼 삭제하고 삭제한 요소로 이루어진 배열을 리턴합니다. 제거와 동시에 해당 공간에 다른 요소를 추가 할 수도 있습니다! 원하는 요소의 갯수를 0으로 입력하면 요소의 제거없이 추가만 할 수 있습니다. let arr = [1 , 2, 3, 4, 5, 6] let spliceElement = arr.splice(0,3) console.log(spliceElement) // [1 ,2, 3] 제거한 요소를 배열로 반환하는 splice() let arr = [1, 2..

개발을 진행하다 보면 순서가 있는 컬렉션이 필요할 때가 있습니다! 객체를 사용하면 순서와 관련된 메소드가 없어 편리하지 않습니다. 객체는 태생이 순서를 고려하지 않고 만들어진 자료구조이기 때문에, 새로운 프로퍼티를 생성해 기존 프로퍼티 사이에 끼워넣는 행동도 불가능 합니다. 이럴 때! 배열을 사용합니다. 배열 기초 배열 요소의 자료형에는 제약이 없습니다! let friend = ['도현' , { 친구1 : '태훈'}, '재원', '태오'] console.log(friend[1].친구1) // 태훈 Array에 object를 넣을 수도 있다! 큐( queue )와 스택( stack ) 큐 큐는 먼저 집어넣은 요소가 먼저 나오게 되어있는 자료구조 입니다. 이와 같은 구조를 선입선출 ( First-In-Fir..

자바스크립트에서는 텍스트 형식의 데이터는 길이에 상관없이 문자열 형태로 저장됩니다. 문자열은 페이지 인코딩 방식과 상관없이 항상 UTF-16 형식을 따릅니다. 특수 기호 js에는 특수 문자들이 많습니다. \n 줄 바꿈 문자 를 사용하면 작은,큰 따옴표로도 여러 줄의 문자열을 만들 수 있습니다. 따옴표를 이용해 만든 문자열과 백틱을 이용해 만든 문자열은 서로 같습니다. 백틱을 사용하면 여러 줄 나타내기, 문자열 중간에 따옴표 넣기 전부 해결되니 백틱을 쓰세요!! 역슬레쉬는 문자열을 정확하게 읽기 위한 용도로 만들어졌으므로 문자열로 보여주고 싶다면 2개를 연달아 사용하면 됩니다. console.log(`이것이 역슬레쉬 표현법 \\`) 이것이 역슬레쉬 표현법 \ 문자열의 길이 length 프로퍼티에는 문자열의..

자바스크립트에서는 텍스트 형식의 데이터는 길이에 상관없이 문자열 형태로 저장됩니다. 문자열은 페이지 인코딩 방식과 상관없이 항상 UTF-16 형식을 따릅니다. 특수 기호 js에는 특수 문자들이 많습니다. \n 줄 바꿈 문자 를 사용하면 작은,큰 따옴표로도 여러 줄의 문자열을 만들 수 있습니다. 따옴표를 이용해 만든 문자열과 백틱을 이용해 만든 문자열은 서로 같습니다. 백틱을 사용하면 여러 줄 나타내기, 문자열 중간에 따옴표 넣기 전부 해결되니 백틱을 쓰세요!! 역슬레쉬는 문자열을 정확하게 읽기 위한 용도로 만들어졌으므로 문자열로 보여주고 싶다면 2개를 연달아 사용하면 됩니다. console.log(`이것이 역슬레쉬 표현법 \\`) 이것이 역슬레쉬 표현법 \ 문자열의 길이 length 프로퍼티에는 문자열의..

모던 자바스크립트는 숫자를 두 가지 자료형으로 나타냅니다. 1. 일반적인 숫자는 배정밀도 부동소수점 숫자 로 알려진 64비트 형식의 IEEE-754에 저장됩니다. 2. 일반적인 숫자는 2의 53제곱 이상이거나 -2의 53제곱 이하일 수 없다는 제약 때문에 Bigint 라는 자료형이 만들어졌습니다. 숫자를 입력하는 다양한 방법 0이 연속해서 많이 들어가는 숫자를 표현할 때 다음과 같은 방법을 사용합니다. 큰 수를 표현할 때 console.log(1e10) // 10000000000 1 * 10의 10제곱 e 왼쪽의 수에 10에 e 오른쪽의 수로 거듭제곱한 수를 곱합니다. 작은 수를 표현할 때 console.log(1e-5) // 0.00001 1 / 10의 5제곱 e 왼쪽의 수에 10에 e 오른쪽 음수의 ..

자바스크립트는 원시값을 객체처럼 다룰 수 있게 해줍니다! 원시값에도 메서드를 호출할 수 있다는 말이쥬~ 원시값을 객체처럼 하용하게 된 배경 자바스크립트 객체의 장점 중 하나는 프로퍼티의 값으로 함수를 저장할 수 있다는 것입니다. 자바스크립트는 날짜,에러,HTML 요소 등을 다룰 수 있게 해주는 다양한 내장객체를 제공합니다. 고유한 프로퍼티와 메서드를 가지죠. 하 지 만 이런 기능을 사용하기 위해선 시스템 자원이 많이 필요합니다. 객체는 원시값보다 무겁고, 내부 구조 유지를 위한 자원을 필요로 하기 때문입니다. 때문에 아래와 같은 딜레마가 생겨버립니다. 1. 문자열이나 숫자와 같은 원시값을 다루는 작업이 많다. 2. 메서드를 사용하면 작업을 수월하게 할 수 있을 것 같다. 3. 하지만 원시값은 빠르고 가벼..

객체의 자동 형 변환 객체끼리 서로 더하거나, 빼거나 , alert으로 객체를 출력하거나 할 때 객체는 자동 형 변환을 합니다. 예는 다음과 같습니다! 1. 객체는 논리 평가 시 true를 반환합니다. 고로 객체는 숫자형, 문자형 2개로만 변환이 일어납니다! 2. 객체끼리 빼는 연산을 하거나, 수학 관련 함수를 적용할 때 객체는 숫자형으로 형 변환 합니다. ex) Date객체끼리 빼는 연산을 하면 두 날짜의 시간차이가 반환 됩니다. ( 숫자형 형 변환 ) 3. 객체를 출력하려고 할 때 문자형으로 형 변환 합니다. 객체 자동 형 변환의 기준 hint 객체 형 변환은 세 종류로 구분되고 hint라 불리는 값이 구분 기준입니다. hint == 목표로 하는 자료형 정도로 이해하고 넘어갑니다. 1. alert 함..