exam7
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="./js/18_exam_7.js"></script>
</body>
</html>
js
// 문제
// 연습문제 1)
// 현재 날짜를 아래와 같이 주어진다.
// 12시 이전이면 "오전입니다." 라고 출력하고,
// 12시 이후이면 "오후입니다." 라고 출력하는
// 프로그램을 코딩하세요.
// let date = new Date();
// let hour = date.getHours();
// if(hour<12){
// console.log("오전입니다")
// }else{
// alert("오후입니다")
// }
// 2)
// 현재 날짜를 이용해서 아래와 같이 코딩하세요
// 현재 시각이 5시 이전이면 "잠을 자렴..."
// 7시 이전이면 "준비"
// 9시 이전이면 "출근"
// 12시 이전이면 "빈둥빈둥"
// 14시 이전이면 "식사"
// if(hour<5){
// console.log("잠을 자렴...")
// }else if(hour<7){
// console.log("준비")
// }else if(hour<9){
// console.log("출근")
// }else if(hour<12){
// console.log("빈둥빈둥")
// }else if(hour<14){
// console.log("식사")
// }
// 3)
// 연도, 월, 일이 닷(.)으로 구분되어 입력된다.
// 대시를 구분기호로 사용해서 일-월-연도로 바꾸어서
// 코딩용어 : -(마이너스, 대시)
// 출력하세요
// 입력 : 2020.3.4
// 출력 : 4-3-2020
// let a = prompt();
// console.log(a)
// a.split('.');
// let b = a.replace(/\./g, "-");
// console.log(b)
// let c = ""
// for(let i=(b.length-1);i>=0;i--){
// c += b[i];
// }
// alert(c)
// 4) 2중 반복문(이중 루프, 반복문안에 반복문)
// 가로(10개) X 세로(5개) 형태
// 출력 : **********
// **********
// **********
// **********
// **********
let nul =""
for(let i=0;i<5 ;i++){
for(let i=0; i<10; i++){
nul += '*'
}
nul += '\n'
}
alert(nul)
console.log(nul)
function(함수 만들기)
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="./js/01_function.js"></script>
</body>
</html>
js
// 함수(==메소드) : js 내장함수(js 미리 만들어 놓은 함수들)
// 예) .split() , .toFixed() 등
// 함수 사용 이유(why?) : 코드 재사용(코딩 생산성 증가)
// , 코딩 라인이 짧아짐(코딩 효율성 증가)
// TODO: 함수 만드는 법(함수 정의)
// TODO: 1) 함수 1st 형태(패턴)
// 사용법 : (1) 함수 정의
// function 함수명() {
// 실행문;
// }
// (2) 함수 사용(호출)
// 함수명(); // 함수 사용(호출)
// 예제) 안녕하세요 출력하는 함수를 정의하고 사용해 보세요
// 함수 정의 : 1번만 정의(함수명 유일)
// function hello() {
// alert("안녕하세요");
// }
// // 함수 사용(호출)
// hello();
// // 코드 재사용(코딩 라인 짧아짐)
// hello();
// hello();
// 예제 1) "hello world" 출력하는 함수를 작성하고 함수를 사용(호출)하세요
// 입력 : 없음
// 출력 : hello world
// 단 함수를 정의해서 출력하세요
// 함수 정의 : 1번만 정의
// function hello() {
// alert("hello world");
// }
// function hello2() {
// alert("hello world2");
// }
// // 함수 사용(호출), 무조건 hello world 고정됨
// // 만약 hello world2 출력하고 싶으면 ?
// // 기존에 동작하던 소스가 오류가 발생할 가능성이 커짐(소스 수정 지양)
// hello2();
// TODO: 2) 함수 2nd 형태(패턴), 1st 보다 효율적임
// 사용법 : (1) 함수 정의
// function 함수명(매개변수, ...) {
// 실행문 = 실행문 + 매개변수; // 실행문에서 매개변수 활용
// }
// (2) 함수 사용(호출)
// 함수명(값); // 매개변수에 값을 넣으면서 사용함
// 예제 2) 매개변수를 이용해서 함수를 정의하고 "안녕하세요" 출력해 보세요
// 함수정의 (2nd 형태)
// function hello(params) {
// alert(params); // 매개변수를 실행문에 활용, alert("안녕하세요")
// }
// // 함수 사용(호출)
// hello("안녕하세요"); // 매개변수에 값을 넣으면서 사용함(params = "안녕하세요")
// TODO: 3) 함수 3rd 형태
// 변수의 허용범위(스코프) : 항상 중괄호 안에서만 의미가 있음
// 사용법 : (1) 함수 정의
// function 함수명(매개변수, ...) {
// let 결과 = 실행문(매개변수);
// return 결과; // 결과 내보내기(함수 밖으로 값을 내보냄)
// }
// (2) 함수 사용(호출)
// let 변수 = 함수명(매개변수);
// 예제 3) 매개변수와 return 이 있는 함수를 정의해서 hello world 출력하세요
// 함수 정의
// function hello(params) {
// return params + " world"; // params + " world" : 결과 내보내기 됨
// }
// // 함수 사용(호출)
// // "hello world" 결과가 나와서 result 변수에 저장됨
// let result = hello("hello");
// alert(result);
// 예제 4) 어떤 수를 매개변수로 받아서 제곱을 구하는 함수를 작성하세요
// 입력 : 없음
// 출력 : 9
// 함수 호출 : f(3), 매개변수 사용하는 함수
// 함수 3rd 형태 적용 : (1) 함수 정의
// function f(params) {
// // 제곱 : params * params;
// // return : 함수 밖으로 결과 내보내기 예약어
// return params * params; // 제곱 결과 내보내기(밖으로)
// }
// // (2) 함수 사용
// let result = f(3); // f(3) 결과가 result 변수에 저장됨
// // 결과 출력
// console.log(result);
// 예제 5) 원의 넓이 구하기 함수를 작성하세요.
// 원의 넓이 공식 : 반지름 * 반지름 * 3.14
// 입력 : 5
// 출력 : 78.5
// 단, 함수 작성해서 결과 를 출력하세요
// 함수 정의 : 3rd 형태
// function getCircle(r) {
// // 변수 정의
// let result = r * r * 3.14; // 원의 넓이
// // result 결과 밖으로 내보내기 : return 변수명;
// return result;
// }
// // 입력값
// let num = Number(prompt("반지름")); // 5
// // 함수 사용(호출)
// // let 변수명 = 함수명(값);
// let result2 = getCircle(num);
// alert(result2); // 결과 출력
// 예제 6) 원의 둘레 구하기 함수를 작성하세요.
// 원의 둘레 공식 : 반지름 * 2 * 3.14
// 입력 : 6
// 출력 : 37.68
// 함수 정의
// function getLength(r) {
// let result = r * 2 * 3.14;
// return result; // 함수 밖으로 결과 내보내기
// }
// // 입력값
// let num = Number(prompt("둘레")); // 6
// // 함수 사용(호출)
// // let 변수명 = 함수명(값);
// let result2 = getLength(num);
// alert(result2); // 결과 출력
// 예제 7) 시작수 , 끝수가 주어지면 시작수~끝수까지의 합계를
// 구하는 함수를 작성하세요.
// 입력 1: 100
// 입력 2: 300
// 결과 : 40200
// 단, 함수를 정의해서 코딩하세요
// 함수 정의
function sumInt(first, end) {
let sumVal = 0; // 누적합 변수 초기화
for(let i=first; i<=end; i++) {
// 누적합
sumVal = sumVal + i;
}
return sumVal; // 함수 밖으로 결과 내보내기
}
let first = Number(prompt("시작값")); // 100
let second = Number(prompt("끝값")); // 300
// 함수 사용(호출) : 3rd 형태
// let 변수명 = 함수명(값);
let result = sumInt(first, second);
// 결과 출력
alert(result);
object(객체 만들기)
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="./js/02_object.js"></script>
</body>
</html>
js
// 객체 : 실생활에서 보이는 모든 것을 객체라고 함
// 예) 사람, 사물 등
// 객체의 요소 : 1) 속성(특징나타냄, 90%), 2) 함수(행동, 동작)
// 비교) css 사용법
// 선택자 {
// 속성: 값;
// 속성2: 값2;
// ...
// }
// TODO): 객체 사용법(작성법)
// let 변수명 = {
// 속성: 값,
// 속성2: 값2,
// ...
// }
// 예제 ) 안지영 이라는 사람의 속성(특징)을 나열하고 객체를 만드세요.
// 객체 정의
let member = {
name: "안지영",
email: "hong@naver.com",
phone: "010-1234-5678",
age: 24,
job: true
}
// 객체 속성 출력
// 사용법 : 객체명.속성명 => 값이 출력됨
console.log("name" , member.name);
console.log("email" , member.email);
console.log("phone" , member.phone);
console.log("age" , member.age);
console.log("job" , member.job);
// 연습문제 1)
// 객체 정의 하고 객체 출력하기
// 고양이에 대한 특징을 alert 을 이용해서 화면에 출력하세요
// 속성 :
// 이름: 나비
// 색깔: 황토색
// 무게: 10kg
// 코드번호: 1234
// 전화번호: 010-1234-5678
// 객체 정의
// let cat = {
// name: "나비",
// color: "황토색",
// weight: "10kg",
// code: 1234,
// phone: "010-1234-5678"
// }
// // 객체 속성 출력
// // 사용법 : 객체명.속성
// console.log("name", cat.name);
// console.log("color", cat.color);
// console.log("weight", cat.weight);
// console.log("code", cat.code);
// console.log("phone", cat.phone);
// 연습문제 2)
// 토끼 객체를 만들어서 화면에 출력해 보세요
// 속성 :
// 이름 : 삼식이
// 색깔 : 갈색
// 무게 : 5kg
// 코드번호: 1234
// 객체 정의
// let rabbit = {
// name:"삼식이",
// color: "갈색",
// weight: "5kg",
// code: 1234 // 자료형 모두 사용가능(문자열, 숫자, 참/거짓 등)
// }
// // 객체 속성 출력
// // 사용법 : 객체명.속성명
// console.log("name", rabbit.name);
// console.log("color", rabbit.color);
// console.log("weight", rabbit.weight);
// console.log("code", rabbit.code);
// 자료형 : 문자열(string), 숫자(number), 참/거짓(bool/boolean)
// 배열(객체), null, undefined, 참고)Symbol(1%)
// 총 6개
// TODO: null 자료형 : 변수는 있으나 공간이 비어 있는 것(js, 자바, c/c++ 등)
// 예제) 변수에 null 넣기
let char1 = null; // 사용법, 과거코딩(변수 초기화 많이 사용)
// 현재는 null 초기화 권장하지 않음(버그가 많이 발생함)
let char2 = ""; // 빈문자열 초기화
let num = 0; // 숫자 초기화
// 메모리 : 프로그램 실행시키면 -> 컴퓨터 메모리에 올라감
// TODO: undefined 자료형 : (js 만 있음 , 다른 언어는 없음)
// : 객체의 속성명이 정의되지 않은 것(않은 상태)
// 객체 정의
let dog = {
name: "삼순이",
age: 2
}
console.log("name", dog.name);
console.log("age", dog.age);
// undefined 에러가 발생함
console.log("code", dog.code);
exam1
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="./js/03_exam_1.js"></script>
</body>
</html>
js
// 함수 문제 풀이
// 연습문제 1
// 함수를 사용해서 출력하세요
// 입력 : 10
// 출력 : 20
// function a() {
// alert((b+10));
// }
// let b = Number(prompt())
// a()
// 연습문제 2
// 함수를 사용해서 출력하세요.
// 짝수이면 "even" 출력하고, 홀수이면 "odd" 출력하세요.
// 입력 : 2
// 출력 : even
// function b(a) {
// if(a%2==0){
// alert("even")
// }else{
// alert("odd")
// }
// }
// let a = Number(prompt())
// b(a)
// 함수를 이용해서 아래를 작성하세요.
// 1 ~ 10 까지의 합을 출력하세요.
// 입력 : 10
// 출력 : 55
// let summ= 0;
// function sum(a){
// for(let i=1; i<=a;i++){
// summ += i
// }
// alert(summ);
// }
// let a = Number(prompt());
// sum(a)
// 4) 함수로 만들어서 풀기(1st, 2nd, 3rd 아무거나)
// 입력 1: 1
// 입력 2: 2
// 입력 3: 3
// 출력 : 1
// 최소값 구하기
// function min() {
// mm = Math.min(a,b,c);
// alert(mm)
// }
// let a = Number(prompt("입력 1"));
// let b = Number(prompt("입력 2"));
// let c = Number(prompt("입력 3"));
// min()
// 5) 함수로 만들어서 풀기(1st, 2nd, 3rd 아무거나)
// 5의 배수이면 "5의 배수이다" 출력하고,
// 아니면 "5의 배수가 아니다" 라고 출력하세요.
// 입력 : 5
// 출력 : 5의 배수이다.
// 입력값 : 5
// 함수 정의 : 2nd 함수 형태(매개변수 있고, return 없음)
// function MultiFive(params) {
// // 5의 배수 구하는 코딩하면 됨
// if(params % 5 == 0) {
// alert("5의 배수이다.");
// } else {
// alert("5의 배수가 아니다.")
// }
// }
// // 함수 사용(호출)
// // 사용법 : 함수명(입력값)
// let num = Number(prompt("숫자")); // 5
// MultiFive(num);
// 6) 함수를 이용해서 코딩하세요
// 3가지 숫자를 입력받아 합계와 평균 구하기
// 입력 : 80
// 입력2 : 90
// 입력3 : 100
// 결과 : 270
// 90
// 함수 정의 : 2nd 형태
// function MyAvg(params, params2, params3) {
// // 함수안에서 문제를 푸는 코딩을 하면됨
// // 합계
// let sumVal = params + params2 + params3;
// // 평균
// let avgVal = sumVal/3;
// // 출력
// console.log(sumVal);
// console.log(avgVal);
// }
// // 함수 사용(호출)
// // 사용법: 함수명(값, 값2, 값3)
// let num = Number(prompt("숫자")); // 80
// let num2 = Number(prompt("숫자")); // 90
// let num3 = Number(prompt("숫자")); // 100
// MyAvg(num, num2, num3); // 함수 사용