[자바스크립트] 변수와 함수의 개념

자바스크립트는 웹 개발에서 가장 널리 사용되는 프로그래밍 언어 중 하나이다. HTML, CSS와 함께 웹 페이지를 동적으로 만들고 사용자와 상호작용할 수 있도록 도와준다.

1. 변수

변수는 데이터를 저장하는 공간이며, 자바스크립트에서는 var, let, const 키워드를 사용하여 변수를 선언한다. 값을 할당할 때는 할당 연산자인 =을 사용한다. 이때 할당 연산자는 '같다'라는 의미가 아니라 변수에 값을 할당한다는 의미이다.

let name = "Kim"

2. 함수

함수는 특정 작업을 수행하는 코드 블록이며 코드의 재사용성을 높여준다.

문자열의 글자수를 세는 함수를 만들면 다음과 같다.

function countLength (string) {
	return string.length;
}

• function: 함수를 선언하는 키워드
• countLength: 함수의 이름
• (string): 함수에서 사용할 변수. 외부에서 값을 전달하면 string에 값이 할당되어 함수 내부에서 사용된다.
• return: 함수 내부의 코드가 실행된 후 결과를 반환. 반환한 키워드를 함수 외부에서 사용할 수 있다.
• string.length: 외부에서 전달받은 문자열의 길이

함수를 호출할 때는 함수 이름 뒤에 ()를 붙이고 필요한 매개변수를 전달한다.

let appleCount = countLength('사과');
console.log(appleCount); // 2

728x90

3. 실습하기 - 구구단 출력

console.log()를 사용해서 구구단 2단을 출력하려면 아래와 같이 작성할 수 있다.

console.log(2 * 1); // 2
console.log(2 * 2); // 4
console.log(2 * 3); // 6
console.log(2 * 4); // 8
console.log(2 * 5); // 10
console.log(2 * 6); // 12
console.log(2 * 7); // 14
console.log(2 * 8); // 16
console.log(2 * 9); // 18

이 상태에서 3단을 출력하려면 2를 3으로 하나하나 바꿔야 한다. 하지만 변수를 사용하면 더 간단하게 바꿀 수 있다.

let left = 3;
console.log(left * 1);
console.log(left * 2);
console.log(left * 3);
console.log(left * 4);
console.log(left * 5);
console.log(left * 6);
console.log(left * 7);
console.log(left * 8);
console.log(left * 9);

이제 위 코드를 함수로 작성한다. 함수를 호출할 때 전달한 값에 해당하는 구구단을 출력하는 gugudan 함수를 구현한다.

function gugudan(left) {
  console.log(left * 1);
  console.log(left * 2);
  console.log(left * 3);
  console.log(left * 4);
  console.log(left * 5);
  console.log(left * 6);
  console.log(left * 7);
  console.log(left * 8);
  console.log(left * 9);
}

gugudan(2);