JS&jQuery测验总结

知识总结

Q1.jQuery用的是什么库？

ans：使用的是JavaScript库。
解释：jquery库是指一种封装好的JavaScript函数库,一个轻量级的"写的少,做的多"的JavaScript库,jquery封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档操作。

Q2.在JS中， 3+2+"7"的结果是？

ans：结果是 57。
解释：，运算顺序从左到右，3与2为Number，会先进行数字运算得到5，之后因为7为String类型，所以5会自动转化为String类型，与7拼串，得到String类型的"57"。

Q3.有如下语句，求输出结果分别为多少。

console.log([] == false);
console.log(![] ==false); 

ans：输出结果为 true、true。
解释：首先我们要直到如下规则：
①当任意值与布尔值进行比较时，等式两边会自动转化为Number类型，再进行比较。（对象与其他值比较时，对象会先隐式转换为String类型，再转换为规定的类型，而空对象对应的是空串，这是空对象的Number值为0的本质原因！！！）
②当一个非布尔值取反时，会先将其转化为布尔值，再取反。

  基于这个两个规则，且数组本质为对象。我们不难判断，因为空数组的Number值为0，所以1式输出为true;因为其布尔值为true，取反后得false，所以2式输出也为true。

var a=[];
console.log(Boolean(a));   //输出true   
console.log(Number(a));	   //输出0      

简单来说，当空数组作为Number值时，为0；作为布尔值时，为true。（如下条件能看懂说明基本上理解了）

if([]==![])      //此情况判断条件为真。

《这里是我看到的一篇有关不同类型值比较规则的文章》

Q4.还是求以下语句分别输出什么。

let arr = [1,2,3,4];
arr = arr.map(parseInt);
console.log(arr);

ans：1, NaN, NaN, NaN
解释：首先要说一下map()方法的功能。map()方法类似与forEach()方法，这两个方法都用于遍历数组。区别在于后者遍历谁就返回谁，而前者可以自定义返回值，从而处理数组，更加灵活。
其次是parseInt(string, radix)方法，parseInt()会获取字符串最开始的数字部分并返回。其参数1为目标字符串，如果参数不是字符串，则会先将其转化；参数2为要解析的数字的基数。此基数介于 2 ~ 36 之间。如果省略该参数或其值为 0，则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头，将以 16 为基数。如果该参数小于 2 或者大于 36，则parseInt()将返回 NaN。此为此题的重点。
（PS：let与var功能一样，不同的是，前者是块作用域，后者是函数作用域。）
此外，对于题目中的代码，可以如下理解会更好：

['1', '2', '3','4'].map(parseInt);

//更好的理解
['1', '2', '3','4'].map((item,index)=>{
  return parseInt(item,index);  
});

当index为0，按十进制取数字，1可取；
当index为1，radix不在基数范围内，则返回NaN；
当index为2，按二进制取数字，但取的数字为3，不在二进制范围内，返回NaN；
当index为3，同index为2的情况，返回NaN。
因此，我们推理不难得出答案。这里有非常好的文章细讲了原理↓
《好文》

Q5.通过JS使页面后退的代码是什么？

ans：history.back()。
解释：history是BOM中的对象之一，代表浏览器的历史记录，可以通过该对象来操作浏览器的历史记录。而其中的back()方法就是用来让网页回退到上一个页面的。

Q6.在Js中，Data对象的哪个方法可以返回一个月中的每一天？

ans：getDate()可返回当前日子（1~31）。

Q7.所有引用类型的_protp_属性值指向它构造函数的什么属性值？

ans:prototype属性值。
解释：此属性体现了JS的继承性。
关于_proto_与prototype，切记prototype是函数才有的属性。而_proto_可以理解为构造器原型，是每个对象固有的属性。
具体区别我的理解还不足够，这里有相应文章推荐👇
《相应文章》

Q8.获取焦点与失去焦点的事件是？

ans：focus()与blur()。

Q9.怎么才能隐藏下面的元素？

