freeCodeCamp/use-class-syntax-to-define-a-constructor-function.md at dec409a4bd667e4979305cc1e86e0702bbc2c707

Oliver Eyton-Williams dec409a4bd fix: s/localeTitle/title/g

2020-10-06 23:10:08 +05:30

2.8 KiB

Raw Blame History

id, challengeType, forumTopicId, title

id	challengeType	forumTopicId	title
587d7b8b367417b2b2512b53	1	301212	使用 class 语法定义构造函数

Description

ES6 提供了一个新的创建对象的语法，使用关键字class。值得注意的是，class只是一个语法糖，它并不像 Java、Python 或者 Ruby 这一类的语言一样，严格履行了面向对象的开发规范。在 ES5 里面，我们通常会定义一个构造函数，然后使用 new 关键字来实例化一个对象：

var SpaceShuttle = function(targetPlanet){
  this.targetPlanet = targetPlanet;
}
var zeus = new SpaceShuttle('Jupiter');

class的语法只是简单地替换了构造函数的写法：

class SpaceShuttle {
  constructor(targetPlanet) {
    this.targetPlanet = targetPlanet;
  }
}
const zeus = new SpaceShuttle('Jupiter');

应该注意 class 关键字声明了一个函数，里面添加了一个构造器（constructor）。当调用 new 来创建一个新对象时构造器会被调用。

注意：

首字母大写驼峰命名法是 ES6 class 名的惯例，就像上面的 SpaceShuttle。
构造函数是一个特殊的函数，在用 class 创建时来创建和初始化对象。在 JavaScript 算法和数据结构证书的面向对象章节里会更深入介绍。

Instructions

使用class关键字，并写出正确的构造函数，来创建Vegetable这个类： Vegetable这个类可以创建 vegetable 对象，这个对象拥有一个在构造函数中赋值的name属性。

Tests

tests:
  - text: <code>Vegetable</code> 应该是一个 <code>class</code>，并在其中定义了<code>constructor</code>方法。
    testString: assert(typeof Vegetable === 'function' && typeof Vegetable.constructor === 'function');
  - text: 使用了<code>class</code>关键字。
    testString: assert(code.match(/class/g));
  - text: <code>Vegetable</code>可以被实例化。
    testString: assert(() => {const a = new Vegetable("apple"); return typeof a === 'object';});
  - text: <code>carrot.name</code> 应该返回 <code>carrot</code>.
    testString: assert(carrot.name=='carrot');

Challenge Seed

/* Alter code below this line */

/* Alter code above this line */

const carrot = new Vegetable('carrot');
console.log(carrot.name); // => should be 'carrot'

Solution

class Vegetable {
  constructor(name) {
    this.name = name;
  }
}
const carrot = new Vegetable('carrot');

2.8 KiB Raw Blame History Unescape Escape