问题1： apply、call 、bind有什么作用，什么区别
在JS中，这三者都是用来改变函数的this对象的指向的
- 三者的相似之处：
- 都是用来改变函数的
this对象的指向的 - 第一个参数都是
this要指向的对象 - 都可以利用后续参数传参
- 都是用来改变函数的
var people = {
name: 'quincy',
age: 24,
say: function(){
console.log(this.name + ',' + this.age)
}
}
var student = {
name:' qcy',
age: 18
}
假设student需要使用people中的say方法，则需要改变函数的this指向（即改变函数的执行上下文）
people.say.call(student)
people.say.apply(student)
people.say.bind(student)()
call和apply都是对函数的直接调用，而bind方法返回的仍然是一个函数，因此后面还需要()来进行调用才可以。
func.call(this, arg1, arg2);
func.apply(this, [arg1, arg2])
call 和 apply 的区别在于
call 需要把参数按顺序传递进去，而 apply 则是把参数放在数组里。
问题2： 以下代码输出什么?
var john = {
firstName: "John"
}
function func() {
alert(this.firstName + ": hi!")
}
john.sayHi = func
john.sayHi()
-> John: hi!
因为 func 是通过对象 john 运行的，所以 this 指向 john
问题3： 下面代码输出什么，为什么
func()
function func() {
alert(this)
}
-> [object Window]
因为函数不通过对象调用时，this 指向 window
问题4：下面代码输出什么
document.addEventListener('click', function(e){
console.log(this);
setTimeout(function(){
console.log(this);
}, 200);
}, false);
-> #document
绑定 document 之后，事件发生运行的函数里的 this 指向绑定的对象
-> [object Window]
setTimeout 中的延迟执行代码中的 this 永远都指向 window
问题5：下面代码输出什么，why
var john = {
firstName: "John"
}
function func() {
alert( this.firstName )
}
func.call(john)
-> John
call 改变了 func 的 this 为对象 john
问题6： 以下代码有什么问题，如何修改
var module= {
bind: function(){
$btn.on('click', function(){
console.log(this) // this指向了 $btn
this.showMsg();
})
},
showMsg: function(){
console.log('饥人谷');
}
}
var module= {
bind: function(){
$btn.on('click', function(){
console.log(this)
this.showMsg();
}.bind(this)) // 加上 bind(this)
},
showMsg: function(){
console.log('饥人谷');
}
}
问题7：有如下代码，解释Person、 prototype、proto、p、constructor之间的关联。
function Person(name){
this.name = name;
}
Person.prototype.sayName = function(){
console.log('My name is :' + this.name);
}
var p = new Person("若愚")
p.sayName();
Person 是一个构造函数，有 prototype 属性，指向 Person 的原型，原型中有 constructor 属性
Person.prototype.constructor === Person
-> true
p 是 Person 构造出的一个实例，拥有 Proto 属性，
p.__proto__ === Person.prototype
-> true
问题8： 上例中，对对象 p可以这样调用 p.toString()。toString是哪里来的? 画出原型图?并解释什么是原型链。
-
原型图
原型链
对象的属性和方法，有可能是定义在自身，也有可能是定义在它的原型对象。由于原型本身也是对象，又有自己的原型，所以形成了一条原型链（prototype chain）。比如，a对象是b对象的原型，b对象是c对象的原型，以此类推
如果一层层地上溯，所有对象的原型最终都可以上溯到Object.prototype，即Object构造函数的prototype属性指向的那个对象。那么，Object.prototype对象有没有它的原型呢？回答可以是有的，就是没有任何属性和方法的null对象，而null对象没有自己的原型
「原型链」的作用是，读取对象的某个属性时，JavaScript 引擎先寻找对象本身的属性，如果找不到，就到它的原型去找，如果还是找不到，就到原型的原型去找。如果直到最顶层的Object.prototype还是找不到，则返回undefined
问题9：对String做扩展，实现如下方式获取字符串中频率最高的字符
function getMostOften() {
let calc = ''
let stat = []
let flag = 0
for (let i=0; i<this.length; i++){
let t = calc.indexOf(this[i])
if (t === -1) {
calc += this[i]
stat.push(0)
} else {
flag = ++stat[t] > stat[flag] ? t : flag
}
}
return calc[flag]
}
String.prototype.getMostOften = getMostOften
var str = 'ahbb ccdeddddfg';
var ch = str.getMostOften();
console.log(ch); //d , 因为d 出现了5次
问题10： instanceOf有什么作用？内部逻辑是如何实现的？
检查一个对象是不是某个函数的实例，或者说
instanceOf运算符用来测试一个对象在其原型链中是否存在一个构造函数prototype 属性
function _instanceOf(obj,fn){
var proto=obj.__proto__;
do{
if(proto===fn.prototype){
return true;
}else{
proto=proto.__proto__
}
}while(proto)
return false;
}
var arr=[1,2,3];
_instanceOf(arr,Array);//true
_instanceOf(arr,Object)//true
问题11：继承有什么作用?
- 子类拥有父类的属性和方法，不需要重复写代码，修改时也只需修改一份代码
- 可以重写和扩展父类的属性和代码，又不影响父类本身
问题12： 下面两种写法有什么区别?
//方法1
function People(name, sex){
this.name = name;
this.sex = sex;
this.printName = function(){
console.log(this.name);
}
}
var p1 = new People('饥人谷', 2)
//方法2
function Person(name, sex){
this.name = name;
this.sex = sex;
}
Person.prototype.printName = function(){
console.log(this.name);
}
var p1 = new Person('若愚', 27);
写法2中的printName方法绑定在Person.prototype上，如果有p2，p3……更多Person的实例，他们都可以共用此方法，节省内存空间，节约了代码量，提高了性能
问题13： Object.create 有什么作用？兼容性如何？
Object.create()方法会使用指定的原型对象及其属性去创建一个新的对象。
下面的例子演示了如何使用Object.create()来实现类式继承。这是一个单继承。
function grandfather(name) {
this.name = name
}
grandfather.prototype.say = function() {
console.log('My name is ' + this.name)
};
function father(name) {
grandfather.call(this,name)
}
father.prototype = Object.create(grandfather.prototype)
father.prototype.constructor = father
var p1 = new father('qqw')
问题14： hasOwnProperty有什么作用？ 如何使用？
-
hasOwnProperty是JavaScript中唯一一个只涉及对象自身属性而不会遍历原型链的方法。 - 它可以判断一个对象是否包含自定义属性和方法而不是原型链上的属性和方法
const a = {prop:'exist'}
a.hasOwnProperty('prop') //true
a.hasOwnProperty('toString') //false
问题15：如下代码中call的作用是什么?
function Person(name, sex){
this.name = name;
this.sex = sex;
}
function Male(name, sex, age){
Person.call(this, name, sex); //这里的 call 有什么作用 -> 传递 Male() 执行时的 this 给 Person()
this.age = age;
}
问题16： 补全代码，实现继承
function Person(name, sex){
this.name = name
this.sex = sex
}
Person.prototype.getName = function(){
return this.name
};
function Male(name, sex, age){
this.age = age
Person.call(this,name,sex)
}
Person.prototype.printName = function() {
console.log(this.getName())
};
Male.prototype = Object.create(Person.prototype)
Male.prototype.__proto__.constructor = Male
Male.prototype.getAge = function(){
return this.age
};
var ruoyu = new Male('若愚', '男', 27);
ruoyu.printName();
