Front-end/JavaScript

객체 object

- 연관된 데이터를 담는 그릇 (배열과 유사)

- 데이터에 인덱스가 아닌 이름을 붙일 수 있다는 것이 배열과 다른점

- 다른 언어에선, 연관배열, 맵, 딕셔너리라는 데이터 타입이 해당

- key : value

var age = {'name1':28, 'name2':25, 'name3':29}  // name$ 는 key 값, 숫자는 value

//value값에 접근하기
alert(age['name1']);
  //alert(age['na'+'me1']); 문자열을 결합할 때 사용하기 편함, []안에는 string 삽입 가능
alert(age.name1);

- 다른 선언 방법

var age = {};
    
age['name1'] = 28;
age['name2'] = 25;
age['name3'] = 29;
var age = new Object();
    
age['name1'] = 28;
age['name2'] = 25;
age['name3'] = 29;
const player = { 
    name = "nico",
    points = 10,
    fat = true,
}

console.log(player.name);
console.log(player['name']);

//object value 바꾸기
player.fat = false; //현재 const는 object, 그 안의 값을 바꿀 수는 있음
player = false; // 이건 const의 타입을 boolean으로 바꾸는 것이므로 에러

//object 데이터 추가 (그냥 추가로 선언해주면 됨)
player.lastName = "Lee";

 

1. 객체와 반복문

- 저장된 순서가 존재하지 않음 (인덱스 없음) -> for in 문 사용

var grades = {'egoing': 10, 'k8805': 6, 'sorialgi': 80};
for(key in grades) { 
    document.write("key : "+key+" value : "+grades[key]+"<br />");
}

     **배열에서도 for in 문 사용 가능 

var arr = ['a','b','c',]
for(var name in arr) { 
    console.log(arr[name]);  
}

 

 

2. 객체 지향 프로그래밍

- 객체에 담길 수 있는 값들    ex) 객체, 함수 등 

var grades = {
    'list': {'egoing': 10, 'k8805': 6, 'sorialgi': 80}, //객체 안의 객체
    'show' : function(){  //객체 안의 함수 
         for(var name in this.list){ //this는 이 함수가 담긴 객체
            document.write(name+':'+this.list[name]+"<br />");
        }
     }
};
    
alert(grades['list']['egoing']); //객체 안의 객체 접근
    
grades.show();

- 객체 지향 프로그래밍 : 서로 연관되어있는 데이터와 그의 처리를 하나의 그릇 안에 모아서 그룹핑한 것 

'Front-end > JavaScript' 카테고리의 다른 글

UI와 API, 문서  (0) 2020.09.15
모듈과 라이브러리  (0) 2020.09.15
배열 array  (0) 2020.09.08
함수 fuction  (0) 2020.09.08
반복문 for  (0) 2020.09.07