@冒泡的马树

题库原地址:http://csbin.io/oop

面向对象

应用实义化的对象

挑战1/1

问题:

构建一个称为makePerson的承受两个参数(name和age)的函数,返回一个对象。此函数会:

  1. 创立一个空对象;
  2. 给空对象一个键名为name的属性,键值为输出函数的name参数的值;
  3. 给空对象一个键名为age的属性,键值为输出函数的age参数的值;
  4. 返回对象。

题解:

/****************************************************************                  WORKING WITH OBJECT LITERALS****************************************************************//*** CHALLENGE 1 of 1 ***/function makePerson(name, age) {  // add code here  const innerObj = {};  innerObj["name"] = name;  innerObj["age"] = age;  return innerObj;}const vicky = makePerson("Vicky", 24);/********* Uncomment these lines to test your work! *********/console.log(vicky.name); // -> Logs 'Vicky'console.log(vicky.age); // -> Logs 24

应用Object.create

挑战1/3

问题:

在personStore对象内,创立greet属性,其值为一个打印“hello”的函数。

题解:

/****************************************************************                       USING OBJECT.CREATE****************************************************************//*** CHALLENGE 1 of 3 ***/const personStore = {  // add code here  greet: function () {    console.log("hello");  },};/********* Uncomment this line to test your work! *********/personStore.greet(); // -> Logs 'hello'

挑战2/3

问题:

构建personFromPersonStore函数,承受的参数为name和age。当被调用时,此函数会被通过Object.create办法在personStore对象上创立person对象。

题解:

/*** CHALLENGE 2 of 3 ***/function personFromPersonStore(name, age) {  // add code here  const innerObj = Object.create(personStore);  innerObj["name"] = name;  innerObj["age"] = age;  return innerObj;}const sandra = personFromPersonStore("Sandra", 26);// /********* Uncomment these lines to test your work! *********/console.log(sandra.name); // -> Logs 'Sandra'console.log(sandra.age); //-> Logs 26sandra.greet(); //-> Logs 'hello'

挑战3/3

问题:

在不扭转上述已写代码的状况下,给personStore对象增加一个用于打印“Hi,my name is [name]"的introduce办法。

题解:

/*** CHALLENGE 3 of 3 ***/// add code herepersonStore["introduce"] = function () {  console.log(`Hi, my name is ${this.name}`);};sandra.introduce(); // -> Logs 'Hi, my name is Sandra'

应用”new“关键词

挑战1/3

问题:

构建PersonConstructor函数。其利用“this"关键词来保留属性到greet作用域上。greet应该是一个打印“hello”字符串的函数。

题解:

/****************************************************************                    USING THE 'NEW' KEYWORD****************************************************************//*** CHALLENGE 1 of 3 ***/function PersonConstructor() {  // add code here  this.greet = () => console.log("hello");}// /********* Uncomment this line to test your work! *********/const simon = new PersonConstructor();simon.greet(); // -> Logs 'hello'

挑战2/3

问题:

构建personFromConstructor函数,承受参数为name和age。当被调用时,此函数会应用“new”关键词来创立person对象而不是Object.create办法。

题解:

/*** CHALLENGE 2 of 3 ***/function personFromConstructor(name, age) {  // add code here  const innerPerson = new PersonConstructor();  innerPerson.name = name;  innerPerson.age = age;  return innerPerson;}const mike = personFromConstructor("Mike", 30);/********* Uncomment these lines to test your work! *********/console.log(mike.name); // -> Logs 'Mike'console.log(mike.age); //-> Logs 30mike.greet(); //-> Logs 'hello'

挑战3/3

问题:

在不扭转上述已写代码的状况下,给PersonConstructor函数增加一个打印“Hi, my name is [name]"的introduce办法。

题解:

/*** CHALLENGE 3 of 3 ***/// add code herePersonConstructor.prototype.introduce = function () {  console.log(`Hi, my name is ${this.name}`);};mike.introduce(); // -> Logs 'Hi, my name is Mike'

应用ES6的类

挑战1/2

问题:

构建PersonClass类。PersonClass应有一个承受name参数并存储为名为name的属性的结构器。PersonClass还应有一个称为greet的办法,用于打印“hello”字符串。

题解:

/****************************************************************                        USING ES6 CLASSES****************************************************************//*** CHALLENGE 1 of 2 ***/class PersonClass {  constructor(name) {    // add code here    this.name = name;  }  // add code here  greet() {    console.log("hello");  }}// /********* Uncomment this line to test your work! *********/const george = new PersonClass('');george.greet(); // -> Logs 'hello'

挑战2/2

问题:

构建DeveloperClass类。DeveloperClass类通过扩大PersonClass类来结构对象。除领有name属性和greet办法外,DeveloperClass还应有个introduce办法。当被调用时,introduce办法会打印“Hello World, my name is [name]”.

题解:

/*** CHALLENGE 2 of 2 ***/// add code hereclass DeveloperClass extends PersonClass {  introduce() {    console.log(`Hello World, my name is ${this.name}`);  }}/********* Uncomment these lines to test your work! *********/const thai = new DeveloperClass("Thai", 32);console.log(thai.name); // -> Logs 'Thai'thai.introduce(); //-> Logs 'Hello World, my name is Thai'

拓展:子类

挑战1/5

问题:

构建adminFunctionStore对象,其能够拜访userFunctionStore的所有办法,在不将办法一一于本身内复制的状况下。

题解:

const userFunctionStore = {  sayType: function () {    console.log("I am a " + this.type);  },};let adminFunctionStore = Object.create(userFunctionStore);

挑战2/5

问题:

构建adminFactory函数,用于创立一个蕴含userFactory下所有数据域及默认值的对象,在不将数据域一一于本身内复制的状况下。

题解:

function userFactory(name, score) {  let user = Object.create(userFunctionStore);  user.type = "User";  user.name = name;  user.score = score;  return user;}function adminFactory(name, score) {    const admin = new userFactory(name, score);    return admin;}

挑战3/5

问题:

而后确保adminFactory中的type‘域的值为’Admin‘而不是’User'。

题解:

function adminFactory(name, score) {    const admin = new userFactory(name, score);    admin.type = 'Admin';    return admin;}

挑战4/5

问题:

确保adminFactory对象能够拜访到adminFunctionStore对象中的办法,在不全副复制的状况下。

题解:

function adminFactory(name, score) {  let admin = Object.create(adminFunctionStore, {    name: {      value: name,    },    score: {      value: score,    },  });  admin.type = "Admin";  return admin;}

挑战5/5

问题:

创立一个打印“Welcome users!"的sharePublicMessage办法,实用于adminFactory对象,但不适用于userFactory对象。请不要在adminFactory中间接增加这个办法。

题解:

const adminFunctionStore = Object.create(userFunctionStore, {  sharePublicMessage: {    value: function () {      console.log("Welcome users!");    },  },});const adminTester = new adminFactory("Mike", 89);adminTester.sharePublicMessage(); // -> "Welcom users!"console.log(adminTester.type);  // -> "Admin"const userTester = new userFactory("June", 90);// userTester.sharePublisMessage();  // -> error!console.log(userTester.type); // -> "User"const adminFromFactory = adminFactory("Eva", 5);adminFromFactory.sayType(); // -> Logs "I am a Admin"adminFromFactory.sharePublicMessage(); // -> Logs "Welcome users!"

拓展:Mixins

问题:

Mixins是面向对象编程中使对象取得除继承外的办法和属性的工具。在这个挑战中,补充下方代码,使robotFido领有robotMixin的所有属性。请仅实用一行代码,在不一一增加属性的状况下。

class Dog {  constructor() {    this.legs = 4;  }  speak() {    console.log('Woof!');  }}const robotMixin = {  skin: 'metal',  speak: function() { console.log(`I have ${this.legs} legs and am made of ${this.skin}`) },}let robotFido = new Dog();

题解:

robotFido = Object.assign(robotFido, robotMixin);robotFido.speak(); // -> Logs "I am made of 4 legs and am made of metal"