1、apply、call 、bind有什么作用,什么區別
作用:改變執行上下文中this的指向
區別:apply/call與bind的區別主要是,前者改變this指向后立即執行,而后者則是返回指定this指向后的函數;apply與call的區別主要是第二個參數不同,前者第二個參數應該是一個數組,后者的第二個參數是需要依次傳進去的參數列表。
2、以下代碼輸出什么?
var john = {
firstName: "John"
}
function func() {
alert(this.firstName + ": hi!")
}
john.sayHi = func
john.sayHi()
// John : hi!
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);
//第一個this指向document,因此會打印出document
//第二個this指向全局即window,因此打印出window
5、下面代碼輸出什么,why
var john = {
firstName: "John"
}
function func() {
alert( this.firstName )
}
func.call(john)
//John
//call 綁定this,指向John對象
6、以下代碼有什么問題,如何修改
var module= {
bind: function(){
$btn.on('click', function(){
console.log(this) //this指什么
this.showMsg();
})
},
showMsg: function(){
console.log('饑人谷');
}
}
//module的bind方法中綁定事件之后,this指向發生變化,不在指向當前對象,而是指向綁定事件的元素,因此對象的其他方法會出現錯誤。
//修改方法:聲明中間變量
var module= {
bind: function(){
var _this = this
$btn.on('click', function(){
console.log(_this)
_this.showMsg();
})
},
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();
p.__proto__ === Person.prototype
Person.prototype.constructor === Person
Person.prototype.__proto__ === Object.prototype
p是Person的實例化
8、上例中,對對象 p可以這樣調用 p.toString()。toString是哪里來的? 畫出原型圖?并解釋什么是原型鏈。
原型鏈
原型鏈:每個對象都有一個指向它的原型(prototype)對象的內部指針。這個原型對象又有自己的原型,直到某個對象的原型為 null 為止(也就是不再有原型指向),組成這條鏈的最后一環。這種鏈結構就稱為原型鏈(prototype chain)。
9、對String做擴展,實現如下方式獲取字符串中頻率最高的字符
String.prototype.getMostOften = function(){
var obj = {}
var maxNum=0,
maxValue;
var arr = this.split('')
for(var i = 0;i < arr.length;i++){
if(obj[arr[i]]){
obj[arr[i]]++;
}else{
obj[arr[i]]=1;
}
}
for(j in obj){
if(obj[j]>maxNum){
maxNum = obj[j];
maxValue = j;
}
}
return maxValue;
}
var str = 'ahbbccdeddddfg';
var ch = str.getMostOften();
console.log(ch); //d , 因為d 出現了5次
10、instanceOf有什么作用?內部邏輯是如何實現的?
instanceof 運算符用來測試一個對象在其原型鏈中是否存在一個構造函數的 prototype 屬性。
語法:object instanceof constructor
每個實例都包含一個指向原型對象的內部指針(proto),通過該指針可以找到其原型鏈上的所有內容,因此可以檢測 constructor.prototype 是否存在于參數 object 的原型鏈上。
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)
//該種方法將printName方法直接寫在函數內部,每次創建新的實例都會重新寫一次printName方法,比較占用內存
//方法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,而是在原型中尋找,減少了內存的使用。
13、Object.create 有什么作用?兼容性如何?
Object.create() 方法會使用指定的原型對象及其屬性去創建一個新的對象。IE9以上的版本可以兼容。
14、hasOwnProperty有什么作用? 如何使用?
hasOwnPerperty是Object.prototype的一個方法,可以判斷一個對象是否包含自定義屬性而不是原型鏈上的屬性,hasOwnProperty是JavaScript中唯一一個處理屬性但是不查找原型鏈的函數
15、如下代碼中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;
}
//call將Person內部的this值更改成了call函數的的第一個參數,也就是Male,使得Male可以使用Person的方法。
16、補全代碼,實現繼承
function Person(name, sex){
this.name = name
this.sex = sex
}
Person.prototype.getName = function(){
console.log(this.name)
};
function Male(name, sex, age){
Person.call(this,name,sex)
this.age = age
}
Male.prototype = Object.create(Person.prototype)
// 在繼承函數之后寫自己的方法,否則會被覆蓋
Male.prototype.getAge = function(){
console.log(this.age)
}
Male.prototype.printName = function(){
this.getName()
this.getAge()
}
var ruoyu = new Male('若愚', '男', 27);
ruoyu.printName();