Map Map은 자바스크립트에서 제공하는 데이터 구조 중 하나로, key - value 쌍으로 데이터를 저장하고 관리합니다. Map은 은 객체와 유사하지만, 객체와는 다르게 key에 다양한 자료형을 사용할 수 있으며, 원시 자료형도 key에 사용할 수 있습니다. set(key, value) : Map은 객체에 key - value 쌍을 추가합니다. get(key) : Map은 객체에서 지정한 key에 대한 값을 반환합니다. has(key) : Map은 객체에서 지정한 key가 존재하는지 여부를 반환합니다. delete(key) : Map은 객체에서 지정한 key에 대한 key - value 쌍을 제거합니다. clear() : Map은 객체에서 모든 key- value 쌍을 제거합니다. size : Map..

날짜와 시간을 다루는 Date 객체 const date = new Date(); console.log(date); Date 객체는 운영체제에서 날짜와 시간 정보를 가져옵니다. 시간 직접 세팅하는 법 인스턴스 만들기 월(月)은 0부터 시작, GMT 기준 시간으로 설정 됨. const date1 = new Date(2022, 11, 27, 18, 30, 50); console.log(date1); // 원하는 달로 입력 됨 const date2 = new Date("2022-12-25/18:30:50"); console.log(date2); Date 객체 메소드 let myDate = new Date(); console.log(myDate.getFullYear()); // 2023 (현재 연도 출력) con..

🍦 배열 객체에는 [파괴적 메소드]와 [비파괴적 메소드]가 있습니다. 파괴적 메소드? 메소드를 호출하는 객체를 변경하며, 원래의 객체를 수정합니다. (추가, 추출, 정렬 등) 비파괴적 메소드? 요소를 사용하되 변경하지 않는 것 자바 stream API와 동일 : 원본 데이터를 변경하지 않습니다. React에서도 자주 나옴 비파괴적 메소드 forEach() : 요소를 순회 const arr = [10, 20, 30, 40, 50]; arr.forEach(function(n) { console.log(n); }); 10 20 30 40 50 toString() : 배열 안의 문자를 하나의 문자열로 반환 배열 안의 모든 문자를 쉼표(,)를 이용해 모두 결합하여 하나의 문자열로 반환합니다. let fruits ..

🍦 자바스크립트에는 개발 편의를 위해 수많은 객체가 미리 만들어져 있습니다. 🍦 이렇게 만들어진 객체는 자바스크립트에 기본으로 내장되어 있어서 스코프의 위치를 따지지 않고 모든 영역에서 공통으로 사용할 수 있습니다. Object : 가장 기본적인 객체, 모든 객체의 상위 객체 입니다. Array : 배열을 나타내는 객체, 여러 개의 값을 하나의 변수에 저장할 수 있습니다. String : 문자열을 나타내는 객체, 문자열을 다루는 다양한 메소드를 제공합니다. Number : 숫자를 나타내는 객체, 숫자를 다루는 다양한 메소드를 제공합니다. Boolean : true / false를 나타내는 객체입니다. Date : 날짜와 시간을 다루는 객체, 날짜와 시간을 다루는 다양한 메소드를 제공합니다. Math : ..

