본문 바로가기
반응형

Javascript

Javascript 연습(표준 내장 객체 사용하기) 자바스크립트에는 개발편의를 위해 수많은 객체가 미리 만들어져 있다. 기본적으로 내장된 객체를 표준 내장 객체라고 한다. 문자열을 다루는 String 객체, 배열 자료형을 다루는 Array 객체가 있다. 날짜와 시간을 다루는 Date객체와 수학 수식을 다루는 Math 객체가 있다. 하나씩 연습해보자. 1. String 객체 const pw = "124"; if(pw.length < 4) { console.log("비밀번호는 최소 4자리 이상 입력해주세요.") } const email = "test!naver.com"; if(email.includes("@") === false){ console.log("올바른 이메일 형식이 아닙니다."); } 2. Array 객체 const arr = [10, 20, 30.. 더보기
Javascript 객체 속성다루기 1. 데이터를 담아내는 그릇이 객체다. 2. 배열은 인덱스가 숫자다. 객체는 인덱스가 문자다. ex: const person = {name:"hong gil dong", age:35, height: 180} 3. alert(); 를 사용하면 앞에있는 매개변수만 인식하여 출력한다. 뒤에 있는 person["name"]은 출력x... 4. 속성값을 확인하기 더보기
자바스크립트 배열[]안에 중괄호 {} const rotationValues = [ { minDegree: 0, maxDegree: 30, value: "꽝" }, { minDegree: 31, maxDegree: 90, value: "합격" }, { minDegree: 91, maxDegree: 150, value: "꽝" }, { minDegree: 151, maxDegree: 210, value: "합격" }, { minDegree: 211, maxDegree: 270, value: "꽝" }, { minDegree: 271, maxDegree: 330, value: "합격" }, { minDegree: 331, maxDegree: 360, value: "꽝" }, ]; 위 예제는 배열 안에 객체가 들어가있다. 꿀팁1 꿀팁 2 컨트롤 +.. 더보기
Javascript가 HTML문서를 동적으로 변환 시킬 수 있는 이유 (DOM개념) 유민님과 남아서 Javascript 공부한 내용 거꾸로 접근하는 방법을 선택했다. 기초부터 공부하는 것을 멈추고, 로그인 화면을 구현한 HTML, CSS, JS문서 코드를 해석했다. 의문이 들었던 점은... 어떻게 자바스크립트가 HTML문서를 동적으로 변환시킬 수 있는 거지? 였다. 문제 이해 및 해결과정 1. 웹 브라우저 안에는 렌더링 엔진이라는 것이 있다. 2. 렌더링 엔진은 HTML을 한 줄 한 줄 해석한다. 그리고 문서를 객체화 시킨다. ← 중요한 개념임. 웹브라우저 역할. 3. 객체화된 문서에만 Javascript가 접근할 수 있다. 4. 여기서 DOM이라는 용어가 나온 것이다. Document Object Model. 문서 객체 모델이다. 5. DOM은 트리구조를 가지고 있다. (아래 사진 참.. 더보기
Javascript 조건문 개념 1. 자바스크립트 조건문은 대표적으로 if, swith문이 있다. 2. 블록문 : { } 중괄호로 묶은 것을 말함. 블록 혹은 코드 블록이라 한다. 3. 예제 let num =5; if(num % 2 === 0) { console.log("변수 num에 할당된 숫자는 짝수입니다."); }else{ console.log("변수 num에 할당된 숫자는 홀수입니다."); } 4. else if문. : if 문에 조건을 추가하고 싶을 때 사용한다. 5. if문 안에 if문을 중첩할 수 있다. 그러나 실무에서는 사용하는 경우가 거의 없음. 6. switch문 let food = "melon"; switch(food){ case "melon": console.long("fruit") break; case "appl.. 더보기
Javascript 기초 ② 1. ${} 문법을 이용하면 문자열에 변수 또는 식을 넣을 수 있다. 2. undefined - 변수나 상수를 선언하면 반드시 생성한 공간에 저장할 데이터를 할당해야 한다. 할당하지 않으면 자바스크립트 내부적으로 변수와 상수 공간에 임시로 데이터를 할당하는데, 이때 할당하는 값이 undefined다. 3. 배열 더보기
Javascript 연산자, 조건문 1. == (동등연산자) =는 대입연산자임. 다름. alert(1==2)//false alert(1==1)//true alert("one"=="two")//false alert("one"=="one")//true 2. === (일치연산자) 엄격한 녀석. 좌항과 우항이 완벽히 일치해야함. 타입도. alert(1 === "1")//false alert(1 == "1")//true Javascript는 조금 허술한 면이 있음. 3. Javascript에서는 숫자 1을 true로 간주하고 나머지는 false로 간주한다. 4. ! 연산자 alert(1!=2)//true alert(1!=1)//false 5. 조건문 (Boolean). 불린으로 올 수 있는 값은 true or false. if(true) { ale.. 더보기
Javascript 기초 ① 0. Javascript 자바스크립트를 사용할 줄 알면 웹브라우저를 제어할 수 있다. 코드를 입력하면 브라우저에서 구현된다. 웹서버에 웹브라우저가 요청하면 웹서버가 응답하는 구조다. 자바스크립트는 과거 웹브라우저 설계에만 이용됐는데 요즘은 웹서버에서도 사용하고 있다. 탈웹! 쓰이는 곳이 많아서 유용한 언어다. 예를 들어 Node.js를 사용하면 Javascript로 브라우저 밖의 서버를 구축할 수 있다. HTML은 자동차 뼈대, CSS는 자동차의 외관 디자인, Javascript는 자동차의 동력원인 엔진이라 할 수 있다. 엔진 매우 중요하다. 없으면 작동이 안 됨. 1. alert();를 사용하면 ()내용이 경고창으로 나온다. 정수, 실수, 문자 가능. 연산 가능. 2. 컴퓨의 목적은 계산기였다. 계산과.. 더보기
반응형

티스토리툴바