Space
article thumbnail
Published 2023. 5. 22. 19:47
[JS] Data_type(Object) (1) JavaScript
반응형

객체 (Object)

// Object
// 객체는 중괄호로 객체를 선언합니다.
// 객체는 키(key)와 값(value)의 쌍으로 이루어져 있습니다.
// 객체의 요소는 쉼표(,)로 구분합니다.
// 객체 안의 요소는 다양한 데이터 타입이 들어올 수 있습니다.

let student = {
	name : 'kimcoding',
	age : 20,
	skills : ['HTML', 'CSS', 'JS'],
	sum : function (num1, num2) {
    	  return num1 + num2;
	}
}

// 데이터 호출 방법
console.log(student.name);  // 'kimcoding'
console.log(student[age]);  // 20
console.log(student.sum(10, 20)); // 30
console.log(typeof student);  // object
console.log(Array.isArray(student));  // false

// Object.keys()  // 객체의 속성(key)을 배열로 리턴한다.
console.log(Object.keys(student)); // ['name', 'age', 'skills', 'sum']

console.log(student.length);  // undefined  // 객체는 요소의 길이를 바로 구할 수 없다.
console.log(Object.keys(student).length);  // 4  // 객체의 속성(key)의 길이

// 데이터 변경 방법
student.name = 'parkcoding'; 
student[age] = 23;
console.log(student[name]);  // 'parkcoding'
console.log(student.age);    // 23

// 데이터 추가 방법
student['content'] = 'h1';
student.isPublic = true;
student['tag'] = ['#hello', '#world'];

// 데이터 삭제 방법
delete student.isPublic;

// 현재 객체 상황
console.log(student);
student = {
	name : 'parkcoding',
	age : 23,
	skills : ['HTML', 'CSS', 'JS'],
	sum : function (num1, num2) {
    	  return num1 + num2;
	},
	content = 'h1',
	tag = ['#hello', '#world']
}
반응형
// dot notation
// 동적인 key값(변수)을 통해 value값을 출력하는 경우에 사용할 수 없다.
object.key

// bracket notation
// 동적인 key값(변수)을 통해 value값을 출력하는 경우에 사용할 수 있다.
object[key]

// example
let person = {
	name : 'coding',
	age : 20
}

console.log(person['name'] === person.name);  // true

function getProperty1(obj, propertyName) {
	return obj.propertyName;           // dot notation
}
console.log(getProperty1(person, 'name')); // undefined
console.log(getProperty1(person, 'age'));  // undefined

function getProperty2(obj, propertyName) {
	return obj[propertyName];          // bracket notation
}
console.log(getProperty2(person, 'name')); // coding
console.log(getProperty2(person, 'age'));  // 20

 

// 객체 안에 in 연산자를 사용하여 해당 key가 있는지 확인할 수 있다.

// example
let person = {
	name : 'coding',
	age : 20
}

console.log('name' in person);     // true
console.log('address' in person);  // false

 


 

 

Data_type(Object_1)를 알아보는 시간이었습니다.

틀린 내용은 댓글로 알려주시면 감사하겠습니다.

 

 

반응형
profile

Space

@Space_zero

포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!