DevSSOM

자바스크립트 - 데이터 타입 (문자열, 숫자, 함수) 본문

JavaScript

자바스크립트 - 데이터 타입 (문자열, 숫자, 함수)

데브쏨 2021. 6. 30. 13:59
반응형

데이터 타입

변수에 전달되는 데이터 타입에도 여러 종류가 존재할 수 있음.

 

String 문자열 Object 객체
Number 숫자 Boolean 불리언
Function 함수 null
Array 배열 undefined 정의되지 않음

 

 

문자열

문자열 데이터 타입은, 큰따옴표 또는 작은 따옴표 안에 작성한 문자.

var str1 = "Hello";
var str2 = 'Bye';
var str3 = "100";
var str1 = "Hello World";
var str2 = 'Nice to meet you';
var str3 = "She's a girl";
var str4 = "She\'s a girl";    // 위와 같은 결과
var str5 = "20";

큰 따옴표 안에 넣던지, 작은 따옴표 안에 넣으면 돼. 앞에는 큰 따옴표가 뒤에는 작은 따옴표 이렇게 섞어서 쓸 수는 없어. 앞뒤 따옴표는 하나로 통일해야 됨. str3, 4처럼 중간에 작은 따옴표가 있는 문자열을 작성하고 싶다고 하면, 큰 따옴표 안에다가 문자열을 넣던지, 아니면 작은 따옴표 앞에 슬래시 기호를 넣어주면 됨. var str5에서 20은 숫자가 아니라 문자열이야. 따옴표 안에 있어서.

 

 

숫자

숫자 데이터 타입은 별도의 기호없이 숫자를 입력해주기만 하면 됨. 자바스크립트 다른 언어보다 상대적으로 자유도가 높아서, 정수와 실수가 서로 연산이 가능함.

var num1 = 30;
var num2 = 10.5;

console.log(num1 + num2);

 

 

함수

함수는 function 키워드를 사용해서 어떤 기능을 만들 때 사용되는 데이터 타입.

- 함수 생성 : function 키워드를 사용해서 생성. 함수를 생성하는 방법은 다음 두 가지.

- 함수 호출 : 함수 안에 있는 코드를 실행시키겠다는 의미

 

   1) var로 함수 만들기

// 함수 생성
var func1 = function() {
  console.log("Func1");
};

// 함수 호출
func1();  

   2) function 키워드로 함수 만들기

// 함수 생성 //
function func2() {    
  console.log("Func2");
}

// 함수 호출 //
func2();     

 

함수는 인자, 매개변수, return으로 구성됨.

- 인자 : 함수에게 전달하는 데이터

- 매개변수 : 인자로부터 전달받은 값이 들어가는 통로

- return : 함수 안에 데이터를 저장할 때 사용

var area = function(width, height) {
  return width * height;
}

var result = area(10, 20);
console.log(result);

위의 함수에서 width, height 는 매개변수들. 이 매개변수에 들어갈 데이터 10, 20이 각각 width, height 매개변수에 대입되는 인자가 됨. 그리고 width * height 라는 계산이 된 값을 return 이 가지고 있게 됨. 현재 area라고 하는 변수는 10 * 20을 계산한 200이라는 값을 가지고 있는 상태와 동일. 

 

함수는 커피머신이 작동하는 것과 비슷해. 케냐 AA, 에티오피아 원두 등등 여러가지 값들이 원두(인자)로 투입구(매개변수)에 들어갈 수 있고, 커피 머신(함수)가 작동해서 결과값으로 나오는 추출물, 커피(return)이 나오게 되는 것.

예시 1 : num1과 num2를 더하는 함수 sum 만들기

var sum = function(num1, num2) {
  return num1 + num2;
};

var result = sum(10, 20);
console.log(result);

예시 2 : num3과 num4를 곱하는 함수 multiple 만들기

function multiple(num3, num4) {
  return num3 * num4;
};

console.log(multiple(10, 20));

 

728x90
반응형
댓글