목록Dev/HTML CSS JS (20)
Learn & Record
1. 이벤트 설정하기 - 이벤트 event : 모든 문서 객체는 생성되거나, 클릭되거나, 마우스를 위에 올리거나 할 때 발생. - 이벤트가 발생할 때 실행할 함수는 addEventListener()메소드를 사용해서 콜백 함수로 등록 - 문서객체.addEventListener(이벤트 이름, 콜백 함수); - 이벤트가 발생할 때 실행할 함수(콜백 함수)를 이벤트 리스너 event Listener 또는 이벤트 핸들러 event handler 라고 함 클릭 횟수 : 0 2. 이벤트 해제하기 - 이벤트를 제거할 때는 removeEventListener() 메소드를 사용 - 문서 객체.removeEventListener(이벤트 이름, 이벤트 리스너); 클릭 횟수 : 0 이벤트 연결 이벤트 제거 이벤트 연결 상태: ..
1. 버튼+함수 // // addEventListener 메서드는 동일한 요소에서 발생한 동일한 이벤트에 대해 // 하나 이상의 이벤트 핸들러를 등록할 수 있음 Click me! 2. 이벤트 핸들러 제거 - addEventListener 메서드로 등록한 이벤트 핸들러를 제거할려면 EventTarget.prototype.removeEventListener() 메서드 - removeEventListener 메서드에 전달할 인수는 addEventListener 메서드와 동일 - 단, addEventListener 메서드에 전달된 인수와 removeEventListener 메서드에 전달한 인수가 일치하지 않으면 - 이벤트 핸들러가 제거되지 않음 Click me! 3. 연습문제 클릭 제거 Register! - 배..
1. 기본 매개변수 - 매개 변수에 기본 값을 지정. 매개 변수가 들어오지 않는 경우에 기본 값으로 대체 - 기본 매개 변수와 일반 매개 변수를 섞어서 사용할 경우에는 기본 매개 변수가 오른쪽으로 가야됨 2. 이름 충돌 문제 - 자바 스크립트에서 선언적 함수 보다 익명함수를 생성하고 바로 호출하는 패턴이 많은 이유 : 이름 충돌 방지 - 다른 프로그램에 비해 자바 스크립트는 - 1) 라이브러리를 많이 사용하고 - 2) 한 페이지에 사용하는 프로그램이 여러개의 파일로 나누어져 있거나 여러개로 분리되어 있어서 - 다른 프로그래밍 언어보다 이름 충돌되는 경우가 많음 - 익명함수를 사용해서 이름이 중복되는 함수를 만드는 것을 방지하게 됨 /* 이름 충돌 문제 발생 */ /* 다른 곳에서 가져온 자바스크립트 코드..
1. 나머지 매개변수 rest parameter /* 나머지 매개변수 : rest parameter 가변 매개변수 함수 : 호출할 때 매개변수의 갯수가 고정적이지 않는 함수 */ - 자바 스크립트에서는 이러한 함수를 구현할 때 '나머지 매개변수'를 사용 - 함수 매개변수 앞에 마침표 3개(...)를 입력하면 매개변수가 배열로 들어옴 function sample(...items) { console.log(items); } sample(1,2); // [1,2] sample(1,2,3); // [1,2,3] sample(1,2,3,4); // [1,2,3,4] function sample2nd(items) { console.log(items) } sample2nd([1,2]) sample2nd([1,2,3]..
1. while 반복문 - if 조건문과 형태가 매우 비슷. 다른 점은 문장을 한 번만 실행하고 끝내는 것이 아니라 불 표현식이 true면 계속해서 문장을 실행한다는 점 - while 반복문의 경우 조건이 변하지 않는다면 무한히 반복 실행하므로 - 조건을 거짓으로 만들 수 있는 문장이 포함되어 있어야 함 - 반복문이 무한 반복 되는 것을 무한 루프 infinite loop 2. while문으로 배열 출력하기 - while 반복문과 for 반복문은 서로 대체해서 사용할 수 없음 - 보통 특정 횟수 반복할 때 for, - 조건에 큰 비중이 있을 때는 while. 예) 특정 시간동안 어떤 데이터를 받을 때 까지 3. 연습문제 /* 커피 1잔을 300원에 판매하는 커피자판기가 있습니다. 이 커피자판기에 돈을 넣..
1. 활용 나이 계산하기 (결과 값 표시하기) - 변수 선언 - 이름은 의미가 있게 만든다 - 단어의 연결일 때는 뒤의 단어의 첫글자를 대문자로 한다.(카멜법) - 선언을 할 수 없는 이름도 있다 - 문자, 밑줄, 달러기호, 숫자만 사용 할 수 있고, 숫자는 앞에 오지 못한다. 나이 계산하기 (결과 값 표시하기) - thisYear을 프로그램이 실행되는 시점의 연도를 가지고 오도록 - birthYear을 사용자에게 입력을 받도록 나이 계산하기 (결과 값 표시하기) 2. 산술연산자 3. 복합대입 연산자 4. 증감연산자 : 복합 대입 연산자를 약간 간략하게 사용한 형태 - a++ : 기존의 변수 값에 1을 더함. 후위 - ++a : 기존의 변수 값에 1을 더함. 전위 - a-- : 기존의 변수 값에 1을 뺌..