봉보로봉봉

수업시간만으로 충분하다고 생각하지 말고 수업시간 외에 1시간정도 시간들여 연습하기! 틈틈히 내주는 과제도 열심히 하기! 홈페이지들(참고 사이트 : 디비컷)을 보고 어떻게 구현했을지 생각해보기 https://www.dbcut.com/bbs/index.php 스크립튼가? CSS인가? 어떻게 만들었지? 로직 > 스크롤을 해서 컨텐츠가 하단에 있을때 움직임을 주어라 window height : 786 content : 800 스크롤양 : 800 스크롤양을 비교하면 컨텐츠 위치를 알수잇음 786 html 태그와 js 코드를 분리할 수 있음 외부파일로 분리 : js를 별도의 파일로 분리 > 보다 엄격하게 정보와 제어를 분리 가능 script 파일은 head 태그 보다 페이지의 하단에 위치시키는 것이 더 좋은 방법이..

배열 : 순서가 있는 리스트 let students = ['철수', '영희', ... '영수'] 배열은 []대괄호를 사용하고 ,를 이용해서 구분 배열을 탐색할 때는 고유 번호를 사용 : 인덱스 (index) 순서는 0부터 시작 console.log(students[0]); //철수 console.log(students[1]); //영희 console.log(students[29]); //영수 students[0] = '민정'; 수정도 가능 배열은 문자 뿐만 아니라, 숫자, 객체, 함수 등도 포함할 수 있음 다양하게 넣을 수 있음 length : 배열의 길이를 구할 수 있음 그 요소가 가진 배열의 갯수를 반환 students.length // 30 push() : 배열 끝에 추가 let days = ['월..

method : 객체 프로퍼티로 할당 된 함수 const superman = { name : 'clark', age : 33, fly : function(){ console.log('날아갑니다.') } } superman.fly(); // console에 '날아갑니다.'가 찍힘 > fly는 superman개체의 method const superman = { name : 'clark', age : 33, fly(){ console.log('날아갑니다.') } } 이렇게 function을 생략해 줄여서 쓸 수 있다. +객체의 키와 프로퍼티는 : 를 사용해서 적는다. = 를 사용하면 에러가 남! const user = { name : 'Mike', sayHello : function(){ console.log..

객체 (Object) const superman = { name : 'clark', age : 33, } 객체는 중괄호로 작성하고 키와 값으로 구성된 프로퍼티가 들어감 프로퍼티는 ,로 구분함 마지막 ,는 필요없지만 있는게 수정, 삭제, 이동에 용이 접근 superman.name // 'clark' > .을 사용 superman['age'] //33 > []대괄호 사용 추가 superman.gender = 'male'; > 접근과 같이 .을 사용 superman['hairColor'] = 'black'; > 접근과 같이 []대괄호 사용 삭제 delete superman.hairColor; >delete를 사용 삭제하고 싶은 프로퍼티 앞에 붙여줌 단축 프로퍼티 const name = 'clark'; cons..

함수 선언문 function sayHello(){ console.log('Hello'); } sayHello(); 함수 표현식 let sayHello = function(){ console.log('Hello'); } sayHello(); 위 두 코드는 같은 뜻이다. 차이점은 호출할 수 있는 타이밍 자바스크립트는 위에서 한줄씩 읽어가면서 실행함 > 인터프리터 언어 : 순서대로 읽으면서 즉시 결과를 반환하는 언어 함수 선언문 : 어디서든 호출 가능 sayHello(); function sayHello(){ console.log('Hello'); } 이렇게 실행해도 동작함 자바스크립트 내부 알고리즘 때문 자바스크립트는 실행 전 코드의 모든 함수 선언문을 읽어서 생성해둠 그래서 함수 사용 범위는 더 넓어짐(위..

함수 작성하는 법 fucntion sayHello(name){ console.log(`Hello, ${name}`); } 함수 함수명 매개변수 매개변수 = 인수 매개변수는 없을 수도 있고, 1개일 수도 있고, 여러 개 일 수도 있음 2개 이상이면 ,를 사용해서 구분 sayHello(name); 함수를 작성하고 후에 이렇게만 적어서 호출할 수 있음 사용시마다 매번 귀찮게 여러 줄을 사용하지 않아도 되고 맨 처음 함수만 수정하면 돼서 유지보수가 편함 function sayHello(name){ let msg = `Hello`; if(name){ msg = `Hello, ${name};` } console.log(msg); } sayHello(); >Hello 이렇게 실행하면 Hello만 나옴 그 이유는 매개..

switch 스위치 사실 if else 문을 알고있으면 몰라도 됨 모든 스위치문은 if else 로도 작성할 수 있기 때문 하지만 케이스가 다양할 때 더 간결하게 작성할 수 있기 때문에 사용 switch(평가){ case A : // A일때 코드 case B : // B일때 코드 ... } 위 코드는 아래 코드와 같은 뜻 if(평가 == A){ // A일때 코드 } else if(평가 == B){ // B일때 코드 } let fruit = prompt('무슨 과일을 사고 싶나요?'); switch(fruit){ case '사과' : console.log('100원 입니다.'); case '바나나' : console.log('200원 입니다.'); case '수박' : console.log('400원 입니..

for 반복문 for (let i =0; i < 10; i++) { console.log(i) } 초기값 조건(false가 되면 멈춤) 코드 실행 후 작업 i = 0 i 가 10보다 작으므로 코드실행 i 값 1 증가 i = 1 ... 반복 for (let i =0; i < 10; i++) { 1초기값 2,5조건(false가 되면 멈춤) 4,7코드 실행 후 작업 console.log(i) 3,6코드실행 } 순서대로 계속 반복하다가 조건이 false가 되면8 9빠져나온다. while반복문 let i = 0; while (i < 10) { 조건 console.log(i); } 하지만 이대로 실행하면 안된다 i 는 계속 0이기 때문에 코드는 무한 반복하게 된다. let i = 0; while (i < 10) {..