面试题解答

1.这道题输出结果

var z=10;

function foo(){
console.log(z);

}

(function(funArg){
var z=20;
funArg()

})(foo)

解答：函数自动执行，函数参数是值传递，funArg引用外部foo函数，而foo函数作用域没有z变量，所以找到全局变量z，输出结果10

2.代码执行后结果

var data=[];
for(var k=0;k<3;k++){
data[k]=function(){
console.log(k)
}
}
data[0]();
data[1]();
data[2]();

解答：通过for循环此时，data数组中存了3个function(){console.log(k)}，而变量k也变成3，所以当调用数组中函数这个k就是3，输出结果三个3

3.假设现有一篇文章，var content = "...大量文字"，
文章中触及到一些敏感词汇,如 ["习近平","周永康","中共","6.4"] 等内容。
如何在文章中发现这些敏感词，并将背景设置为红色或者改变字体颜色并标示出来。

解答：

var RepaceWord=function(){
this.content='1111aaaaa习近平，fffff周永康ffff，fff中共llll，@#！6.4##@';
this.words=['习近平','周永康','中共','6.4'];
}
RepaceWord.prototype={
changeColor:function(){
for(var i=0;i<this.words.length;i++){
this.content=this.content.replace(new RegExp(this.words[i],'g'),'<span style="background:red;">'+this.words[i]+'</span>')
}
return this.content;
}
}
var content=new RepaceWord().changeColor()
console.log(content)

这道题考的是字符串替换replace()，第一个参数正则，第二个全局，返回你替换过的字符串

4.JQuery 中 $.fn.extend 函数的实现（实现核心代码即可）

解答： $.fn.extend()是向JQuery添加公用属性和方法，$.extend()是向JQuery类添加静态方法

//创建JQuery类

var JQuery=function(selector){
this.selector=document.getElementById(selector.slice(1));
}


JQuery.prototype={
constuctor:JQuery,
extend:function(fnName,fn){
(typeof this[fnName]==='function')?this[fnName]=new Function():this[fnName]=fn;

}
}
JQuery.extend=function(fnName,fn){
(typeof this[fnName]==='function')?this[fnName]=new Function():this[fnName]=fn;
}
var $=function(selector){
return new JQuery(selector);
}


$.fn=JQuery.prototype;
$.extend=JQuery.extend;

$.fn.extend('colorRed',function(){
this.selector.style.color='red';
});
$.extend('add',function(){
console.log(1)
})

var box=$('#box');
box.colorRed()
JQuery.extend();
$.add()

5.设计基于观察者模式的事件绑定机制

观察者模式又成为订阅发布模式所以

var Observer=(function(){
var _message={};
return{
//订阅
regist:function(type,fn){
(typeof _message[type]==='undefined')?_message[type]=[fn]:_message[type].push(fn);
},
//发布
fire:function(type,args){
if(!_message[type]){
return;
}
var events={
type:type,
args:args||{}
},
i=0,
len=_message[type].length;
for(;i<len;i++){
_message[type][i].call(this,events);
}
},
//删除
remove:function(type,fn){
if(_message[type] instanceof Array){
var i=_message[type].length-1;
for(;i>=0;i--){
_message[type][i]===fn && _message[type].splice(i,1);
}
}
}
}
})()
Observer.regist('test',function(e){
console.log(e.type,e.args.msg)
})
Observer.fire('test',{msg:'传递参数'})