Front-End/JavaScript (18) 썸네일형 리스트형 JavaScript #10 (객체) 속성(property), 함수(method)를 함께 담을 수 있음. {키(key) : 값(value} 쌍의 딕셔너리(dictionary) 형태로 표현. const account = { userName: "홍길동", userAge: 30, userEmail: "hong@example.com"}; 객체의 속성을 직접 접근(객체[" "])해서 해당 속성의 값을 바로 호출할 수도 있다.const product = { id: 101, name: "노트북", price: 1200000,}console.log(product["name"]); 예문 - 리터럴 방식 (*예를 들면 json 형식 파일에 담기는 내용 등등)const user = { name: "철수", // na.. JavaScript #9 (이벤트) HTML 요소에 사용자의 행동을 감지해 동작을 연결onclick, onchange, onmouseover, addEventListener() 사용하나의 요소에 여러 이벤트를 연결하려면 addEventListener() 사용 이벤트 종류는 아래 페이지에서 확인. https://velog.io/@hyhy9501/%EC%9B%B9-%EA%B0%9C%EB%B0%9C-%EA%B8%B0%EC%B4%88-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-9.-Event-%EC%A2%85%EB%A5%98 [웹 개발 기초 자바스크립트] 9. Event 종류웹에서 일어날 수 있는 이벤트는 매우 다양하다. 아래는 자주 사용되는 이벤트의 카테고리와 그에 속하는 일부 이벤트의 .. JavaScript #8 (함수 - 익명/화살표 + 연습문제) 익명함수 : 함수를 변수에 할당할 수 있음.const hello = function () { console.log("안녕하세요");};hello(); 화살표 함수 (ES6부터 지원)const hello = () => { console.log("안녕하세요");}; 연습문제 - 사칙연산 함수// 더하기 함수function add(a, b) { return a + b;}const add2 = function (a, b) { return a + b;};// 빼기 함수function subtract(a, b) { return a - b;}const subtract2 = function (a, b) { return a - b;};// 곱하기 함수 function multiply(a.. JavaScript #7 (함수 - function) 자주 사용하는 코드를 묶어서 이름을 붙여 놓은 것. 구문function 함수이름(매개변수) { 실행할 코드; return 결과값;} ※ 함수는 호출(함수이름())해야 실행됨. 예문function greet() { alert("반갑습니다!");}greet(); // 호출 실습function add(a, b) { return a + b; }let sum = add(3, 5);document.write(sum) 답은 8 function showName() { let name = "홍길동"; name = "이순신"; console.log(name);} showName(); console.log("outer" + name); 아래의 console.log에서 na.. JavaScript #6 (반복문 - while, break/continue) 구문while (조건) : 조건이 참인 동안 반복do { 실행문 } while (조건): 조건과 상관없이 1회는 무조건 실행 - 조건을 이상하게 걸면 무한 반복에 빠질 수 있으니 주의. 예문// 숫자를 입력 받아 계속 출력, exit 입력 시 중지let num = prompt("숫자 입력");while (num !== "exit") { num = prompt("숫자 입력"); console.log(num) 실습// 사용자가 입력한 숫자까지 1씩 증가하면서 출력해보세요.let num = prompt("숫자 입력");let i = 1;while (i 연습 문제 - 팩토리얼 계산기// 팩토리얼 계산기// n! = n * (n - 1) * (n - 2) * ... * 1let num = prom.. JavaScript #5 (반복문 - for) 구문 for (초기값; 조건식; 증감식)for (let i = 1; i (초기 값에서 변수 정의; 변수에 비교할 조건; 조건이 맞을 때까지 증/감) 예문// 1부터 10까지 숫자를 차례대로 출력해보세요.for (let i = 1; i 실습// 1부터 100까지 숫자 중에서 5의 배수만 출력해보세요.for (let i = 1; i // 1~100까지 숫자 중에서 짝수만 합산하기let sum = 0;for (let i = 1; i ※ if 안에 묶여있는 sum += i; 는 코드 단 한 줄이라 중괄호{}로 안 묶어도 무방! 중첩 for 문for 문 안에 for 문이 들어가는 구문 구구단이나 별 찍기 같은 반복이 중첩으로 들어가야 하는 경우. 예문// 구구단 2단을 출력해보세요.for (le.. JavaScript #4 (연습문제) 1. 다중 조건 분기 나이를 입력하세요 확인 See the Pen age_checker by Cheolho Jang (@chiro-J) on CodePen.">See the Pen age_checker by Cheolho Jang (@chiro-J) on CodePen. 2. 시험 점수 계산기 과목 점수 입력 국어: 수학: 영어: 과학: 계산하기 결과 See the Pen exam_score_calc by Cheolho Jang (@chiro-J) on CodePen.">See the Pen exam_score_calc by Cheol.. JavaScript 기초 #3 (제어문, if&else, switch) if&else 문 let num = prompt("숫자를 입력하세요");if (num % 3 === 0) { alert("3의 배수입니다.");} else { alert("3의 배수가 아닙니다.");} 예문let num = 2;if (num % 3 === 0) { alert("3의 배수입니다.");} else if (num % 7 === 0) { alert("7의 배수입니다.");} else { alert("3의 배수가 아닙니다.");} 실습 - 홀수 짝수 판별기let num = Number(prompt("숫자를 입력하세요."));if (num % 2 == 0) { alert("짝수");} else { alert("홀수");} 연습문제 1. 나이에 따라.. 이전 1 2 3 다음
