018 _ 자바스크립트 반복 처리 스킵 (continue) [적용] 반복 처리 중 특정 조건에 대해 스킵하고 싶을 때 for문은 루프 중 처리를 스킵하고 싶을 때 [내용] for문과 while문의 반복 처리 작업 중 일부 상황에서 처리 작업의 예외가 필요할 때가 있다. continue문을 사용하면 해당 루프의 작업을 실행하지 않고 다음 루프로 넘어간다. [문법] 구문 의미 continue for문 루프 중 처리 스킵 [예시1] index가 홀수인 경우에만 출력을 실행하는 코드를 통해 continue의 사용을 확인해 보자. continue의 적용 범위는 for문의 {} 내부이다. JavaScript for (let index = 0; index < 10; index++) { if (index % 2 ===..

017 _ 자바스크립트 반복문 사용하기 (while) [적용] 일정 조건을 충족할 때까지 반복 처리를 사용하고 싶을 때 [내용] while문은 조건을 만족하면 계속 반복 작업을 한다. for문과 유사하나 while문은 반복 조건만을 지정한다. 그러므로 코드를 통해 반복의 종료 시점을 지정해야 한다. [문법] 구문 의미 whiel (반복조건) { 반복처리내용 } 반복 작업 처리 [예시] myNumber 변수의 값이 10 이상이 될 때까지 +1을 반복 실행하는 코드를 만들어 보자. JavaScript let myNumber = 0; while (myNumber < 10) { console.log(myNumber); myNumber += 1; } [실행결과] 참조 : 실무에 바로 적용하는 자바스크립트 코드레시..

016 _ 자바스크립트 반복문 사용하기 (for) [적용] 반복 처리 작업을 하고 싶을 때 [내용] for 문은 반복 작업을 처리하며, 대량의 데이터를 처리하거나 배열을 다룰 때 유용하다. [문법] 구문 의미 for (초기화; 반복문 조건; 반복 중 처리 구문) { 반복처리내용 } 반복 작업 처리 [예시] for문을 사용하여 0부터 9까지 출력하는 코드를 만들어보자 JavaScript // 0~9까지 순서대로 출력 for (let index = 0; index < 10; index++) { console.log(index); } [실행결과] for문의 초기화는 반복 작업에서 처음 실행하는 내용을 삽입한다. 위의 예제코드에서는 'let index = 0;'으로 index변수에 0을 대입한다. 반복문 조건은..

015 _ 자바스크립트 조건문 사용하기 (switch) [적용] 조건을 만족하는 다수의 데이터를 처리하고 싶을 때 [내용] switch문은 조건을 만족하는 데이터를 처리하는 작업을 실시한다. [문법] 구문 의미 switch (식) 식에 따라 처리를 분기 case 값: 처리 내용 해당 조건 만족 시 처리 default: 처리 내용 만족하는 조건이 하나도 없는 경우의 처리 [예시1] switch문의 () 안 값과 case의 값이 일치할 경우에만 해당 case의 처리가 실행된다. case의 값 뒤에는 '콜론(;)'을 붙인다. 상수 myFruit의 값에 따라 알림창을 띄우는 샘플 코드를 확인해 보자. JavaScript const myFruit = '사과'; switch (myFruit) { case '사과':..

014 _ 자바스크립트 조건문 사용하기 (if) [적용] 조건을 만족하는 데이트를 처리하고 싶을 때 [내용] 프로그램의 내부 구조를 확인해 보면 조건에 따른 처리가 이루어지는 작업이 많다. 자바스크립트는 'if/else'를 사용하여 조건에 따른 처리가 가능하다. [문법] 구문 의미 if (조건1) {처리1} 조건1 O -> 처리1 실행 else if (조건2) {처리2} 조건1 X, 조건2 O -> 처리2 실행 else {처리3} 조건1 X, 조건2 X -> 처리3 실행 [예시1] 상수의 값에 따라 세 종류의 알림창을 띄우는 샘플 코드를 살펴보자. 상수 myPrice에 100을 대입하면, 'myPrice >= 50'은 참이 되므로 if 문의 처리 내용이 실행되고 else if 와 else문은 실행되지 않..

013 _ 자바스크립트 다수의 파라미터(인수)를 가지는 함수 정의하기 [적용] 임의의 파라미터를 가지는 함수를 정의하고 싶을 때 [내용] 정해지지 않은 파라미터의 개수를 가지는 함수는 '...'을 이용하여 '...파라미터'와 같은 방식으로 정의한다. 입력받은 파라미터는 인덱스를 이용하여 파라미터[0], 파라미터[1],의 방식으로 사용하며, 이와 같은 정의 방식을 '나머지 파라미터(Rest Parameter)'라고 한다. [문법] 구문 의미 function 함수명(...파라미터) {} 파라미터의 개수가 미정인 함수를 정의 (...파라미터) => {} 파라미터의 개수가 미정인 함수를 정의 파라미터[인덱스] 인덱스를 지정해서 파라미터를 사용 [예시] 파라미터의 합계를 반환하는 함수 샘플을 통해 사용법을 확인해..

012 _ 자바스크립트 함수의 파라미터(인수) 초기값 설정하기 [적용] 함수 파라미터의 초기값을 설정하고 싶을 때 함수 파라미터를 생략 가능하도록 설정하고 싶을 때 [내용] 함수의 파라미터에 '파라미터 = 값'을 사용해 파라미터의 초기값을 설정할 수 있다. 초기값이 설정된 파라미터는 값을 전달받지 않으면 초기값을 사용하는데, 이를 '디폴트 파라미터'라고 한다. [문법] 구문 의미 function 함수명(파라미터1, 파라미터2=초기값2, 파라미터3=초기값3) {} 함수에 값 전달 (파라미터1, 파라미터2=초기값2, 파라미터3=초기값3) => {} 함수에 값 전달 [예시] 예시 코드를 통해 세금을 포함한 가격을 계산하는 코드를 확인해보자. calcFunction()의 두 번째 파라미터인 tax에 0.1의 초..

011 _ 자바스크립트 화살표 함수(Arrow Function) 사용하기 [적용] 함수를 간략히 정의하고 싶을 때 this를 지정하고 싶을 때 [내용] function 외에도 화살표 함수를 사용하여 함수를 정의할 수 있다. 화살표 함수의 장점은 다음과 같다. 1. 함수를 간략히 기술할 수 있다. 2. this를 묶는 것이 가능하다 [문법] 구문 의미 (파라미터) => { 처리내용 } 함수를 정의 [예시1] 화살표 함수는 다음과 같이 정의하여 사용한다. JavaScript // 함수의 정의 const calcSum = (a, b, c) => { const result = a + b + c; return result; }; // 함수의 실행 calcSum(1, 2, 3); // 결과: 6 [예시2] 화살표 ..

010 _ 자바스크립트 함수 선언(사용)하기 (function) [적용] 처리 작업을 하나로 모아 이름을 지정하고 싶을 때 처리 작업을 반복하여 재사용하고 싶을 때 [내용] 함수는 들어온 값을 처리하고 그 결과를 반환하는 구조이다. function으로 함수를 정의하고 함수명을 정의할 수 있으며, { } 블록 안에 처리할 내용을 입력한다. 함수에 전달되는 값을 파라미터(인수)라고 한다. [문법] 구문 의미 function 함수명(파라미터) {처리내용} 함수를 정의 return 값 함수 내부에서 처리한 값을 반환 함수명(); 함수를 실행 [예시1] 입력 a에 대해 a + 2의 결과를 반환하는 함수를 만들어 보자. JavaScript function myFunction(a) { const result = a ..

009 _ 자바스크립트 복합형(축약형) 대입 연산자 사용하기 [적용] 계산식을 간략히 나타내고 싶을 때 [내용] 대입할 때 사용하는 기호인 '='는 대입 연산자라고 한다. 이를 응용하여 좌변과 우변의 연산 결과를 좌변의 변수에 대입하는 것을 복합형 대입 연산자라고 한다. 복합형 대입 연산자는 사칙연산 기호와 '='를 조합하고 축약한 형태로 사용한다. [문법] 구문 의미 x = y x = y x += y x = x + y x -= y x = x - y x *= y x = x * y x **= y x = x ** y x /= y x = x / y x %= y x = x % y [예시] 복합형(축약형) 대입 연산자를 사용하여 코드를 간략하게 표현해보자 JavaScript let a = 10; let b = 2..