코딩/수업메모

JS 9~12강 개념 - 함수(매개변수, 리턴, 배열)

ponyo118 2026. 2. 24. 16:13

함수
* 값의 종류
- 실행할 수 없는 계열
  - 숫자
  - 문장
  - 논리값(true/false)
  - 객체
- 실행할 수 있는 계열
  - 함수

console.clear();

// 자판기(함수)를 만드는 행위
// 아래 중괄호({})의 의미 : 함수의 시작과 끝을 정의
// 아래 변수의 이름은 say를 함수명이라고도 한다.
var say = function() {
    console.log("== 함수 시작 ==");
    console.log("안녕하세요.");
    console.log("반갑습니다.");
    console.log("== 함수 끝 ==");
};

// say() => say 라는 변수안에 들어있는 데이터를 실행한다.
// 자판기(함수)를 실행하는 행위
say();
say();
say();
say();
say();

 

매개변수

  • 개념 - 세미콜론 안 붙이는 곳
    • if, switch, while, for, function 뒤에
    • 단 아래 형식은 예외로 붙인다.
      • var hello = function() { };


//문제 - 매번 다르게 행동하는 함수를 만들어주세요.

console.clear();

// var hello = function(mode) { } 와 아래는 같은 뜻
function hello(mode) {
    var msg = "안녕하세요.";
    
    if ( mode == "일본어" ) {
        msg = "곤니찌와";
    }
    else if ( mode == "영어" ) {
        msg = "헬로";
    }
    
    console.log(msg);
}

// "한국어" => 함수에게 넘기는 부가적인 정보, 인자
hello("한국어");
// 출력 => 안녕하세요.

hello("일본어");
// 출력 => 곤니짜와

hello("영어");
// 출력 => 헬로

 

//문제 - 매개변수 2개짜리 printDan 함수를 구현해주세요.

console.clear();

function printDan(dan, limit) {
    console.log("== " + dan + "단 출력 ==");
    
    for ( var i = 1; i <= limit; i++ ) {
        console.log(dan + " * " + i + " = " + dan * i);
    }
}

printDan(3, 3);
// 출력
/*
== 3단 출력 ==
3 * 1 = 3
3 * 2 = 6
3 * 3 = 9
*/

printDan(2, 1);
// 출력
/*
== 2단 출력 ==
2 * 1 = 2
*/

 

동영상

2602, JS, 개념, 함수, 인자와 매개변수

 

함수리턴

console.clear();
// 매개변수는 자판기(함수)에서 데이터가 들어오는 구멍이다.
var plus = function(num1, num2) {
    // 지역변수 sum, 전역변수 sum과는 아무 관련이 없다. 동명이인이다.
    var sum = num1 + num2;
    
    // return 구문은 함수(자판기)에서 데이터가 나가는 구멍이다.
    // 함수의 호출구문은 `return` 이후의 값으로 변신한다.
    // 즉 plus(5, 5) 가 실행하면 10으로 변신한다.
    // 참고로 데이터는 오직 딱 1개만 리턴될 수 있다.
    return sum;
};

// 전역변수 sum
var sum;

sum = plus(2, 4); // plus(2, 4) 가 실행되면 6으로 변신한다. 결국 sum에는 6이 들어간다.
console.log("sum : " + sum);

sum = plus(10, 20); // plus(10, 20) 가 실행되면 30으로 변신한다. 결국 sum에는 30이 들어간다.
console.log("sum : " + sum);

배열(리스트)

var a = [];

a.push(10);

a.push(20);

a.push(30);

a.unshift(50);//새치기

console.log(a);

console.log(a[10]);

console.log(a[1] );

console.log(a [2] );

배열 1

console.clear();
console.log("== 배열 넣는 방법 v1 == ");
var ages = [];
ages.push(11);
ages.push(22);
ages.push(33);
ages.unshift(50); // 새치기

console.log(ages[0]);
console.log(ages[1]);
console.log(ages[2]);
console.log(ages[3]);
console.log(ages);


console.log("== 배열 넣는 방법 v2 == ");
var ages2 = [];
ages2[0] = 10;
ages2[1] = 20;
ages2[2] = 30;

console.log(ages2[0]);
console.log(ages2[1]);
console.log(ages2[2]);
console.log(ages2);
console.log("배열의 길이 : " + ages2.length);

 

배열 2

console.clear();

console.log("배열을 만드는 방법 v1");
var ages1 = [];
ages1.push(10);
ages1.push(20);
ages1.push(30);
ages1.unshift(50); // 새치기
ages1.unshift(60);
console.log(ages1);
console.log(ages1[3]);


console.log("배열을 만드는 방법 v2");
var ages2 = [];
ages2[0] = 10;
ages2[1] = 20;
ages2.push(50);
ages2[2] = 30; // 50 -> 30으로 교체된다.
console.log(ages2);
console.log(ages2[1]);


console.log("배열을 만드는 방법 v3");
var ages3 = [10, 20, 30];
ages3.push(40);
console.log(ages3);
console.log("배열의 길이 : " + ages3.length);

 

'코딩 > 수업메모' 카테고리의 다른 글

JQ 1~7강 개념 - 제이쿼리  (0) 2026.02.25
JS 바닐라 자바스크립트  (0) 2026.02.25
JS 변수명, 함수명 잘 짓는 법  (0) 2026.02.24
JS 8강 개념 - 반복문(for)  (0) 2026.02.23
JS 7강 개념 - 다중 while문  (0) 2026.02.23