关于javascript:JavaScript专项算法题5面向对象

30次阅读

共计 5887 个字符，预计需要花费 15 分钟才能阅读完成。

@冒泡的马树

题库原地址：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
发表至： javascript
2020-09-26
 0
Promise学习总结
在nodejs中使用mysql2库
关于javascript:ES6对象属性名简洁表示法和表达式对象新方法属性的遍历
关于javascript:JS性能优化1