Object 객체

https://www.youtube.com/watch?v=MiLELE_yskc

1. 객체 작성 방법

 

 

2. 객체 접근 방법

 

2.1 dot operator

 

let spaceship = {
  homePlanet: 'Earth',
  color: 'silver',
  'Fuel Type': 'Turbo Fuel',
  numCrew: 5,
  flightPath: ['Venus', 'Mars', 'Saturn']
};


let crewCount  = spaceship.numCrew;
console.log(crewCount); //5

let planetArray = spaceship.flightPath ;
console.log(planetArray);//  ['Venus', 'Mars', 'Saturn']

 

2.2 Bracket Notation

let spaceship = {
  'Fuel Type' : 'Turbo Fuel',
  'Active Mission' : true,
  homePlanet : 'Earth', 
  numCrew: 5
 };

let propName =  'Active Mission';

let isActive = spaceship['Active Mission'];
console.log(spaceship['Active Mission']); //true

 

 

3. Property Assignment

 

 객체는 변경 가능 하므로 객체를 만든 후에 업데이트 할 수 있습니다

1. 속성이 객체에 이미 존재하는 경우 이전에 보유한 값이 새로 할당 된 값으로 대체됩니다.
2. 해당 이름의 속성이 없으면 새 속성이 객체에 추가됩니다.

 

const로 선언 된 객체를 재 할당 할 수는 없지만

여전히 객체를 변경하여 새로운 속성을 추가하고

거기에있는 속성을 변경할 수 있다는 것을 알아야합니다

const spaceship = {type: 'shuttle'};
spaceship = {type: 'alien'}; // TypeError: Assignment to constant variable.
spaceship.type = 'alien'; // Changes the value of the type property
spaceship.speed = 'Mach 5'; // Creates a new key of 'speed' with a value of 'Mach 5'

 

delete연산자 를 사용하여 객체에서 속성을 삭제할 수 있습니다

const spaceship = {
  'Fuel Type': 'Turbo Fuel',
  homePlanet: 'Earth',
  mission: 'Explore the universe' , 
};

delete spaceship.mission;  // Removes the mission property

 

4. methods

const alienShip = {
  invade: function () { 
    console.log('Hello! We have come to dominate your planet. Instead of Earth, it shall be called New Xaculon.')
  }
};

=

: function 생략 가능

 

const alienShip = {
  invade () { 
    console.log('Hello! We have come to dominate your planet. Instead of Earth, it shall be called New Xaculon.')
  }
};

alienShip.invade(); // Prints 'Hello! We have come to dominate your planet. Instead of Earth, it shall be called New Xaculon.'

 

5.Nested Objects

 

const spaceship = {
     telescope: {
        yearBuilt: 2018,
        model: '91031-XLT',
        focalLength: 2032 
     },
    crew: {
        captain: { 
            name: 'Sandra', 
            degree: 'Computer Engineering', 
            encourageTeam() { console.log('We got this!') } 
         }
    },
    engine: {
        model: 'Nimbus2000'
     },
     nanoelectronics: {
         computer: {
            terabytes: 100,
            monitors: 'HD'
         },
        'back-up': {
           battery: 'Lithium',
           terabytes: 50
         }
    }
}; 

spaceship.nanoelectronics['back-up'].battery; // Returns 'Lithium'

 

 

6. 참조 reference

 

https://www.youtube.com/watch?v=dOTpbvvOV0M

const spaceship = {
  homePlanet : 'Earth',
  color : 'silver'
};

let paintIt = obj => {
  obj.color = 'glorious gold'
};

paintIt(spaceship);

spaceship.color // Returns 'glorious gold'

let spaceship = {
  homePlanet : 'Earth',
  color : 'red'
};
let tryReassignment = obj => {
  obj = {
    identified : false, 
    'transport type' : 'flying'
  }
  console.log(obj) // Prints {'identified': false, 'transport type': 'flying'}

};
tryReassignment(spaceship) // The attempt at reassignment does not work.
spaceship // Still returns {homePlanet : 'Earth', color : 'red'};

spaceship = {
  identified : false, 
  'transport type': 'flying'
}; // Regular reassignment still works.

 

7. loop (for..in)

 

let spaceship = {
    crew: {
    captain: { 
        name: 'Lily', 
        degree: 'Computer Engineering', 
        cheerTeam() { console.log('You got this!') } 
        },
    'chief officer': { 
        name: 'Dan', 
        degree: 'Aerospace Engineering', 
        agree() { console.log('I agree, captain!') } 
        },
    medic: { 
        name: 'Clementine', 
        degree: 'Physics', 
        announce() { console.log(`Jets on!`) } },
    translator: {
        name: 'Shauna', 
        degree: 'Conservation Science', 
        powerFuel() { console.log('The tank is full!') } 
        }
    }
}; 

// for (let variableName in outerObject.innerObject) {
  console.log(`${variableName}: ${outerObject.innerObject[variableName].propertyName}`)
}; //

for (let role in spaceship.crew) {
  console.log(`${role}: ${spaceship.crew[role].name}`)
};

// captain: Lily
chief officer: Dan
medic: Clementine
translator: Shauna //

//for (let variableName in outerObject.innerObject) {
  console.log(`${outerObject.innerObject[variableName].propertyName}: ${outerObject.innerObject[variableName].differentPropertyName}`)
};


for (let name in spaceship.crew) {
  console.log(`${spaceship.crew[name].name}: ${spaceship.crew[name].degree}`)
};

// Lily: Computer Engineering
Dan: Aerospace Engineering
Clementine: Physics
Shauna: Conservation Science