ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [JS] 객체 속성 추가, 삭제
    JavaScript 2022. 6. 13. 14:44
    반응형
    SMALL
    object의 속성 추가,삭제

     

     

     

    동적으로 객체 속성 추가

    • 객체 먼저 생성 후, 속성을 추후에 추가
    let objData = {};  // 빈객체 선언
    
    objData.name = 'amy';
    objData.age = '22';
    objData.phone = '01012345678'

     

     

    정적으로 객체 속성 추가

    • 객체 생성 할 때 속성도 함께 생성
    • 배열이 포함된 객체의 속성 추가 
    // 정적 추가
    let obj = { add: "Incheon", age: 20, name: "amy" };
    
    
    
    // 배열 추가
    obj.dog ['뭉치', '콜라'];
    
    console.log(obj)
    {add: "Incheon", age: 20, name: "amy", dog: ['뭉치','콜라'] }

     

     

     

     

    객체 순회하면서 조건문에 따라 속성 추가

    // 객체를 순회하면서 아래 조건을 통과한다면 checked = true 값 추가
    for(let idx in objData){
    	if(objData[idx].age !== null){
        	objData[idx].checked = true;
        }else{
        	objData[idx].checked = false;
    }
    
    // 결과
    name : 'amy',
    age : '22',
    phone : '01012345678',
    checked : true

     

     

     

    객체 속성 삭제

    • delete 객체명.속성명
    • 배열삭제는 객체 안에 있는 배열의 원소 인덱스를 지운다.
      • 2자리의 배열중 1자리의 배열만 남는게 아니라, 오로지 "값"만 없어지고 undefined값이 나온다.
      • delete는 단순히 객체와 속성과의 연결을 끊기 때문에, 실제로 메모리에서 제거하는것은 아니다.
      • delete하고 싶은 값을 null이나 undefined로 설정하는 것을 추천한다.
    let obj = { phone: "01023456789", age: 20, name: "amy" };
    
    delete obj.phone;
    
    console.log(obj);
    // { age: 20, name: "amy" }
    
    
    ----------------------------------------
    // 배열 삭제
    let obj = {add: "Incheon", age: 20, name: "amy", dog: ['뭉치','콜라'] }
    
    delete obj.dog[1];
    
    console.log(obj);
    // {add: "Incheon", age: 20, name: "amy", dog: ['뭉치',undifined] }

     

    반응형
    LIST

    댓글

Designed by Tistory.