Language/JavaScript

객체 생성

do-oni 2021. 9. 19. 19:16

 

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <h3>JS로 객체 생성하는 방법</h3>
  
  <script>
    console.log('--4. js의 배열 --');
    let arr1 = [1, 2, 3, 4, 5];
    console.log(arr1, arr1.length, arr1[0]);

    console.log('--3. JSON[JavaScript Object Notation] 배열 --');

    let obj3 = [
                 {"k1":"v11", "k2":"V2", "k3":"v31"},
                 {"k1":"v21", "k2":"V2", "k3":"v32"},
                 {"k1":"v31", "k2":"V2", "k3":"v33"},

    ];
    console.log(obj3);
    // v33만 출력
    console.log(obj3[2].k3);

    

    console.log('--2. JSON[JavaScript Object Notation] 표현법 --')
    let obj2 = {"k1":"v1", "k2":"V2", "k3":"v3"};
    console.log(obj2);

    console.log('--1. 객체 리터럴 --');
    name = 'test';
    //obj1 변수 선언과 동시에 속성 3개로 생성되는 객체
    let obj1 = {
      //변수, property(속성) : 값
      name2 : '유재석',
      age : 48,
      info : function(){
        //함수 내부에서 해당 객체의 변수값 활용시에는 this 즉 객체 자체를 의미하는 키워드 필수
        console.log(1 + ' ' + this.name2);  //1 유재석
        return '이영자';
      }
    }

    console.log(obj1);  //{name2: '유재석', age: 48, info: ƒ}
    console.log(typeof(obj1));  //object
    console.log(obj1.info());  //이영자

    //이미 생성된 객체에 속성 추가 가능
    //새로운 속성(변수) 추가 및 값 대입(초기화)
    obj1.address = '남부터미널';

    //객체 내에 이미 존재하는 속성 삭제 가능
    delete obj1.address;


  </script>
</body>
</html>