jQuery和JavaScript的面试题

2019-02-14

一、JavaScript面试题

1、scope作用范围

(function(){
	var a=b=10;
})();
console.log(b);

什么会打印在控制台上？
答：
控制台上会打印出 10
因为这里两个声明变量，a是用var 声明的局部变量，而b是全局变量
没有使用 'use strict' 严格模式，在严格模式下，代码就会引发ReferenceError错误，b没有定义（b is undefined），严格模式需要明确指出才能实现全局变量。

2、创建源生’native’方法

给字符串对象定义一个repeatify功能。当传入一个整数n时，它会返回重复n次字符串的结果。例如：

1	console.log('hello'.repeatify(3))

回答：打印出hellohellohello
    实现如下

String.prototype.repeatify = String.prototype.repeatify || function(time){
	var str= '';
	for(var i=0;i<time;i++){
		str +=this;
	};
	return str
}

3.声明提升（Hoisting）

执行这段代码，输出的结果是什么

(function(){
	console.log(a);
	console.log(foo());
	var a = 1;
	function foo(){
		return 2
	}
})()

答：输出的是 undefined 和 2
原因是变量声明和函数声明会被提升到函数顶部，变量只有声明没有值，因此在打印时它已经存在了，所以打印出undefined

4、this在JavaScript中如何工作的

下面代码会输出什么结果

	var fullname = 'John Doe';
    var obj = {
       fullname: 'Colin Ihrig',
       prop: {
          fullname: 'Aurelio De Rosa',
          getFullname: function() {
             return this.fullname;
          }
       }
};
console.log(obj.prop.getFullname());
var test = obj.prop.getFullname;
console.log(test())

答：输出的是 Aurelio De Rosa 和 John Doe
原因是:在一个函数中，this的取值是看JavaScript调用方式的和定义方式，而不仅仅是定义方式。
在第一个console.log()中，getFullname()作为obj.prop的被调用对象,所以上下文指向后者，函数返回该对象的fullname,与此相反，getFullname被分配到test(),上下文指的是全局对象（window），只是因为test是被隐式设置的全局对象的属性，出于这个原因，该函数返回window的fullname

5、call()和apply()

现在让你解决前一个问题，使最后的console.log() 打印 Aurelio De Rosa。
回答：
    call()和apply()强制改变上下文的的this指向

1	console.log(test.call(obj.prop))和console.log(test.apply(obj.prop))

二、jQuery面试问题

1、jQuery库中$()是什么

$()是jQuery()的别称，乍一看比较怪异，还使jQuery代码羞涩难懂，但是等你适应了，就会爱上它的简单了。$()函数是把任何对象包裹成jQuery对象，接着你就会被允许调用jQuery里的定义的多个不同方法。你甚至传入选择器字符串与$()函数，它会返回包含所有匹配DOM元素数组的jQuery对象。

2、$(doument).ready()是什么函数，为什么要用它

ready()函数用于文档进入ready状态的时执行的代码，当DOM完全加载(例如：HTML元素加载完成时DOM树构建完成时)，jQuery允许你的代码执行。使用$(document).ready()的最大好处是解决了跨浏览器的难题。

3、JavaScript window.onload和jQuery ready()函数的区别

JavaScript window.onload事件和jQuery ready 函数的主要区别是
前者是要等到DOM被创建和图片、音频、视频加载完成以及外部资源加载完成，如果图片加载和媒体加载话费了大量的时间，用户就会感到定义在JavaScript window.onload 的上的代码在执行是有明显迟到。
jQuery ready()函数只需对DOM树加载等待，无需对图片或媒体加载等待，执行起来更快。使用jQuery ready()函数的另一个优势是可以在页面中多次使用它，浏览器会按在HTML里的顺序来执行它，相对于onload来说，只在单一的函数中执行。鉴于这个好处，jQuery ready函数比JavaScript window.onload好用。

4、$(this)和this在jQuery中的不同

$(this)返回的是jQuery对象，可以对它调用jQuery多个方法，例如text()获取文本，val()获取值等。this是JavaScript中的关键字，表示上下文的DOM元素。不能直接调用jQuery方法，需要$()包裹来执行。