스터디

오늘 강의에서는 EventHandler에 대해 간단히 알아보았다. 지난 강의 에서 HTML의 엘리먼트를 자바스크립트에서 접근하는 방법으로 ID 로 접근하는 document.getElementById() CLASS 로 접근하는 document.querySelector() 오늘은 CLASS 이름으로 엘리먼트에 접근해서 이벤트핸들러를 적용해보았다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 Document Good bye~! Colored by Color Scripter cs 위와 같이 HTML 페이지가 작성 돼 있을 때 div 태그안의 h1태그에 접근하는 방법은 아래와 같다. 1 const h1 = document.querySelector("div.hello:first-..

#3.0 The Document Object #3.1 HTML in Javascript #3.2 Searching For Elements 오늘은 html Elements에 자바스크립트로 접근하고, 변경하는 법에 대해 알아보겠다. console 창에 "document.title" 처럼 입력하면 html 파일의 Element를 가져온다. 엘리먼트에 접근할 수 있을 뿐만 아니라 값을 변경할 수도 있다. document.title = "asdfasdf" 이와 같이 입력하면 html의 title 엘리먼트에 어떻게 입력 돼 있든 자바스크립트로 변경한 값으로 나타난다. 다음으로는 getElementById()에 대해 알아보자. 쉽게 얘기하면 html 엘리먼트에 부여한 id값에 접근하는 것이다. 1 2 3 4 Grab..

#2.13 Conditionals 오늘은 Prompt로 숫자를 입력 받아서 19세 미만이면 "미성년자" 19세부터 60세까지는 "술 마시자" 60세 이상이면 "당신 마음대로 하세요." 를 출력해 보겠다. 단, 문자 or 음수를 입력할 경우 "양수를 입력하세요." 라는 메시지를 출력하겠다. 1 2 3 4 5 6 7 8 9 10 11 // #2.13 Conditionals const age = parseInt(prompt("How old are you?")); if(isNaN(age) || age 미성년자 19이상 60이하이면 > 성인 60세 초과이면 > 마음대로 하세요. || (OR) true true true true false true false true true false false false && ..

오늘은 여태까지 배운 것을 복습. 객체를 만들 수 있고, 함수를 만들 수 있다. * 간단한 계산기를 만들어 보자. 매우 간단하다 부끄럽슴돠. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 const calculator = { add: function(a,b){ console.log(a+b); }, minus: function(a,b){ console.log(a-b); }, times: function(a,b){ console.log(a*b); }, divide: function(a,b){ console.log(a/b); }, powerOf: function(a,b){ console.log(a**b); }, }; calcul..

#2.6 Objects #2.7 Functions 객체는 중괄호{}로 감싸져 있고, 콜론:으로 구분된 이름/값 쌍들이 쉼표로 분리된 목록의 형태 객체를 만들 때 규칙 1. property 이름 중복 불가 2. property의 이름과 property의 값 사이는 콜론:으로 구분한다. 3. property를 추가할 때는 ,(쉼표)를 붙여준다. 4. property값은 어느 Type이나 가능하다(배열과 달리 이질형 데이터 저장 가능) 객체 접근 방법 객체이름.property이름 or 객체이름["property이름"]과 같은 형식으로 접근. 대괄호[] 표현은 변수를 사용할 때 객체 특징 1. 순서가 없는 데이터 모음. 2. 키와 값의 쌍으로 구성된 데이터의 모음 3. 배열처럼 index로 순차적 접근이 아닌 ..

#2.3 Const and Let #2.4 Booleans #2.5 Arrays 변수 선언 방법 const - 변수를 상수로 선언한다.(한번 대입된 값을 변경할 수 없다.) - 값을 변경하려하면 변경할 수 없다고 알려준다. let - 업데이트?!가 가능한 형태로 변수를 선언한다.(프로그램 중 내가 원하는 값으로 바꾸며 사용할 수 있다.) var - 예전의 자바스크립트에서 변수를 선언할 때 사용하던 예약어(아무런 기능 없다.) 니코쌤의 규칙 : 기본적으로 const를 사용, 필요 시 let을 사용 / var는 사용하지 말고, 알고만 있자. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 3..

니코쌤의 JS 클론만들기 시작 #2.1 Basic Data Types #2.2 Variables 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 console.log(33445); //콘솔에 log or print 함. console.log("lalalal"); //콘솔에 log or print 함. console.log('qasd1'); //'' "" 상관 없음, 짝만 맞춰주자 //파일을 위해서 아래로 읽는다. console.log(5+2); console.log(5-2); console.log(5/2); //프로그래밍을 잘하려면 게을러지자! const a = 7; //const 변하지 않는 상수 const b = 3; const m..