본문 바로가기

자바스크립트

new Set() 기본개념과 교집합 구하는 메소드 만들기 [JS문법 종합반 2주차 - 3] Set은 수학적 집합의 개념을 표현할 수 있는 문법이다. Set은 고유한 값을 저장하는 자료 구조이다. Set은 값만 저장하며, 키를 저장하지 않는다. Set은 값이 중복되지 않는 유일한 요소로만 구성된다. 같은 값을 두 번 넣는다면 저장되지 않는다. Set을 사용하면 다음과 같은 작업을 수행할 수 있다. 값 추가 및 값 존재여부 확인 값 삭제 모든 값 제거 Set 크기확인 위의 모든 기능들을 정리했고, 교집합 구하는 메소드를 정리해 보았다. 자바스크립트 내장 메소드인 filter()를 사용한다. // Set 두개를 정의한다. const setA = new Set([1, 2, 3, 4, 5]); const setB = new Set([2, 4]); // setA와 setB의 교집합을 구해 보자. cons.. 더보기
new Map() 완전정리 [JS문법 종합반 2주차 - 3] new Map() 기능은 {key-value} pair 를 저장한다. 객체도 그러하지만 new Map()만의 장점을 아래 정리해 본다. 1) key 에 문자열 뿐만 아니라 다양한 값이 올 수 있다. 2) myMap.keys() 와 같은 메소드로 iterator를 리턴받을 수 있으며 이 iterator는 이름만큼이나 반복문에 집어넣어 돌리기에 적합하다. 코드와 주석(!) 을 보자. const myMap = new Map(); // Map 하나를 새로 만든다. myMap.set('one', 1) // key-value pair 를 만든다. myMap.set('two', 2) myMap.set('three', 3) console.log(myMap.keys()) // key들의 iterator가 출력된다. fo.. 더보기
prompt() 메소드 [혼공자 확인문제 2-3-5] prompt() 메소드는 사용자가에게 입력창을 하나 alert처럼 열어주고 거기 입력받은 값을 메소드명에 할당한다. 코드를 보자. // 달러 수를 입력받습니다. 입력받은 숫자는 rawInput에 들어갑니다. const rawInput = prompt('달러 단위의 금액을 입력해주세요.') // 입력받은 데이터를 숫자형으로 변경하고 won 단위로 변경합니다. const dollar = Number(rawInput) const won = dollar * 1207 // 출력합니다. alert(`달러: ${dollar},\n원화 : ${won}`) 이렇게 전개된다. 더 이상의 자세한 설명은 생략해도 되겠다. 더보기
const로 상수를 만들면 바로 값을 지정해야 한다 [혼공자 확인문제 2-2-3] 아래 코드는 문제 없이 콘솔창에 출력된다. 변수 r 을 선언한 후 r에 10이라는 값을 부여했다. 하지만 아래 코드는 오류를 발생시킨다. const r 로 상수를 선언하면서 값을 바로 지정하지 않고 그 다음줄로 넘어갔기 때문이다. 상수는 변하지 않는 수이므로 아래처럼 값을 나중에 따로 지정하는 것이 아니라 선언할 때 즉시 정한다. 따라서 아래에서는 첫줄의 r 에서부터 빨간줄이 쳐질 것이다. 해결방법이야 간단하다. const r = 10 이렇게 고치면 된다. 더보기
증감연산자 ++num 등 [혼공자 확인문제 2-2-4] ++number 과 number--등 특이한 증감연산자가 많다. 간단히 한번 정리해 본다. 아래 코드의 콘솔창 결과를 예상해 보자. 정답은 11 11 13 13 이다. 더보기
Lodash 라이브러리의 _.orderBy() 사용하기 [혼공자 확인문제 6-2-5] Lodash 에서 _.orderBy()를 사용해 보았다. 거의 _.sortBy()와 똑같았다. 그냥 메소드명만 sort를 order로 바꿨는데 작동했다. 하지만 그래도 공식문서 문법을 적용해 보았다. 설명은 주석으로 대신한다. // 데이터를 생성합니다. const books = [{ name: '혼자 공부하는 파이썬', price: 18000, publisher: '한빛미디어' }, { name: 'HTML5 웹 프로그래밍 입문', price: 26000, publisher: '한빛아카데미' }, { name: '머신러닝 딥러닝 실전 개발 입문', prie: 30000, publisher: '위키북스' }, { name: '딥러닝을 위한 수학', price: 25000, publisher: '위키북스' .. 더보기
Lodash 라이브러리의 _.sortBy() 사용하기 [혼공자 6-2-6] Lodash 를 사용해 보았다. 책 한번 눈으로 살짝 보고 혼자 코드를 쳐보았는데 공식문서를 보아야 했다. 수능영어라도 해놨어서 다행이다. 듣지도 말하지도 못하는 영어가 여기서 도움이 된다. Lodash는 자바스크립트 라이브러리다. 임포트 코드도 찾아보니 나왔다. 처음엔 안 나와서 웹사이트를 15분쯤 뒤져야 했다. 아무튼 _.sortBy() 메소드를 간단 설명하자면 역시 코드와 주석으로 해야한다. 되니까 뿌듯하다. 더보기
랜덤한 숫자 생성 [혼공자 6-2-5] 진짜 별거없다. 아래 코드& 주석과 같다. const num = Math.random(); // 랜덤한 숫자 범위 확대 console.log(`0이상 10 미만의 랜덤한 숫자:`, num * 10); // 랜덤한 숫자 범위 이동 console.log(`-14 ~ 86 사이의 랜덤한 숫자:`, num * 100 -14); // 랜덤한 정수 숫자 console.log(Math.floor(`-14 ~ 86 사이의 랜덤한 정수 숫자: `, num * 100 -14)); 더보기

티스토리툴바