data life

preventDefault() event.preventDefault() :어떤 event의 기본 행동이 발생되는 것을 막음 : addEventLister 내부 함수가 발생되는 것을 막음 *사용 예시* submit 버튼을 눌러도 새로고침이 안되게끔 태그를 눌렀을 때도 href링크로 이동하지 않게끔 localStorage : 하나의 작은 DB : key-value 형태 : array로는 저장 불가 only text만! setItem : 데이터 저장 localStorage.setItem("key","value"); getItem : 데이터 읽기 localStorage.getItem("key"); removeItem : 데이터 지우기 localStorage.removeItem("key"); clear : 초기화..

Math 수학 상수나 함수에 대한 속성, 메소드가 있는 내장 객체 다른 전역 객체와 달리 생성자(constructor) 존재하지 않음 ➡️ Math 객체의 모든 메소드나 property를 바로 사용 가능 대표 메소드 Math.min() : 가장 작은 수 반환 : 인수가 없을 경우 //Infinity, 비교할 값이 포함될 경우 //NaN Math.min(-1,0,-100,"string") //NaN Math.max() :가장 큰 수 반환 : 인수가 없을 경우 //-Infinity, 비교할 값이 포함될 경우 //NaN Math.max(1,0,-10,"100") //100 Math.random() 0과 1 사이의 랜덤한 숫자를 반환 Math.random() * 10 //0과 10 사이의 랜덤한 숫자 반환 Ma..

input 웹 기반 양식에서 사용자의 데이터를 받을 수 있는 대화형 컨트롤을 생성 대표적인 input type text : 사용자로부터 한 줄의 문자를 입력받음 password : 비밀번호로써 입력받은 문자나 숫자 대신 별표(*)나 작은 원 모양(•)으로 표시됨 HTML 삽입 미리보기할 수 없는 소스 button : 일반 버튼 태그도 존재 HTML 삽입 미리보기할 수 없는 소스 checkbox : 여러 개의 옵션(option) 중 다수의 옵션을 입력 받음 radio : 여러 개의 옵션(option) 중에서 단 하나의 옵션만을 입력 받음 submit : 기본적으로 브라우저가 새로고침됨 사용자로부터 입력받은 데이터(data)를 서버의 폼 핸들러로 제출하는 버튼 형식 HTML 삽입 미리보기할 수 없는 소스 i..

h1 { color: cornflowerblue; } .clicked { color: tomato; } className 이전 클래스와 상관없이 모든 걸 교체해버림 클래스 이름 변경 element.className = "변경할 이름"; 클래스 이름 추가 기존 클래스에 값을 추가 앞에 space도 같이 추가해줄 것 element.className += " 추가할 이름"; function handleClick() { const.clickedClass = "clicked" if (h1.classList === clickedClass){ h1.className = ""; } else { h1.className = clickedClass; } } h1.addEventListener("click", handleCl..

React Native : Js 만으로 안드로이드, iOS 앱 개발 가능 Electron : CSS, HTML, Js로 데스크탑 앱 개발 가능 자바스크립트의 HTML 접근 document 객체 브라우저에 존재하는 object로, console 창에서 작성한 html 문서를 가져옴 document 메소드 HTML element 선택 HTML element 생성 HTML 이벤트 핸들러 추가 HTML 객체 선택 * console.dir(document); : document 의 속성 확인 document.body head title 은 중요한 속성이므로 언제든 불러올 수 있으나 나머지 요소들은 다음과 같이 선택해서 불어와야함. 선택 document.getElementBy (TagName , Id , Class..

if ... else 문 if (condition){ /// condition === true } else { /// condition === false } * else 는 선택사항 isNaN 함수 - NaN (Not-A-Number) 판별 const age = parseInt(prompt("How old are you?")); if (isNaN(age)) { console.log("Please write a number"); //true } else { //false console.log("All right!"); } else if - 조건문 추가 const age = parseInt(prompt("How old are you?")); if (isNaN(age)) { console.log("Please..

입력 함수 1️⃣ prompt() 2️⃣ confirm() 1. prompt(message, default) message : 입력 창에 띄울 메세지 default : 입력 부분의 기본 값 (string) const age = prompt("How old are you?"); console.log(age); - 오래된 기능이라 잘 쓰진 않음 - 문자열의 값을 반환하므로 숫자로 얻고 싶은 경우 타입 변환이 필요하다. typeof : 데이터 타입 반환하는 연산자 console.log(typeof 1); // "number" console.log(typeof "code"); // "string" console.log(typeof true); // "boolean" console.log(typeof undefi..

❓why use Function? To encapsulate a piece of code function name(parameter1, parameter2) { } "Function 함수이름 () 순서" - () : 함수를 실행 시킴 - 키워드로 시작하며 객체이다. - 괄호()에는 쉼표(,)로 구분된 매개변수 이름이 포함 (parameter1, parameter2, ...) - {} : 함수에 의해 실행될 코드 - 함수 호출 선언 (매개변수 parameter) 호출 (전달인자 argument) - 함수 반환 return 명령문에 도달 시, 실행이 중지 var x = plus(4,3); //4, 3 -> argument function plus(a, b) { //a,b -> parameter return ..

데이터 타입 원시 타입 Number String Boolean null undefined symbol 객체 타입 object 1. Number(숫자) - 모든 숫자를 실수로 처리함 - 각종 연산 가능 (+, -, *, /, %) 2. String (문자열) - 문자열 길이와 상관없음 - ' ' & " " &` ` - 한 번 정의한 문자열은 변하지 않음 var str = 'hello'; str[0] = 'H'; console.log(str); //hello 2-1. 문자열+ 문자열 var str1= "hi"; var str2 = " nice to meet you"; var result = str1 + str2; console.log(result); //"hi nice to meet you" 2-2. 인덱스..

변수(Variables) var 유효 범위 : 함수 스코프 값 재할당 : ⭕ 재선언 : ⭕ let 유효 범위 : 블록 스코프 / 함수 스코프 값 재할당 : ⭕ 재선언 : ❌ const (절대값) 유효 범위 : 블록 스코프 / 함수 스코프 값 재할당 : ❌ 재선언 : ❌ 스코프(Scope) '범위' 라는 뜻으로, '변수에 접근할 수 있는 범위' 를 말한다. [범위 분류 기준] Block Scope (중괄호) Function Scope (함수) [스코프 종류] Global Scope (전역 스코프) Local Scope (지역 스코프) -> 우선순위가 더 높음 변수명 javascript : veryLongVarialbeName *python의 경우 : very_long_variable_name