odada

표준 내장 객체 - 날짜(Date) Date 객체 날짜와 시간을 위한 메서드를 제공하는 내장 객체 Date 객체 생성 // 현재 시간으로 Date 객체 생성 const now = new Date(); console.log(now); // 2021-07-20T07:23:45.000Z // 2021년 7월 20일 7시 23분 45초로 Date 객체 생성 const date1 = new Date(2021, 6, 20, 7, 23, 45); console.log(date1); // 2021-07-20T07:23:45.000Z .getFullYear() / .getMonth() / .getDate() / .getDay() 년도, 월, 일, 요일을 얻는 메서드 getMonth()는 0부터 시작하므로 1을 더해줘야 ..

숫자(number).toFixed()숫자를 고정소수점 표기법으로 변환하여 문자열로 반환합니다.const num = 3.1415926535;console.log(num.toFixed(2)); // 3.14console.log(typeof num.toFixed(2)); // stringconsole.log(parseFloat(num.toFixed(2))); // 3.14 (문자열을 숫자로 변환).toLocalString()숫자를 표준 숫자 형식의 문자열로 변환합니다.const num2 = 10000000;console.log(num2.toLocaleString()); // 10,000,000console.log(`${num2.toLocaleString()}원`); // 10,000,000원Number.isI..

표준 내장 객체 - 문자열(string) string(문자열) const str = 'hello world'; length 문자의 길이를 반환한다. console.log(str.length); // 11 .includes() 문자열에 특정 문자열이 포함되어 있는지 확인한다. console.log(str.includes('hello')); // true console.log(str.includes('Hello')); // false (대소문자 구분) console.log(str.includes('hello', 1)); // false (1번째 인덱스부터 시작) .indexOf() 문자열에 특정 문자열이 포함되어 있는지 확인한다. 포함되어 있으면 해당 문자열의 인덱스를 반환한다. 없으면 -1을 반환한다. c..

클래스 (class)Class는 객체를 만들기 위한 템플릿이며, 프로토타입 기반 상속을 보다 명시적이고 간편하게 사용할 수 있도록 해줍니다.class를 사용하지 않으면, 객체를 생성하고 속성과 메서드를 추가하는 과정이 번거롭고, 중복된 코드가 많아질 수 있습니다.class를 통해 원하는 구조의 객체 틀을 만들고, 이를 통해 객체를 생성하고 속성과 메서드를 추가할 수 있습니다.클래스 = 붕어빵 틀 / 객체 = 붕어빵0. 클래스의 개념"커피숍"을 운영한다고 가정하고, 커피숍에서 판매하는 다양한 종류의 커피를 클래스를 사용하여 모델링해 보겠습니다.- 클래스를 사용하지 않은 경우// 생성자 함수를 사용하여 커피 객체를 생성function OrderCoffee(name, price, size) { // 커피..

함수(Function)1. 함수 선언하기함수 선언문과 표현식의 차이점함수 선언문은 호이스팅이 일어나지만, 함수 표현식은 호이스팅이 일어나지 않는다.// 함수 선언문 (Declaration)function helloA() {}// 함수 표현식 (Expression)const helloB = function () {};helloA(); // 함수 호출helloB(); // 함수 호출2. 호이스팅이란?함수 선언문이 코드의 최상단으로 끌어올려지는 것을 말한다.함수 선언문은 선언하기 전에 호출해도 정상적으로 실행된다.hello1();function hello1() { console.log('hello1'); // hello1}하지만, 함수 표현식은 호이스팅이 일어나지 않기 때문에, 함수 표현식을 선언하기 전..

구문(Statement)1. 구조 분해 할당 (Destructuring assignment)객체나 배열을 변수로 '분해'할 수 있게 하는 문법객체의 속성을 해체하여 그 값을 변수에 담을 수 있게 하는 표현식- 배열의 구조 분해const arr = [1, 2, 3];// const a = arr[0]// const b = arr[1]// const c = arr[2]const [a, b, c] = arr; // 구조 분해 할당// 배열 데이터를 만든 후 arr 변수에 할당console.log(a, b, c); // 1 2 31) 각각의 변수가 미리 할당되어 있을 경우let a = 0;let b = 0;let c = 0;const arr = [1, 2, 3];// 초기화 후 재할당 가능[a, b, c] = ..

연산자(Operator)1. 산술(Arithmetic) 연산자+, -, *, /, %// 덧셈 연산자console.log(1 + 2); // 3// 뺄셈 연산자console.log(5 - 7); // -2// 곱셈 연산자console.log(3 * 4); // 12// 나눗셈 연산자console.log(10 / 2); // 5// 나머지 연산자console.log(7 % 5); // 2function isEven(num) { return num % 2 === 0;}console.log(isEvent(3)); // falseconsole.log(isEvent(4)); // true2. 할당(Assignment) 연산자a = bconst a = 1;console.log(a); // 1let aa = 1..

JS데이터(JSData)html, css : 모양 기반javascript : 데이터 기반0. ECMAScriptECMA스크립트(ECMAScript, 또는 ES)란, Ecma International이 ECMA-262 기술 규격에 따라 정의하고 있는 표준화된 스크립트 프로그래밍 언어를 말한다.위키백과 :https://ko.wikipedia.org/wiki/ECMA%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B81. String (문자)'가나다라마바사'string은 문자열을 나타내는 데이터 타입const string1 = 'Hello'; // 큰따옴표const string2 = 'odada!'; // 작은따옴표const string3 = `Hello World! ${string1} ${str..

DOM Dom (Document Object Modal) 이란 HTML 문서를 객체로 표현한 것으로 JS에서 HTML을 제어할 수 있게 해줍니다. Node vs Element 노트(Node) : HTML 요소, 텍스트, 주석 등 모든 것을 의미 요소(Element) : HTML 요소를 의미 DOM node 란? // 지정된 id값을 가진 요소를 반환 document.getElementById("someid"); // 지정된 클래스 이름을 가진 모든 하위 요소의 개체를 반환 document.getElementsByClassName("someclass"); // 지정된 태그 이름을 가진 요소의 HTML 모음을 반환 document.getElementsByTagName("LI"); // 지정된 class와 일..

mdn 자바스크립트 기본 https://developer.mozilla.org/ko/docs/Learn/Getting_started_with_the_web/JavaScript_basics JavaScript 는 뭔가요? JavaScript 는 웹 브라우저에서 사용하기 위하여 만들어진 HTML과 웹의 프로그래밍 언어입니다. 왜 JavaScript를 공부해야합니까? JavaScript는 모든 웹 개발자 가 배워야 하는 3 가지 언어 중 하나입니다 . 웹 페이지의 내용을 정의하는 HTML 웹 페이지의 레이아웃을 지정하는 CSS 웹 페이지의 동작을 프로그래밍하는 JavaScript 웹 개발 JavaScript는 웹 애플리케이션의 동적인 기능을 구현하기 위해 필수적입니다. 웹 페이지에서 사용자와의 상호작용, 데이..