w3schools.JS Objects Properties

ansunny1170·2022년 2월 11일
0

w3schools.JS Object

목록 보기
2/4

# JS Object Properties


속성은 JS 객체 중에 가장 중요한 내용이다.


## JavaScript Properties


속성은 JS 객체의 값에 관련된 것이다.
JS 객체는 명령되지 않은 속성의 집합이다.
속성은 대개 변하고, 더해지고, 삭제될 수 있고, 몇몇은 읽혀지기만 한다.

## Accessing JavaScript Properties


객체의 속석에 접근하는 문법:
objectName.property // person.age
or
objectName["property"] // person["age"]
or
objectName[expression] // x = "age"; person[x]

expression(표현)은 속성의 이름으료 표시해야한다.

Example 1

person.firstname + " is " + person.age + " years old.";

Example 2

person["firstname"] + " is " + person["age"] + " years old.";

## JavaScript for...in Loop

객체의 속성을 사용한 JS for...in 반복문
Syntax

for (let variable in object) {
  // code to be excuted
}

for...in 반복문의 내부 코드 블록은 각 속성 마다 한번 씩 실행 될 것이다.

const person = {
  fname:" John",
  lname:" Doe",
  age: 25
};

for (let x in person) {
  txt += person[x];
}

## Adding New Properties


이미 존재하는 객체에 간단한 값 입력으로 새로운 속성을 추가할 수 있다.

## Deleting Properties


delete 키워드로 객체에서 속성을 지운다.

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

delete person.age;

or delete person["age"]

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

delete person["age"];

delete키워드는 속성 본인과 속성의 값 모두 삭제한다.
삭제 후, 속성은 다시 사용이 불가하다.
delete 수행은 객체 속성에 사용 되도록 설계되었다. 그렇기에 함수나 변수에는 아무런 효과가 없다.
delete 수행은 미리 정의된 JS 객체 속성에 사용 될 수 없다. 사용 시 사용자의 프로그램에 문제를 일으킬 것이다.

## Nested Objects


객체 안에 객체 입력 가능

myObj = {
  name:"John",
  age:30,
  cars: {
    car1:"Ford",
    car2:"BMW",
    car3:"Fiat"
  }
}

.(dot) 혹은 [ ](bracket) 표기법으로 객체안의 객체에 접근 가능하다.

myObj.cars.car2;

or

myObj.cars["car2"];

or

myObj["cars"]["car2"];

or

let p1 = "cars";
let p2 = "car2";
myObj[p1][p2];

## Nested Arrays and Objects


객체안에 배열을 값으로 가질 수 있다. 또한, 배열안의 값도 객체가 될 수 있다.

const myObj = {
  name: "John",
  age: 30,
  cars: [
    {name:"Ford", models:["Fiesta", "Focus", "Mustang"]},
    {name:"BMW", models:["320", "X3", "X5"]},
    {name:"Fiat", models:["500", "Panda"]}
  ]
}

배열 안의 배열에 접근하려면, for-in 반복문으로 각 배열에 접근이 가능하다.

for (let i in myObj.cars) {
  x += "<h1>" + myObj.cars[i].name + "</h1>";
  for (let j in myObj.cars[i].models) {
    x += myObj.cars[i].models[j];
  }
}

## property Attributes


모든 속성에는 이름이 있다. 또한 속성은 값을 가지고 있다.
값은 속성의 속성 중 하나이다.(property's attributes)
다른 속성(attributes)은 열거 가능, 구성 가능 및 쓰기 가능이다.
이러한 속성(attributes)은 속성(property)에 접근하는 방법을 정의한다.(읽을 수 있는가?, 쓸 수 있는가?)
JS에서는 모든 속성(attributes)는 읽힐 수 있지만, 값 속성(value attribute)만 변경 될 수 있다. (속성(property)이 쓰기 가능한 경우에만)
(ECMAScript 5에는 모든 속성 속성을 가져오고 설정하는 메서드가 있다.)

## Prototype Properties


JS 객체는 프로토타입의 속성을 상속한다.
delete 키워드는 상속된 속성(properties)을 삭제하지 않지만 프로토타입 속성을 삭제하면 프로토타입에서 상속된 모든 객체에 영향을 미친다.

profile
공정 설비 개발/연구원에서 웹 서비스 개발자로 경력 이전하였습니다. Node.js 백엔드 기반 풀스택 개발자를 목표로 하고 있습니다.

0개의 댓글