[Javascript] 제어문, 스코프, 블록문, 조건문

« 2025/02 »
일	월	화	수	목	금	토
						1
2	3	4	5	6	7	8
9	10	11	12	13	14	15
16	17	18	19	20	21	22
23	24	25	26	27	28

[목차]

01. 제어문

💡

➡️ 조건에 따라 코드 블록을 실행(조건문)하거나 반복실행(반복문)할 때 사용합니다. ➡️ 코드의 실행흐름을 인위적으로 제어할 수 있습니다.

실행흐름

02. 블록문

💡

0개 이상의 문을 중괄호로 묶은 것, 코드블록 혹은 블록문이라고 합니다.

➡️ 블록문은 단독으로 사용 가능

➡️ 일반적으로 제어문이나 함수 선언문 등에서 사용

➡️ 블록문의 끝에 세미콜론을 붙이지 않음

[코드예제] 블록문.js

// 블록문
{
	var ex = 10;
	console.log(ex); // 10
}

03. 스코프

💡

유효범위(블록)

var ➡️ 함수 스코프(유효범위) / let, const ➡️ 블록 스코프(유효범위)

➡️ 참조 대상 식별자를 찾아내기 위한 규칙

[코드예제1] 스코프1.js

let n1 = 0; // 전역변수
if(true) {
	n1 = 10; // 전역변수 블록유효범위 내부에서 쓰일 수 있다.
}
console.log(n1); // 10

if(true) {
	let n2 = 0; // 유효범위 내에서 선언된 변수라 지역변수라한다.
}
console.log(n2); // 에러! 지역변수는 유효범위 외부에서 쓰일 수 없다.

[코드예제2] 스코프2.js (let vs var)

let n1 = 10;
{ // 블록 시작
  n1 = 20;
} // 블록 종료
console.log(n1, 'n1은 블록을 기준으로 전역변수'); // 20
let n2 = 20;
{
  // console.log(n2, 'n2는 블록을 기준으로 지역변수'); let 호이스팅
  let n2 = 30;
  console.log(n2, 'n2는 블록을 기준으로 지역변수'); // 30
}
console.log(n2, 'n2의 결과값은?'); // 20

// let vs var
var n3 = 20;
{
  console.log(n3, 'n3는 함수를 기준으로 지역변수'); // 20
  var n3 = 30;
  console.log(n3, 'n3는 함수를 기준으로 지역변수'); // 30
}
console.log(n3, 'n3의 결과값은?'); // 30

var n4 = 30;
function fn() {
  n4 = 20;
}
fn();
console.log(n4, 'n4의 결과값은?'); // 20

[코드예제3] 스코프3.js

let n1 = 10;
{
    let n1 = 20; // 유효범위 블록 내 지역변수 재선언
    console.log(n1); // 20
}
console.log(n1); // 10

var n2 = 100; // var는 블록 상관없이 문 순서대로 실행
{
    n2 = 200; // 유효변위 블록 내 전역변수 재할당
    console.log(n2); // 200
}
console.log(n2); // 200

var n3 = 1000;
function fn3() {
    var n3 = 2000; // 함수내 지역변수 재선언
    console.log(n3); // 2000
}
fn3(); // 함수호출로 함수 실행
console.log(n3); // 1000

var n4 = 3000;
function fn4() {
    n4 = 4000; // 함수내 전역변수 재할당
    console.log(n4); // 4000
}
fn4();
console.log(n4); // 4000

04. 조건문

💡

➡️ 주어진 조건식의 평가 결과에 따라 코드 블럭(블록문)의 실행을 결정합니다.

조건식 : 불리언 값으로 평가될 수 있는 표현식

if else

switch

[코드예제1] 조건문1.js (if else vs if if)

/* *90점 이상 A, 80점 이상 B, 70점 이상 C, 60점 이상 D, 59~F* */

// if, else if, else
let score = 89;
if (score >= 90) {
    console.log('A');
} else if(score >= 80) {
    console.log('B');
} else if(score >= 80) {
    console.log('C');
} else if(score >= 80) {
    console.log('D');
} else {
    console.log('F');
}

// if(){}, if(){}, ...
if (score >= 90) {
    console.log('A');
}
if (score >= 80 && score < 90) {
    console.log('B');
}
if (score >= 70 && score < 80) {
    console.log('C');
}
if (score >= 60 && score < 70) {
    console.log('D');
}
if (score < 60) {
    console.log('F');
}

[코드예제2] 조건문2.js (백틱을 이용한 조건문 출력 `${}`)

// javascript 이수조건 60점 미만 : fail, 60점 이상일 경우 : pass
// database 이수 조건 70점 미만 : fail, 70점 이상일 경우 : pass

let subject1 = 'javascript';
let subjectScore1 = 80;
if(subject1 == 'javascript') {
    if(subjectScore1 >= 60) {
        console.log(`${subject1} : pass`);
    } else {
        console.log(`${subject1} : fail`);
    }
} else if(subject1 == 'database') {
    if(subjectScore1 >= 70) {
        console.log(`${subject1} : pass`);
    } else {
        console.log(`${subject1} : fail`);
    }
}

