[js]자바스크립트의 data type(데이터 종류)

원시타입(primitive type)

타입	예시	typeof return value	Object wrapper
Number(실수)	123, 123.56	number	Number
BigInt	123456789012345678901234567890	bigint	BigInt
String (' '==" ")	'한글',"한글"	string	String
Undefined	undefined	undefined	N/A
Boolean	true/false	boolean	Boolean
null	null	object	N/A
Symbol		symbol	Symbol

📍 Number

모든 JavaScript Number는 64비트(double) 부동 소수점 형식으로 저장된다.

let  num  = 10;
let v1 = 7;
let v2 = 3;
let v3 = v1 + v2;
let v4 = v1 - v2;
let v5 = v1 * v2;
let v6 = v1 / v2;
let v7 = v1 % v2;

📍BigInt

 매우 큰 정수를 표현할 수 있는 타입. 일반 숫자 타입의 한계를 초과하는 숫자를 다룰 수 있다.

let x = BigInt("123456789012345678901234567890");

 

📍String

문자열 데이터. 작은따옴표(')나 큰따옴표(")로 감싸서 표현하는데 일반적으로 작은따옴표로 표현을 많이 한다.

(∵js의 변수, 함수, 메서드와같은 식별자가 아닌 속성값을 표현할때 큰따옴표 사용)

language='한글';
language2="한글";
tag='';
tag += 'v1+v2=' + v3 + '<br />';
tag += 'v1-v2=' + v4 + '<br>';
tag += 'v1*v2=' + v5 + '<br>';
tag += 'v1/v2=' + v6 + '<br>';
tag += 'v1%v2=' + v7 + '<br>';

const div1El = document.getElementById('div1');//El:element

'div1'은 id가 div1인 것이고 getElementById()는 id로부터 element를 호출하는 함수이다.

const div1El = document.getElementById("div1");//El:element

📍Undefined

변수만들고 값을 넣지 않으면 undefined

let notAssigned;
console.log(notAssigned); // undefined
let v8;

📍Boolean

true 또는 false 값을 가진다.

let v9 = 0 == '0';   //true , '0'을 비교하기 위해 숫자 0으로 변경
let v10 = 0 === '0'; //false, 값과 타입을 비교 ∴숫자와 문자비교임

📍Null

고의적으로 "값이 없음"을 나타내는 특수한 값.

let emptyValue = null;

📍Symbol

 고유하고 변경 불가능한 원시 값

const key = Symbol('key');
console.log(typeof key); // symbol

결과

참조 타입 (Reference Type, Object Type)

타입	예시
Object	{ id:1, name:'a'}
Date	'2023-03-10'
Array(배열)	[1,2,3,4,5]
Function	function(){}
RegExp	/abc/

📍Object 

'키-값' 쌍으로 데이터를 저장하는 구조

let person = {
    name: 'Alice',
    age: 30
};
let myCar2  = {
  "name" : "내차2",
  "color" : "pink"};
  "year-1":2024;
  };

쌍따옴표를 붙이는 이유

• 왼쪽:키, 오른쪽:값
• -를 산술연사자가 아닌 하이픈으로 속성 정의

📍Date

 날짜와 시간을 처리하기 위해 사용하는 객체

const date = new Date("2022-03-25");

참고:https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Date

Date - JavaScript | MDN

📍Array

배열

let fruits = ['apple', 'banana', 'cherry'];
let number = [1, 2, 3, 4, 5];

📍Function

See the Pen Untitled by 유레이나 (@zdixexqp-the-reactor) on CodePen.

 

1.<button onclick="alert('Ok Click')">Ok</button>

2.

function f2(){
let txt="Ok2 Click"; //변수 설정const, let, var
alert(txt);//function이 없으면 run시키면 바로 나옴
}

<button onclick="f2()">Ok2</button>

2.익명함수

let f3 = function (){
let txt="Ok3 Click"; 
alert(txt);
}

<button onclick="f3()">Ok3</button>

3.람다식

let f4 = (txt) => {
alert(txt);
}

<input type="image" src="" onclick="f4('Ok4 Click')"/>

📍 RegExp

const regex1 = /abc/; // "abc"라는 문자열 패턴
const regex2 = new RegExp('abc'); // "abc"라는 문자열 패턴