본문 바로가기

js09_builtin /* object는 JavaScript에서 최상위부모객체이기 때문에 모든 객체는 Object를 상속받는다. 상속받은 모든 객체들은 Object가 가지고 있는 모든 속성과 메서드를 동일하게 사용할 수 있다. 또한 공통적으로 사용할 속성과 메서드가 있다면 Object의 prototype에 속성과 메서드를 추가하면 모든 객체에서 사용할 수 있게 된다. JavaScript에서는 기본적으로 제공해주는 객체가 있는데 이를 통칭해서 내장객체 builtin객체라고 한다. 자주 사용하는 String, Array, Date, JSON, Math, Number... 등이 내장객체인데 이 내장객체에서는 속성과 메서드들을 제공하는데 이 속성과 메서드를 자유롭게 사용하면 보다 편리하게 프로그램을 작성할 수 있게 된다. */ //.. 더보기
js08_events /* 이벤트(evernt)란? 특정의 DOM에 사용자가 마우스 또는 키보드 등의 행위가 일어 났을 때 문서객체에 발생되는 일련의 동작(사건, event)을 말한다. 특정의 이벤트가 발생하면 그 이벤트에 맞는 동작을 하는 기능을 수행할 수 있도록 하게 되는데 일반적으로 동작을 수행하는 것을 함수와 연결한다. 그 함수는 이벤트가 발생되기 전에는 실행되지 않다가 해당 이벤트가 발생되면 수행된다. 이 함수를 이벤트핸들러(Event Handler)라고 한다. 자바스크립트에서 처리하는 이벤트는 1. UI관련 이벤트 load : 웹페이지나 스크립트의 로드가 완료가 되었을 때 unload : 웹페이지가 언로드 될 때 주로, 새로운 페이가 페이지가 요청될 때 error : 브라우저가 자바스크립트의 오류가 발생했거나 요청.. 더보기
js07_DOM /* 문서객체모델(DOM, Document Object Model) 웹브라우저가 html페이지를 인식하는 방식이며 좁은 의미로는 document객체와 관련된 객체를 말한다. 문서객체를 이용하면 html페이지에 태그(요소, element)를 추가, 수정, 삭제할 수가 있다. 문서객체는 텍스트노드를 갖는객체(h1, button, ...)와 텍스트노드를 갖지 않는 객체(body, input, ...)가 있다. 1. 속성 a. innerHTML : 태그 내부의 문자를 조작 b. style : 태그 스타일을 조작 c. setAttribute(, ) : 태그의 속성을 설정 d. getAttribute() : 태그의 속성을 읽기 2. 매서드 a. createElement(태그) : 정의된 태그(문서객체)를 생성 b... 더보기
js06_BOM /* 브라우저 객체모델(Browser Object Model) BOM은 웹브라우저와 관련된 객체의 집합객체를 의미한다. BOM은 window > screen, location, navigator, history, document가 있다. 간단하게 문서객체모델(DOM, Document Object Model)이라 통합해서 부르기도 한다. */ document.write(typeof window + '='+ window, ' '); for(let key in window){ document.write(`${key} = ${window[key]} `); } window.alert('경고창함수는 window객체의 매서드 중 하나이다'); /* window 객체는 브라우저 기반의 모델에서 최상위 객체이다. ale.. 더보기
js05_object 슬슬 자바느낌나,,, /* 객체란(배열 vs 객체)? 객체란 속성과 메서드를 가지고 있는 참조자료형이다. 객체{}는 키와 값을 한쌍으로 갖는 자료형이다. 배열[]은 값만 가지는 객체이다. */ console.log('배열 = ', typeof[]); console.log('객체 = ', typeof{}); //객체 let obj1 = {}; let obj2 = new Object(); let person = { name: '홍길동', age: 1000, speak: function() {console.log('말을 합니다'); } }; //class와 object의 차이점은 class는 데이터가 없고 object는 데이터가 있다. // {}, new Object class Person { name; ag.. 더보기
js04_function /* 함수(function)란? 1. 함수는 기본적으로 호출된 곳으로 처리결과를 전달해주는 기능을 한다. 2. 함수의 호출은 '함수명()'의 형태로 호출한다. 3. 함수의 소괄호 안에는 함수로 임의의 값을 전달하는 매개변수(매개값, 인자, 파라미터...)가 있을 수도 있고 없을 수도 있다. 4. 사용자함수의 정의방법 1) 익명함수 : 이름이 없는 함수 : function() {...} 2) 선언함수 : 이름이 있는 함수 : function 함수명(매개변수...) {...} 내장함수와 사용자(정의)함수 1. 내장함수 : JavaScript에서 기본적으로 제공해 주는 함수를 내장함수라 한다. 예) alter, prompt, confirm... 2. 사용자 정의함수 1) 익명함수 2) 선언함수 */ //익명함.. 더보기
js03_for 이제는 익숙한 for문의 서막,,, //1~10 합계구하기 let sum = 0; sum = sum + 1; sum = sum + 2; sum = sum + 3; sum = sum + 4; sum = sum + 5; sum = sum + 6; sum = sum + 7; sum = sum + 8; sum = sum + 9; sum = sum + 10; document.write('1~10까지 합 = ', sum, ' '); //for문을 사용 // for (초기값, 조건식, 증가식){...} sum = 0; for (i = 1; i 더보기
js02_if // if(5 > 2) { // console.log('비교결과 = true'); // } // console.log('프로그램 종료'); // 실습1. 나이(age)를 입력받아서 18이상이면 성인입니다 // let age = Number(prompt('나이를 입력하세요', 19)); // if(age>=18){ // console.log('성인입니다'); // let age = prompt('나이를 입력하세요'); if(age >= 18){ console.log('성인입니다'); }else{console.log('성인이 아닙니다'); } // 실습3. 임의 숫자를 입력받아서 해당 숫자가 짝수인지 홀수인지 출력 let number = Number(prompt('?')); if(number === null.. 더보기