<input id="id_txt" name="txt" type="text" value=""/>
A. $("id_txt").hide();
B. $(#id_txt).remove();
C. $("#id_txt").hide();
D. $("#id_txt").remove();

ans：选C。
解释：如果想要获取dom元素，则需给jQuery的核心函数中传入一个字符串作为选择器，这里用的是id选择器。隐藏元素用的是hide方法。

Q10.在jQuery中被誉为工厂函数的是？

ans：$() —— 这是jQ的核心函数。

Q11.JS有哪几种数据类型？

ans：
String    字符串
Number   数值 （Infinity、NaN也是number）
Boolean   布尔
Null     空
Undefined  未定义
Object   对象 （引用数据类型,有时String也算作）

Q12. == 与 === 的区别是什么？

ans：区别在于，==只比较值，而 ===不仅比较值，还比较类型，所以称作全等比较。

Q13.谈一谈深浅拷贝的区别。

ans：
浅拷贝：相当于将此节点的html内容复制直接完全复制了一份
深拷贝：除了浅拷贝之外，与复制的节点相关的事件等等全部都会复制生效。

Q14.谈谈对this的理解。

ans：
当函数直接调用的时候，this为调用这个函数的对象；
当函数作为方法调用时，this指向包含这个方法的对象（最近的）；
当this的同级中有返回值，若返回值是一个对象，this指向返回对象，若不是，则还是指向这个函数的实例；
当使用了apply方法，则this指向这个方法指定的对象。

Q15.什么是闭包，为什么要用它？

ans：即通过函数嵌套函数，内部函数引用局部变量实现变量不释放。广泛来讲，所有函数访问另一个函数内部变量的过程都可以称之为闭包
解释：
优点：局部变量不释放
缺点：内存泄漏、内存占用
闭包的实现基于以下三点：
①函数可以创建独立作用域（因此闭包的实现依赖于函数）；
②自由变量跨作用域取值，要去创建该函数的作用域中取值；
③变量被函数引用时不会被释放；
为什么要用它：
就是为了防止变量污染，但是用多了会内存泄漏
引自：《什么是闭包》

Q16.解释一下数组方法pop() push() unshift() shift()？

ans：
pop()：删除数组末尾元素。
push()：向数组末尾添加元素。
unshift()：删除数组首元素。
shift()：向数组添加头元素。

Q17.JS代码中的“use strict”是什么意思？

ans：use strict是一种ECMAscript 5 添加的（严格）运行模式,这种模式使得 Javascript 在更严格的条件下运行,使JS编码更加规范化的模式,消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为。
解释：例如this的指向问题等都会进行归正。

Q18.JS中then()的作用是什么？

ans： then()方法是异步执行。
解释：就是当.then()前的方法执行完后再执行then()内部的程序，这样就避免了，数据没获取到等的问题。

语法：promise.then(onCompleted, onRejected);

参数

onCompleted必需，承诺成功完成时要运行的履行处理程序函数。

onRejected可选，承诺被拒绝时要运行的错误处理程序函数。

引自：《js中then()的用法》

Q19.什么是函数节流？介绍一下应用场景与原理

ans：函数节流(throttle)，顾名思义就是节约流量、内存损耗，优化性能。
解释：在遇到像onmousemove，onscroll这种会被频繁触发的事件时，与高频的dom操作时，会大量地消耗性能。而为了优化性能则用了函数节流。简单地讲，就是让一个函数无法在很短的时间间隔内连续调用，只有当上一次函数执行后过了你规定的时间间隔，才能进行下一次该函数的调用（或者说时在一定时间内只执行一次）。原理相当于给操作增加了定时器。

Q20. .new操作符具体干了什么？

ans：
1、创建一个空对象
2、此空对象的__proto__指向构造的prototype
3、借调构造将this指向这个对象并添加属性及方法
4、返回这个对象

Q21.同步和异步的区别？

ans：
同步：就是后一个任务等待前一个任务结束，然后再执行，程序的执行顺序与任务的排列顺序是一致的、同步的。
异步：每一个任务有一个或多个回调函数（callback），前一个任务结束后，不是执行后一个任务，而是执行回调函数，后一个任务则是不等前一个任务结束就执行，所以程序的执行顺序与任务的排列顺序是不一致的、异步的。

Q22. map和forEach方法的区别？

ans：两者都是遍历数组的函数。区别在于后者不会改变原数组，而前者会对每个数组元素执行函数来建立新数组。
解释：所以用map()来自定义数组会非常方便。
eg：

var arr1 = [45, 4, 9, 16, 25];
var arr2 = arr1.map(myFunction);

function myFunction(value, index, array) {
  return value * 2;  //新数组：[90,8,18,32,50]
}

Q23.for…in 和 for…of的区别？

ans：
for…in 循环：只能获得对象的键名，不能获得键值。
for…of 循环：允许遍历获得键值。
解释：不是非常明白，这里引文：《for…in 和 for…of的区别》

Q24.解释JS中定时器的工作？如果有，也可以说明使用定时器的缺点？（写出有关定时器的函数）

ans：函数：
setTimeout(function，delay)函数用于启动在所述延迟之后调用特定功能的定时器。
setInterval(function，delay)函数用于在提到的延迟中重复执行给定的功能，只有在取消时才停止。
clearInterval(id)函数指示定时器停止。
解释：缺点：因为定时器的存在，某些效果可能要排队执行。并且如果忘记关闭定时器，可能导致预想效果出现偏差。

Q25.如何在点击一个按钮时使用jQuery隐藏一个图片？

ans：eg:

<script>
	$(function(){
		var $img = $(".img");
    	var $btn = $(".btn");

       	$($btn).click(function(){
        	$img.hide();
        })
    });
</script>
<body>
	<img src="img/csslogo.jpg" alt="" class="img">
    <button class="btn">123</button>
</body>

Q26.window.onload()函数和jQuery中的document.ready()有什么区别？

ans：
window.onload()：会等待所有页面元素加载完毕才执行，且只能有一个此函数，后写的会覆盖先写的。
document.ready()：dom元素加载完毕后就立即执行，但可以有很多个，都执行。