JavaScript专项算法题(5):面向对象

@冒泡的马树

题库原地址: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 26
sandra.greet(); //-> Logs 'hello'

挑战3/3

问题:

在不改变上述已写代码的情况下,给personStore对象添加一个用于打印“Hi,my name is [name]"的introduce方法。

题解:

/*** CHALLENGE 3 of 3 ***/

// add code here
personStore["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 30
mike.greet(); //-> Logs 'hello'

挑战3/3

问题:

在不改变上述已写代码的情况下,给PersonConstructor函数添加一个打印“Hi, my name is [name]"的introduce方法。

题解:

/*** CHALLENGE 3 of 3 ***/
// add code here
PersonConstructor.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 here
class 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"

JavaScript专项算法题(5):面向对象_第1张图片

你可能感兴趣的