CONTENTS
JavaScript
6.배열
7.조건문
연습문제
-------------------------------------------
JavaScript
6.배열
◎배열
-서로 관련된 변수들을 묶어 하나의 이름으로 공유한 자료형
◎배열의 필요성
-데이터를 담기 위해서는 변수와 값이 필요한데 관련된 내용의 데이터들이 100개 이상이라면 변수 선언과 초기화 및 접근에서 너무 힘듬, 이때 배열을 사용하면 관련 문제들이 사라짐
var userName01 = "HongGilDong";
var userName02 = "이순신";
var userName03 = "김유신";
...
var userName100 = "세종대왕";
위의 문장은 아래와 동일
var userName = ["HongGilDong", "이순신", "김유신", ..., "세종대왕"];
위에서 'userName'은 배열명이고 '0'번 방에 "HongGilDong", '1'번 방이 "이순신, '100'번 방이 "세종대왕" 각각 할당되었음을 의미함. 이와 같이 각 방은 고유 일련번호로 지정되며 이를 "인덱스"라고 힘. 배열의 인덱스를 활용하여 반복문 등에서 매우 유용하게 데이터를 다룸. 물론 여러 자료형의 데이터를 담을 수 있음.
◎배열의 생성
1)리터럴로 배열 생성
-배열에 들어가는 값들을 배열 선언과 함께 할당. 대괄호([]) 안에 리터럴값을 제공하고 콤마(,)롤 구분
var fruits = ["apple", "banana", "orange", "pear"];
배열의 생성
2)Array 객체를 이용하여 배열 생성
-리터럴 배열 생성은 실제 데이터 값이 요구됨. Array 객체는 실제 데이터 값이 없는 상태의 배열을 생성하고, 필요에 따라 값을 채워나가는 방식
var friends = new Array();
//var 배열이름 = 새로운 객체 생성을 하겠다 의미하는 키워드 + 객체가 배열임을 의미
배열의 생성2
-배열에 값을 할당할 때에는 인덱스로 선택적인 값 할당이 가능함. 값이 할당되지 않은 곳은 undefined로 인식됨
3)리터럴과 Array() 혼합 방식
-배열을 선언할 때에 2가지 방법을 혼합하여 하나의 문장으로 정의하여 선언할 수 있음
var fruits = new Array("apple", "banana", "orange", "pear");
◎배열의 특징
1) 하나의 배열에 여러 종류의 자료형을 가진 데이터를 저장 할 수 있음
var userSpec = ["HongGilDong", 123, new Date(), false];
ex) 문자열형, 숫자형, 객체형, 부울형 등
2) 배열을 선언할 떄 배열의 크기를 정의하지 않음
-일반적으로 다른 언어에서는 배열의 크기를 지정하면, 그 크기를 변경할 수 없음. 따라서 배열의 크기 밖의 요소에 데이터를 할당하면 오류가 발생함.
-이와 달리, 자바스크립트는 배열의 크기를 지정하지 않고 배열을 선언할 수 있으며, 배열 크기보다 큰 값을 할당하면 배열 크기가 자동으로 확대되어 그 값이 할당됨.
3) 인텍스 대신 키(Key)를 이용하여 값을 할당 할 수 있음
-키를 사용하면 배열의 크기를 명확히 지정할 수 없으나 키 값에 의미를 부여할 수 있기 때문에 필요에 따라서는 배열 요소의 접근성이 매우 용이함
4) 배열의 크기
-배열의 크기는 인덱스로 지정하여 값이 할당되어 저장된 곳까지임. 일반적으로 언어에서는 배열의 크기를 벗어나면 오류가 발생하지만 자바스크립트는 오류가 발생하지 않음
배열의 특징
*length: 데이터 갯수가 몇 개까지 인지
7.조건문
◎조건문
-특정 조건이 참인지 거짓인지에 따라 코드의 흐름을 제어하는 구문
*주로 프로그램에서 특정 상황에 따라 서로 다른 동작을 수행하고자 할 때 사용됨
◎if문
1)사용법
| if (조건식) { //조건식이 참일 때의 표현식 } |
-조건식이 참이면 중괄호({}) 안의 문장(표현식)을 실행하고, 거짓이면 if문 다음 문장으로 진행하게 됨
기본 if문
◎if~else문
1)사용목적
-조건이 거짓일 때 실행해야 하는 문장을 else 다음에 기술
2)사용법
| if (조건식) { //조건식이 참일 때의 표현식 } else{ //조건식이 거짓일 때의 표현식 } |
if-else문
◎if else-if문
1)사용목적
-결과가 2개인 경우가 아닌 조건을 여러개로 나누어 결과를 여러개로 보고싶을 때 사용함
2)사용법
| if (조건식1) { //조건식1이 참일 때의 표현식 } else if (조건식2) { //조건식2가 참일 때의 표현식 }else { //조건식1과 2가 모두 거짓일 때의 표현식 } |
if else-if문
* else if 추가 가능
◎논리연산자 결합
| if (조건식1 && 조건식2) { //조건식1과 조건식2가 모두 참일 때의 표현식 } else{ //조건 중 하나라도 거짓일 때의 표현식 } |
◎중첩된 if문
1)개념
-if문 안에 if문을 또 사용하는 것
2)사용법
| if (조건식) { if (조건식) { } } |
중첩된 if문
◎switch문
1)개념
-if문과 마찬가지로 조건에 따라 프로그램 수행 흐름을 분기시키기 위해 사용됨. if문이 참과 거짓으로 방향이 결정되면, switch문은 실행 경로가 여려개 중에 하나가 결정됨. 조건식이 아닌 제어식에서 결정된 값에 따라 실행문장이 실행됨.
2)사용법
| switch (제어식) { case value01: 표현식1 break; case value02: 표현식2 break; case defalt: 표현식3 break; } |
switch문
연습문제
<변수>
| 1 | 나는 500원의 돈이 있어서 300원짜리 두부를 사서 엄마한테 "오는 길에 두부 사왔어요!"라고 얘기했어 이때 필요한 변수는 무엇일까? (내 수중의 돈, 두부의 원가는 바뀔 수 있음) |
// 내 수중의 돈 let money = 500; // 두부 가격 let tofuPrice = 300; document.write("오는 길에 두부 사왔어요"); |
| 2 | 나는 500원의 돈이 있어서 300원짜리 두부를 사서 엄마한테 "오는 길에 두부 사왔는데 잔돈 얼마 받았다"라고 얘기했어 이때 필요한 변수는 무엇일까? (내 수중의 돈, 두부의 원가는 바뀔 수 있음) |
// 내 수중의 돈 let money = 500; // 두부 가격 let tofuPrice = 300; let change = money - tofuPrice; document.write("오는 길에 두부 사왔는데 "+change+"원 잔돈 받았어"); |
| 3 | 나는 500원의 돈이 있어서 300원짜리 두부 n개를 사려고한다. (두부 개수 n는 prompt()로 입력받을 것) 내 수중의 돈이 구매하려는 값보다 많으면 "두부를 n개 샀고, 잔돈 얼마 남았다"라고 엄마한테 얘기하고 내 수중의 돈이 구매하려는 값보다 적으면 "돈이 부족해서 두부를 못 샀다" 라고 엄마한테 얘기할거야 이때 필요한 변수는 무엇일까? (내 수중의 돈, 두부의 원가, 두부 개수는 바뀔 수 있음) |
// 내 수중의 돈 let money = 500; // 두부 가격 let tofuPrice = 300; let tofuCount = parseInt(prompt()); let change = money - tofuPrice*tofuCount; if (money >= 0) { document.write("두부 "+tofuCount+"개 샀고, 잔돈은 " + change + "원입니다."); } else { document.write("돈이 부족합니다. 두부를 살 수 없습니다."); } |
| 4 | 바빠서 두부 사올 시간이 안되어서 동생에게 심부름 시킬거야. 심부름값을 주고 구매하려는 두부 개수 n를 알려주면, 동생은 두부 몇개를 샀고, 잔돈이 얼마인지, 돈이 부족하면 부족해서 못 샀다고 알려줄거야. 이때 필요한 변수는 무엇이며, (심부름값, 두부의 원가, 두부 개수는 바뀔 수 있음) 이때 필요한 함수를 구현하세요. (호출도 필요) |
// 심부름값 let money = 500; // 두부 가격 let tofuPrice = 300; let tofuCount = parseInt(prompt()); // 동생의 심부름 기능/순서(함수) function buyTofu(money, tofuCount, tofuPrice) { let change = money - tofuPrice*tofuCount; if (change >= 0) { document.write("두부를 샀습니다. 잔돈은 " + change + "원입니다."); } else { document.write("돈이 부족합니다. 두부를 살 수 없습니다."); } } // 함수 호출 buyTofu(money, tofuCount, tofuPrice); |
<조건문>
| 1 | 미로에 들어섰습니다. 당신은 왼쪽 혹은 오른쪽으로 갈 수 있습니다. 오른쪽 길로 갈건지 안내를 하고 "yes" 혹은 "no"의 값을 받습니다. 해당 변수를 생성하세요. |
let choice = prompt("모험 중, 당신은 두 갈래 길을 만났습니다. 오른쪽 길로 가시겠습니까? (yes/no)"); |
| 2 | 만약 선택이 yes라면 상황 설명을 해줍니다. 랜덤값 생성이 Math.random(); (0~1사이의 값)일 때 0.5 미만이면 우연히 고블린을 만나 전투를 시작한다고 안내하고 0.5 이상이면 아름다운 폭포를 발견했다, 체력이 회복됩니다 라고 안내하세요. |
if (choice === "yes") { console.log("오른쪽 길로 들어섭니다..."); let encounter = Math.random(); // 0~1 사이의 랜덤 값 생성 if (encounter < 0.5) { document.write("우연히 고블린을 만났습니다! 전투를 시작합니다."); } else { document.write("아름다운 폭포를 발견했습니다! 체력이 회복됩니다."); } } |
| 3 | 만약 선택이 no라면 상황 설명을 해줍니다. 만약 랜덤값이 0.5 미만이면 신비로운 마법사를 만났다. 아이템을 받았다는 안내를 하고. 0.5이상이면 어둠 속에서 괴물을 만났습니다. 도망칩니다 안내를 합니다. |
else { document.write("왼쪽 길로 들어섭니다..."); let encounter = Math.random(); // 0~1 사이의 랜덤 값 생성 if (encounter < 0.5) { document.write("신비로운 마법사를 만났습니다! 마법의 아이템을 받습니다."); } else { document.write("어둠 속에서 괴물을 만났습니다! 도망칩니다."); } } |
| 4 | 미로를 탈출했다는 안내를 합니다. | console.log('미로를 탈출했습니다'); |
'웹프로그래밍 > JavaScript' 카테고리의 다른 글
| 프로그래밍 언어 응용 29일차 (24/12/19) (4) | 2024.12.19 |
|---|---|
| 프로그래밍 언어 응용 28일차 (24/12/18) (0) | 2024.12.18 |
| 프로그래밍 언어 응용 27일차 (24/12/17) (0) | 2024.12.17 |
| 프로그래밍 언어 응용 25일차 (24/12/13) (0) | 2024.12.13 |
| 프로그래밍 언어 응용 24일차 (24/12/12) (0) | 2024.12.12 |