πŸš€ Languege/JavaScript

[κΈ°λ³Έ 문법] μžλ°”μŠ€ν¬λ¦½νŠΈ μžλ£Œν˜•/Array/Object

mini_world 2021. 4. 15. 00:18
λͺ©μ°¨ μ ‘κΈ°

 

μžλ°”μŠ€ν¬λ¦½νŠΈλŠ” λ™μ μ–Έμ–΄λ‘œ λ³€μˆ˜ νƒ€μž…μ„ 미리 μ„ μ–Έν•  ν•„μš”κ°€ μ—†μŠ΅λ‹ˆλ‹€. 
μ–΄λ–€ 데이터 νƒ€μž…μ΄ μžˆλŠ”μ§€ ν•œλ²ˆ ν™•μΈν•΄λ΄…λ‹ˆλ‹€.πŸ€—


1. κΈ°λ³Έ μžλ£Œν˜•

1) Boolean

- true/false 두가지 값을 κ°€μ§ˆ 수 μžˆμŠ΅λ‹ˆλ‹€.
- ν”„λ‘œκ·Έλž˜λ° μ‹œ λ…Όλ¦¬μ μœΌλ‘œ μ°Έ/거짓을 νŒλ‹¨ν•  ν•„μš”κ°€ μžˆμ„λ•Œ μ‚¬μš©ν•©λ‹ˆλ‹€.
- 예) μ‚¬μš©μžκ°€ μž…λ ₯ν•œ 값이 10 이상이면 μ°Έ, μ•„λ‹ˆλ©΄ 거짓 (λΉ„κ΅μ—°μ‚°μž) 

const boolT = true;
const boolF = false;
console.log(boolT,boolF);

/*
μ‹€ν–‰ κ²°κ³Ό
===============================
true false
===============================
*/

 

2) Null

- λ³€μˆ˜κ°’μ΄ λΉ„μ–΄μžˆλ‹€λŠ” ν‘œκΈ°λ₯Ό ν•˜κΈ° μœ„ν•œ μžλ£Œν˜•μž…λ‹ˆλ‹€.
- undefined ν˜•μ€ λ©”λͺ¨λ¦¬μ— μ•„λ¬΄λŸ° 데이터가 μ—†μ§€λ§Œ, null μžλ£Œν˜•μ˜ 경우 "Null"ν˜•μ΄ κ°’μœΌλ‘œ 좜λ ₯λ©λ‹ˆλ‹€.

let nullType = null;
console.log(nullType)


/*
μ‹€ν–‰ κ²°κ³Ό
===============================
null
===============================
*/

3) Undefined

- λ³€μˆ˜λͺ…λ§Œ μ„ μ–Έλ˜μ–΄μžˆκ³ , λ³€μˆ˜κ°’μ΄ μ—†λŠ” μžλ£Œν˜•μž…λ‹ˆλ‹€.
- λ©”λͺ¨λ¦¬ 곡간은 확보 λ˜μ–΄μžˆμ§€λ§Œ μ‹€μ œλ‘œ 데이터가 λ“€μ–΄κ°€μžˆμ§€ μ•ŠμŠ΅λ‹ˆλ‹€. 

let undefinedType
console.log(undefinedType)

//λ³€μˆ˜κ°’μ— 직접 undefinedλ₯Ό 넣을 수 μžˆμŠ΅λ‹ˆλ‹€.
// let undefinedType = undefined;

/*
μ‹€ν–‰ κ²°κ³Ό
===============================
undefined
===============================
*/

 

4) Number

- 숫자 μžλ£Œν˜•μž…λ‹ˆλ‹€.
- μžλ°”μŠ€ν¬λ¦½νŠΈμ—μ„œλŠ” μ •μˆ˜, μ‹€μˆ˜λ₯Ό κ΅¬λΆ„ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. (μ •ν™•νžˆλŠ” μ •μˆ˜λ§Œμ„ μœ„ν•œ μžλ£Œν˜•μ΄ μ—†μŠ΅λ‹ˆλ‹€.)

const floatingType = 123123.123123;
console.log(floatingType);

/*
μ‹€ν–‰ κ²°κ³Ό
===============================
123123.123123
===============================
*/

 

5) String
- 문자 μžλ£Œν˜•μž…λ‹ˆλ‹€.

const stringType = "μ‚¬κ³ΌλŠ” λ§›μžˆμ–΄";
console.log(stringType);

/*
μ‹€ν–‰ κ²°κ³Ό
===============================
μ‚¬κ³ΌλŠ” λ§›μžˆμ–΄
===============================
*/

 

2. Array

