【Codecademy学习Javascript】类的注意

1.类中属性的引用

类中属性的引用可以用点方法或中括号方法，但是当访问包含数字、空格或特殊字符的键时，我们必须使用括号表示法。在这些情况下如果没有括号符号，我们的代码就会抛出错误。

必须使用括号法：

1.1.key含有空格就不能使用spaceship.Fuel Type了

let spaceship = {
  'Fuel Type': 'Turbo Fuel',
  'Active Duty': true,
  homePlanet: 'Earth',
  numCrew: 5
};
spaceship['Active Duty'];   // Returns true
spaceship['Fuel Type'];   // Returns  'Turbo Fuel'
spaceship['numCrew'];   // Returns 5
spaceship['!!!!!!!!!!!!!!!'];   // Returns undefined

1.2.如果这里用objectName.propName,那会直接访问不存在的propName属性了。

let returnAnyProp = (objectName, propName) => objectName[propName];
 
returnAnyProp(spaceship, 'homePlanet'); // Returns 'Earth'

如果我们尝试使用点符号 (objectName.propName) 编写 returnAnyProp() 函数，计算机将在我们的对象上查找“propName”键，而不是 propName 参数的值。让我们练习一下使用括号表示法来访问属性！

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

3.类的方法定义

当存储在对象上的数据是一个函数时，我们称之为方法。属性是对象所拥有的，而方法是对象所做的。
对象方法看起来熟悉吗？那是因为你一直在使用它们！例如，console 是一个全局 JavaScript 对象，.log() 就是该对象上的一个方法。Math 也是一个全局 JavaScript 对象，.floor() 是它的一个方法。
我们可以通过创建普通的、以冒号分隔的键值对，在对象文字中包含方法。键是方法的名称，而值则是匿名函数表达式。

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.'

4.类的嵌套。

在应用程序代码中，对象通常是嵌套的--一个对象可能有另一个对象的属性，而另一个对象的属性又可能是更多对象的数组！

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'

5.嵌套案例：

let spaceship = {
  passengers: [{ zch: { age: 18 } },{zyt:{age:17}}],
  telescope: {
    yearBuilt: 2018,
    model: "91031-XLT",
    focalLength: 2032,
  },
  crew: {
    captain: {
      name: "Sandra",
      degree: "Computer Engineering",
      encourageTeam() {
        console.log("We got this!");
      },
      "favorite foods": ["cookies", "cakes", "candy", "spinach"],
    },
  },
  engine: {
    model: "Nimbus2000",
  },
  nanoelectronics: {
    computer: {
      terabytes: 100,
      monitors: "HD",
    },
    "back-up": {
      battery: "Lithium",
      terabytes: 50,
    },
  },
};
let capFave = spaceship.crew.captain["favorite foods"][0];
let firstPassenger = spaceship.passengers[0];
console.log(firstPassenger.zch.age) ; //输出 18