본문 바로가기

WINK-(Web & App)/HTML & CSS & JS 스터디

[2023 신입부원 기초 스터디] 조상혁 6주차 - JS기초문법 공부

반응형

조건문

어떤 조건이 주어질 때 어떤 동작을 수행하도록 하는, 즉 조건에 따라 실행이 달라지게 할 때 사용되는 문장이다.

 

if (조건문) {실행코드}

실행 코드가 한줄일 경우 중괄호를 없애도 괜찮다.

// 조건문 if

const a = 10;
const b = 20;

if (a < b) {
  console.log('a가 더 작아요');
}
// 조건문이 한줄일 경우

if (a < b) 
  console.log('a가 더 작아요');
  
if (a < b) console.log('a가 더 작아요');

 주의) 실행부분이 한줄일 경우만 가능!

 

if (조건문){실행코드} else{실행코드}

// 조건문 if else

const a = 10;
const b = 20;

if (a > b) {
  console.log('a가 더 작아요');
} else {
  console.log('b가 더 작아요')
}

if (조건문){실행코드} else if (조건문){실행코드}else{실행코드}

// 조건문 if ~else if ~else

const a = 10;
const b = 20;
const c = 20;

if (a > b) {
  console.log('a가 더 커요');
} else if (b !== c){
  console.log('b랑c가 같아요!')
} else {
  console.log('언제 출력이 될까요')
}

switch (조건) {case 조건: 실행코드  break;}

// 조건문 switch

const number = 10;

switch (number) {
  case 1:
    console.log(number);
    break;
  case 10:
    console.log(number);
    break;
  default:
    console.log('틀렸습니다');
}

+ default 는 else와 유사한 역할을 하며 switch 조건문에서 최하단에 위치한다.

 

if 와 switch 의 비교

// 조건문 

const number = 10;

if (number % 2 == 0) {
  console.log('짝수');
}else {
  console.log('홀수');
}

switch (number % 2 ){
  case 0 :
    console.log('짝수');
    break
  case 1 :
    console.log('홀수');
    break
}

반복문 

 똑같은 행동을계속해서 반복하게 되는 것

for (시작값; 반복조건; 증감값){실행코드}

// 반복문
//시작값; 반복조건; 증감값

for (let i = 0; i < 5; i++ ) {
  console.log(i)
}
// 시작값 생략
for (; i < 5; i++ ) {
  console.log(i)
}
//증감값 생략
for (; i < 5;) {
  console.log(i++)
}

for (const 변수 of 리스트) {실행코드}

// 반복문

const arr = [1,2,3]

for (const i of arr) {
  console.log(i);
}

while (조건){실행코드}

// 반복문

let i = 0;
while (i < 10){
  console.log(i++)
}

do {
  console.log(i++)
}while (i < 10);

while 과 do ~ while의 차이점 

  • while 선 판별 후 실행
  • do ~ while 선 실행 후 다음실행 판별

반복문 조건문 예제

// 반복문
// 조건문
//시작값; 반복조건; 증감값

for (let i = 0; i < 5; i++ ) {
  if (i === 7){
    continue
  }
  console.log(i);
}

함수

함수(function)란 하나의 특별한 목적의 작업을 수행하도록 설계된 독립적인 블록을 의미한다.

이러한 함수는 필요할 때마다 호출하여 해당 작업을 반복해서 수행할 수 있다.

반환(return)문

자바스크립트에서 함수는 반환(return)문을 포함할 수 있다.

매개변수(parameter)

자바스크립트에서는 함수를 정의할 때는 매개변수의 타입을 따로 명시하지 않는다.

함수를 호출할 때에도 인수(argument)로 전달된 값에 대해 어떠한 타입 검사도 하지 않는다.

 

함수를 호출할 때 함수의 정의보다 적은 수의 인수가 전달되더라도, 다른 언어와는 달리 오류를 발생시키지 않는다.

이 같은 경우 자바스크립트는 전달되지 않은 나머지 매개변수에 자동으로 undefined 값을 설정한다.

function addNum(x, y, z) { // x, y, z라는 3개의 매개변수를 가지는 함수 addNum()을 정의함.

    return x + y + z;

}

addNum(1, 2, 3); // 인수로 1, 2, 3을 전달하여 함수를 호출함. -> 6

addNum(1, 2);    // 인수로 1, 2을 전달하여 함수를 호출함. -> NaN

addNum(1);       // 인수로 1을 전달하여 함수를 호출함. -> NaN

addNum();        // 인수로 아무것도 전달하지 않고 함수를 호출함. -> NaN

 

반응형