배열은 인덱슀λ₯Ό κ°€μ§€λŠ” μ—¬λŸ¬κ°œμ˜ 데이터λ₯Ό μ €μž₯ν•  수 μžˆλŠ” 자료 κ΅¬μ‘°μž…λ‹ˆλ‹€.
ν•˜λ‚˜μ˜ 배열에 μ—¬λŸ¬ μžλ£Œν˜•μ˜ 데이터λ₯Ό μ €μž₯ν• μˆ˜ μžˆμŠ΅λ‹ˆλ‹€.

const arraySample = ["judy", 30, true, null]
console.log (arraySample)

/*
μ‹€ν–‰ κ²°κ³Ό
===============================
[ 'judy', 30, true, null ]
===============================
*/

λ°°μ—΄μ˜ λ°μ΄ν„°λŠ” μˆœμ„œλŒ€λ‘œ μ €μž₯되며, λ°μ΄ν„°λŠ” 인덱슀λ₯Ό μ΄μš©ν•΄μ„œ μ ‘κ·Όν•©λ‹ˆλ‹€.

const arraySample = ["judy", 30, true, null]
console.log (arraySample[0]);
console.log (arraySample[1]);


/*
μ‹€ν–‰ κ²°κ³Ό
===============================
judy
30
===============================
*/

 

3. Object

κ°μ²΄λŠ” ν‚€(key)와 κ°’(value)둜 κ΅¬μ„±λœ Property의 μ§‘ν•©μž…λ‹ˆλ‹€.
μ›ν•˜λŠ” 데이터 μ „λΆ€ λ‹€ 넣을 수 μžˆμŠ΅λ‹ˆλ‹€. 

const objectSample = {
    name: "κΉ€μ΄ˆλ‘±",
    age: 30,
    nationality: "korean",
    favoriteFoods: ["κΉ€μΉ˜","된μž₯찌개","κ³„λž€ν›„λΌμ΄","슀팸ꡬ이"],
    family: [
        {
            father: "김득주",age: 63
        },
        {
            mom:"μ •ν˜œμΈ",age: 62
        },
        {
            sister:"김닀은", age:26
        }
    ],
    character: undefined
}
console.log(objectSample)

/*
μ‹€ν–‰ κ²°κ³Ό
===============================
{
  name: 'κΉ€μ΄ˆλ‘±',
  age: 30,
  nationality: 'korean',
  favoriteFoods: [ 'κΉ€μΉ˜', '된μž₯찌개', 'κ³„λž€ν›„λΌμ΄', '슀팸ꡬ이' ],
  family: [
    { father: '김득주', age: 63 },
    { mom: 'μ •ν˜œμΈ', age: 62 },
    { sister: '김닀은', age: 26 }
  ],
  character: undefined
}
===============================
*/

였브젝트 λ‚΄μ˜ λ°μ΄ν„°λŠ” μ•„λž˜μ™€ 같이 확인할 수 μžˆμŠ΅λ‹ˆλ‹€.

const objectSample = {
    name: "κΉ€μ΄ˆλ‘±",
    age: 30,
    nationality: "korean",
    favoriteFoods: ["κΉ€μΉ˜","된μž₯찌개","κ³„λž€ν›„λΌμ΄","슀팸ꡬ이"],
    family: [
        {
            father: "김득주",age: 63
        },
        {
            mom:"μ •ν˜œμΈ",age: 62
        },
        {
            sister:"김닀은", age:26
        }
    ],
    character: undefined
}
console.log(objectSample.family[1].age)

/*
μ‹€ν–‰ κ²°κ³Ό
===============================
62
===============================
*/

 


κ³΅μ‹ν™ˆνŽ˜μ΄μ§€ :developer.mozilla.org/ko/docs/Web/JavaScript/Data_structures

 

μžλ°”μŠ€ν¬λ¦½νŠΈμ˜ μžλ£Œν˜• - JavaScript | MDN

μžλ°”μŠ€ν¬λ¦½νŠΈμ˜ μžλ£Œν˜• λͺ¨λ“  ν”„λ‘œκ·Έλž˜λ° μ–Έμ–΄λŠ” λ‚΄μž₯ μžλ£Œν˜•μ΄ μžˆμ§€λ§Œ, μ’…μ’… μ΄λŸ¬ν•œ λ‚΄μž₯ μžλ£Œν˜•μ€ μ–Έμ–΄λ§ˆλ‹€ λ‹€λ₯΄λ‹€. 이 λ¬Έμ„œμ—μ„œλŠ” μžλ°”μŠ€ν¬λ¦½νŠΈμ˜ λ‚΄μž₯ μžλ£Œν˜•κ³Ό, λ‚΄μž₯ μžλ£Œν˜•μ—μ„œ μ‚¬μš©ν•  수

developer.mozilla.org

 

728x90