subject1 = 'database';
subjectScore1 = 60;
if(subject1 == 'javascript') {
    if(subjectScore1 >= 60) {
        console.log(`${subject1} : pass`);
    } else {
        console.log(`${subject1} : fail`);
    }
} else if(subject1 == 'database') {
    if(subjectScore1 >= 70) {
        console.log(`${subject1} : pass`);
    } else {
        console.log(`${subject1} : fail`);
    }
}

/* 실습1. 83점일 경우 '해당과목의 학점은 B입니다' 출력하시오 */
/* 100~90 A, 89~80 B, 79~70 C, 69~60 D, 59~ F */
// 변수를 활용해야지  fix 유연하다
let subject2 = 'javascript';
let subjectScore2 = 80;
if(subject2 == 'javascript') {
  if(subjectScore2 >= 90) {
    console.log(`${subject2}의 학점은 A입니다.`);
  } else if(subjectScore2 >= 80){
    console.log(`${subject2}의 학점은 B입니다.`);
  } else if(subjectScore2 >= 70){
    console.log(`${subject2}의 학점은 C입니다.`);
  } else if(subjectScore2 >= 60){
    console.log(`${subject2}의 학점은 D입니다.`);
  } else {
    console.log(`${subject2}의 학점은 F입니다.`);
  }
} else if(subject2 == 'database'){
  if(subjectScore2 >= 90) {
    console.log(`${subject2}의 학점은 A입니다.`);
  } else if(subjectScore2 >= 80){
    console.log(`${subject2}의 학점은 B입니다.`);
  } else if(subjectScore2 >= 70){
    console.log(`${subject2}의 학점은 C입니다.`);
  } else if(subjectScore2 >= 60){
    console.log(`${subject2}의 학점은 D입니다.`);
  } else {
    console.log(`${subject2}의 학점은 F입니다.`);
  }
}

subject2 = 'database';
subjectScore2 = 69;
if(subject2 == 'javascript') {
  if(subjectScore2 >= 90) {
    console.log(`${subject2}의 학점은 A입니다.`);
  } else if(subjectScore2 >= 80){
    console.log(`${subject2}의 학점은 B입니다.`);
  } else if(subjectScore2 >= 70){
    console.log(`${subject2}의 학점은 C입니다.`);
  } else if(subjectScore2 >= 60){
    console.log(`${subject2}의 학점은 D입니다.`);
  } else {
    console.log(`${subject2}의 학점은 F입니다.`);
  }
} else if(subject2 == 'database'){
  if(subjectScore2 >= 90) {
    console.log(`${subject2}의 학점은 A입니다.`);
  } else if(subjectScore2 >= 80){
    console.log(`${subject2}의 학점은 B입니다.`);
  } else if(subjectScore2 >= 70){
    console.log(`${subject2}의 학점은 C입니다.`);
  } else if(subjectScore2 >= 60){
    console.log(`${subject2}의 학점은 D입니다.`);
  } else {
    console.log(`${subject2}의 학점은 F입니다.`);
  }
}

[코드예제3] 조건문3.js (switch)

let exString1 = '나';
switch (exString1) {
  case '가':  // = if (변수 == value) > true
    console.log('exString1와 값이 일치하는 case문이 실행');
    break; // 블록문을 빠져 나온다.

  default: // = else
    console.log('default는 else 조건문과 동일');
    break;
}

/* (switch) 실습1. 83점일 경우 '해당과목의 학점은 B입니다' 출력하시오 */
/* 100~90 A, 89~80 B, 79~70 C, 69~60 D, 59~ F */ 

let subScore = 90;
let intScore = parseInt(subScore/10); // 정수형태로 변환
let exGrade = '';
switch (intScore) {
  case 10:
    exGrade = 'A';
    break;
  case 9:
    exGrade = 'A';
    break;
  case 8:
    exGrade = 'B';
    break;
  case 7:
    exGrade = 'C';
    break;
  case 6:
    exGrade = 'D';
    break;
  default:
    exGrade = 'F';
    break;
} 
console.log(`해당과목의 학점은 ${exGrade}입니다.`);

// 2번째 방법 (switch 항상 true이면 case의 조건문에 해당되는 문을 찾아 실행 후 break)
switch (true) {
  case (subScore >= 90):
    exGrade = 'A';
    break;
  case (subScore >= 80):
    exGrade = 'B';
    break;
  case (subScore >= 70):
    exGrade = 'C';
    break;
  case (subScore >= 60):
    exGrade = 'D';
    break;
  default:
    exGrade = 'F';
    break;
}
console.log(`해당과목의 학점은 ${exGrade}입니다.`);

tag : #제어문 #블록문 #스코프 #조건문

Uploaded by N2T

[Javascript] 함수 (1)	2023.04.29
[Javascript] 객체 (0)	2023.04.29
[Javascript] 배열 (0)	2023.04.29
[Javascript] 반복문 (1)	2023.04.29
[Javascript] 자바스크립트란, 변수, 데이터 타입, 연산자 (0)	2023.04.29

멋쟁이v의 개발일지

멋쟁이v의 개발일지