객체는 자바스크립트에서 가장 중요하고 강력한 개념 중 하나 입니다. 자바스크립트에서 객체는 다른 객체 또는 기본,원시타입(primitive type) 값을 포함할 수 있는 컨테이너 입니다. 객체는 중괄호 {}를 사용하여 만들며, 속성(property)과 값(value)의 쌍으로 구성됩니다. 객체를 만드는 방법은 [객체 리터럴]과 [클래스]가 있지만, [객체 리터럴]로 객체를 만드는 것이 간단하고 직관적 입니다. 웹 개발에서 브라우저 객체 모델(BOM)과 문서 객체 모델(DOM) 등 다양한 객체를 사용하여 웹 페이지를 조작 및 상호작용하는 데 사용됩니다. 객체 리터럴 객체 리터럴은 백엔드와 통신할 때 주로 쓰입니다. 📌 예) 회원정보 3000번 포트에서 8211번 포트로 전달 (BE : 8211번 / FE..

계산기 만들기 함수와 switch문 사용하여 계산기 만들기 💡 prompt, input 등에서 받아오는 값은 문자열이기 때문에 형변환 해줘야 함. * input 태그로 첫번째 숫자 입력 받기 (예. 10) -> let firstNum = document.getElementById("num1").value; * select 콤보 박스로 (사칙연산 선택) (+, -, *, /) -> let op = document.getElementById("operator").value; * input 태그로 두번째 숫자 입력 받기 (예. 20) -> let secondNum = document.getElementById("num2").value; * 계산 버튼을 만들기 -> html에서 자바스크립트 함수 호출 : 계산하..

함수? 자바스크립트에서 가장 중요한 개념 (자바에서는 메소드라는 용어로 사용) 특정 작업을 여러번 반복해야 하는 경우, 해당 작업을 재사용 가능한 구조로 만들게 되는데 이 때 사용하는 것이 함수 입니다. 입력값을 검증하고 올바르지 않은 경우, 예외를 발생시킬수 있습니다. (try ~ catch) 전역 변수 사용을 줄이고, 함수 내에서만 유효한 변수(지역변수)를 선언 합니다. 비동기적으로 실행되는 코드를 처리하기 위해 콜백 함수를 정의 합니다. 객체를 생성하고, 객체의 속성과 메소드를 정의 합니다. 함수를 인자로 받아서, 다른 함수에서 실행 합니다. 자바스크립트에서 함수는 [함수 선언문] 또는 [함수 표현식]으로 작성할 수 있습니다. 1️⃣함수 선언문 function 키워드로 선언하며 함수 이름을 가집니다..

조건문 자바스크립트에서 조건문은 조건에 따라 다른 코드를 실행하는데 사용됩니다. 조건문은 if, else if, else 키워드를 사용하여 구성됩니다. if문 if (조건식) { 조건식의 결과가 참일 때 실행하고자 하는 명령문; } if ~ else문 if (조건식) { 조건식이 참일 때 실행될 문장 } else if (조건식) { 첫번째 조건식이 거짓이고 현재의 조건이 참인 경우 실행 될 문장 } else { 조건식이 거짓일 때 실행 될 문장 } let num = prompt("숫자를 입력 하세요 : ", ""); if(num >= 0) { document.write("" + num + "은 양수 입니다." + ""); } else { document.write("" + num + "은 음수 입니다."..

산술 연산자 수학 연산을 수행하는 연산 let a = 2; let b = 3; console.log(a + b); console.log(a - b); console.log(a * b); console.log(a / b); // 몫을 구하려면 parseInt 해줘야 함. console.log(a % b); console.log(a ** b); // 거듭 제곱, 2^3 console.log(--a); // 전위 단항 연산자, 1 console.log(b++); // 후위 단항 연산자, 3 대입 연산자 대입연산자와 복합 대입 연산자가 있음 let x = 10; let y = 20; // x = x + 10; : x에 10을 더해서 x에 다시 대입 x += 10; // 복합 대입 연산자 console.log(x..

주석 // 한 줄 주석 /* 여러 줄 주석 이 줄은 실행되지 않습니다. */ 스타일 가이드 소스 파일의 이름은 알파벳 소문자, 하이픈(-), 밑줄(_)으로만 작성 소스파일의 확장자명은 .js 소스파일의 인코딩은 UTF-8 코드는 보기 좋게 줄 바꿈을 합니다. 세미콜론으로 문장을 구분 합니다. 식별자는 첫글자는 영문자, 언더스코어, $시작 해야 합니다. 단어와 단어를 연결하여 식별자를 작성하는 경우 하이픈이나 언더바 사용, 카멜표기법으로 표기 가능 예약어는 식별자로 사용 불가 변수와 상수 변수(Variable)와 상수(Constant)는 데이터를 저장하기 위한 역할을 합니다. 변수와 상수는 선언, 할당, 참조 등의 동작을 통해 사용됩니다. 변수의 선언은 var, const, let 키워드로 할 수 있으며,..