前端面试典型例题之ECMAScript6，2020.12.07

2020-12-12 15:33:55 阅读：289 来源： 互联网

标签：ECMAScript6 07 kitty say new 例题 super class name

1.编写程序使用ES6定义 Person类，包括类实例属性（name,age）,实例方法say()该方法返回name和age字符串

<script>
  class Person {
    constructor(name, age) {
      //实例属性
      this.name = name;
      this.age = age;
      //实例方法
      // this.say = function () {
      //   return `姓名：${this.name}，年龄：${this.age}`;
      // }
    }
    say() {
        return `姓名：${this.name}，年龄：${this.age}`;
    }
  }

  let p = new Person('李四', 25);
  let str = p.say();
  console.log(str);
</script>

2.下面程序执行结果为:

 var p=new Person();
  console.log(p.__proto__===Person.prototype)

结果：true：
在原型链中，实例对象的__proto__ 和 构造函数Person的prototype 都指向的是 Person.prototype

3.下面程序正确吗？错在哪里？如何改正？

class Point {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
}
class ColorPoint extends Point {
          constructor(x, y, color) {
	this.color = color; // ReferenceError
	super(x, y);
           }
}
var cp=new ColorPoint(10,20,'red');

结果：报错 Uncaught ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor
原因：
		 1.子类的this关键字根据super方法创建，必须先有super方法，this关键字才能使用，否则就会报错。
		 2.子类没有自己的this对象，需要继承父类的this对象再添加东西
修改办法：替换子类constructor中super和this语句的顺序，即：
class ColorPoint extends Point {
   constructor(x, y, color) {
    super(x, y);
	this.color = color; // ReferenceError
   }
}

4.下面程序执行结果为？

class Parent {
  static myMethod(msg) {
    console.log('static', msg);
  }
  myMethod(msg) {
    console.log('instance', msg);
  }
}
class Child extends Parent {
  static myMethod(msg) {
    super.myMethod(msg);
  }
  myMethod(msg) {
    super.myMethod(msg);
  }
}
Child.myMethod(1);
var child = new Child();
child.myMethod(2);

结果：
	static 1
	instance 2
分析：
Child.myMethod(1);通过子类名调用，执行的是子类中的静态方法，在子类的静态方法中通过super关键字调用父类中的静态方法
child.myMethod(2);通过实例对象调用，执行的是子类中的普通方法，在子类的普通方法中通过super关键字调用父类中的普通方法

5.请利用class重新定义Cat，并让它从已有的Animal继承，然后新增一个方法say()，返回字符串’Hello, xxx!'

class Animal {
    constructor(name) {
        this.name = name;
    }
}

结果：
class Animal {
    constructor(name) {
      this.name = name;
    }
  }

  class Cat extends Animal {
    constructor(name) {
      super(name);
    }
    say() {
      return 'Hello, xxx!'
    }
  }

  let  tom = new Cat('TomCat');
  console.log(tom.say());

6.接上面程序分析下面代码执行结果为

var kitty = new Cat('Kitty');
var doraemon = new Cat('哆啦A梦');
if ((new Cat('x') instanceof Animal) && kitty && kitty.name === 'Kitty' && kitty.say &&
 typeof kitty.say === 'function' && kitty.say() === 'Hello,Kitty!'  && 
kitty.say === doraemon.say) {
         console.log('测试通过!');
} else {
        console.log('测试失败!');
}

结果：测试失败!
原因：
new Cat('x') instanceof Animal：判断Cat类的实例对象是否为Animal类的实例对象，true
kitty：var声明的变量，保存了Cat类的实例对象，传递参数'Kitty'，故kitty.name === 'Kitty' && kitty ，true
typeof kitty.say === 'function'：判断kitty.say保存的数据类型是否为function ,true
kitty.say() === 'Hello,Kitty!'：判断say方法执行的结果，上面的返回'Hello, xxx' != 'Hello,Kitty'，false
kitty.say === doraemon.say：写在constructor外的方法是类的原型的，是共有的,true

所以该if语句最终为false

7.下面程序执行结果为

(typeof (new (class { class () {} })));

结果："object"
typeof：用来判断数据的类型，然而通过new声明的数据都是object类型的

标签：ECMAScript6,07,kitty,say,new,例题,super,class,name
来源： https://blog.csdn.net/MaybyYouLove/article/details/111060477

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

前端面试典型例题之ECMAScript6，2020.12.07