this部分相关问答
apply、call 、bind有什么作用，什么区别
- 改变函数体内this的指向
- apply、call之间的作用一样，传递参数不一样
- bind()方法会创建一个新函数
以下代码输出什么?
var john = {
firstName:'John'
}
function func(){
alert(this.firstName + ': hi!')
}
john.sayHi = func;
//john.sayHi = function(){} 函数体的this指向john这个对象
john.sayHi()
//所以输出 John: hi!
下面代码输出什么，为什么
func()
function func() {
// 函数体内没有this，所以指向全局，输出window对象
alert(this)
}
下面代码输出什么
document.addEventListener('click', function(e){
console.log(this); //指向绑定事件的对象document
setTimeout(function(){
console.log(this); //指向全局，输出window对象
}, 200);
}, false);
下面代码输出什么，why
var john = {
firstName: "John"
}
function func() {
alert( this.firstName )
}
func.call(john) //通过Function.call方法把this值指向john这个对象，所以输出'John'
以下代码有什么问题，如何修改
var module= {
bind: function(){
$btn.on('click', function(){
console.log(this) //this指什么
this.showMsg();
})
},
showMsg: function(){
console.log('饥人谷');
}
}
- 在$btn绑定事件中,this指定的是绑定对象$btn,所以this.showMsg()无法找到，修改如下
var module= {
bind: function(){
var _this = this; //保存this变量
$btn.on('click', function(){
console.log(this);
_this.showMsg();
})
},
showMsg: function(){
console.log('饥人谷');
}
}
原型链相关问题
有如下代码，解释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();
原型链_1
上例中，对对象 p可以这样调用 p.toString()。toString是哪里来的? 画出原型图?并解释什么是原型链。
-
toString()方法来源于构造函数对象的原型Object。
原型链_2 - 在 javaScript 中，每个对象都有一个指向它的原型（prototype）对象的内部链接。这个原型对象又有自己的原型，直到某个对象的原型为 null 为止（也就是不再有原型指向），组成这条链的最后一环。这种一级一级的链结构就称为原型链（prototype chain）。
对String做扩展，实现如下方式获取字符串中频率最高的字符
String.prototype.getMostOfen = function(){
var obj = {};
for(var i = 0;i<this.length;i++){
var k = this[i];
if(obj[k]){
obj[k]++;
}else{
obj[k] = 1;
}
}
console.log(obj);
var num = 0;
var word = '';
for(var key in obj){
if(obj[key]>num){
num = obj[key];
word = key;
}
}
return '因为' + word + ' 出现了' + num + ' 次';
}
var str = 'ahbbccdeddddfg';
str.getMostOfen();
instanceOf有什么作用？内部逻辑是如何实现的？
- instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。
- instanceof检测对象A是不是对象B的实例的原理：查看对象B的prototype所指向的对象是否在A的[[prototype]]链(原型链)上。
继承部分
继承有什么作用?
- 利用原型让一个引用类型继承另一个引用类型的属性和方法
下面两种写法有什么区别?
//方法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);
- 方法一在对象实例中添加了printName函数
- 方法二是在对象实例的原型对象中添加了printName函数
- 方法二达到节省内存的目的
Object.create 有什么作用？兼容性如何？
-
Object.create() 方法创建一个拥有指定原型和若干个指定属性的对象。
兼容性
hasOwnProperty有什么作用？ 如何使用？
- hasOwnProperty() 方法会返回一个布尔值，其用来判断某个对象是否含有指定的属性。
- hasOwnProperty() 用来判断自身属性，而非原型链上存在的属性
function Xxx(age){
this.age = age;
}
Xxx.prototype.sex = 'female';
var o = new Xxx(30);
console.log(o.hasOwnProperty('age')); // true
console.log(o.hasOwnProperty('sex')); // 原型链上的属性，所以输出false
如下代码中call的作用是什么?
function Person(name, sex){
this.name = name;
this.sex = sex;
}
function Male(name, sex, age){
Person.call(this, name, sex); //这里的 call 有什么作用
this.age = age;
}
- Male函数继承了Person函数的'name'和'sex'参数属性
补全代码，实现继承
function Person(name,sex){
this.name = name;
this.sex = sex;
}
Person.prototype.getName = function(){
return this.name;
}
Person.prototype.printName = function(){
console.log(this.name);
}
function Male(name,sex,age){
Person.call(this,name,sex);
this.age = age;
}
Male.prototype = new Person();
Male.prototype.constructor = Male;
Male.prototype.getAge = function(){
console.log(this.age);
}
var ruoyu = new Male('若愚', '男', 27);
ruoyu.printName();
