前端考核总结2

代码问题

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

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

• 输出结果：[1,NaN,NaN,NaN,];
• parseInt()它有两个参数，参数一是传入的字符串，参数二是要解析数字的基数。如果基数为0或者不写，默认是以十进制解析。同时基数的范围在2~36之间，小于2，大于36则会解析为NaN。还有字符串表示的数字不能大于基数。
• item:“1”,index:0 //上面提到的参数二是0时，默认解析为十进制 所以为1
• item:‘2’,index：1 // 2大于1 所以为NaN
• item：‘3’，index:2 //3大于2 所以为NaN

理论问题

• 通过JavaScript使网页后退的代码是history.back();
• 获取焦点的事件是onfocus,失去焦点的事件是onblur
• opacity设置为0表示消失
• shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。
• unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。

闭包

闭包是什么

• 当函数a的内部函数b被函数a外的一个变量引用的时候，就创建了一个闭包
• 让我们说的更透彻一些。所谓“闭包”，就是在构造函数体内定义另外的函数作为目标对象的方法函数，而这个对象的方法函数反过来引用外层函数体中的临时变量。这使得只要目标 对象在生存期内始终能保持其方法，就能间接保持原构造函数体当时用到的临时变量值。尽管最开始的构造函数调用已经结束，临时变量的名称也都消失了，但在目 标对象的方法内却始终能引用到该变量的值，而且该值只能通这种方法来访问。即使再次调用相同的构造函数，但只会生成新对象和方法，新的临时变量只是对应新 的值，和上次那次调用的是各自独立的。

闭包的作用

• 简而言之：闭包的作用就是在a执行完并返回后，闭包使得Javascript的垃圾回收机制GC不会收回a所占用的资源，因为a的内部函数b的执行需要依赖a中的变量。这是对闭包作用的非常直白的描述，不专业也不严谨，但大概意思就是这样，理解闭包需要循序渐进的过程。 在上面的例子中，由于闭包的存在使得函数a返回后，a中的i始终存在，这样每次执行c()，i都是自加1后alert出i的值。
  那 么我们来想象另一种情况，如果a返回的不是函数b，情况就完全不同了。因为a执行完后，b没有被返回给a的外界，只是被a所引用，而此时a也只会被b引 用，因此函数a和b互相引用但又不被外界打扰(被外界引用)，函数a和b就会被GC回收。

闭包的应用场景

• 保护函数内的变量安全。以最开始的例子为例，函数a中i只有函数b才能访问，而无法通过其他途径访问到，因此保护了i的安全性。 在内存中维持一个变量。依然如前例，由于闭包，函数a中i的一直存在于内存中，因此每次执行c()，都会给i自加1。 通过保护变量的安全实现JS私有属性和私有方法（不能被外部访问） 私有属性和方法在Constructor外是无法被访问的。

JavaScript中的垃圾回收机制

• 在Javascript中，如果一个对象不再被引用，那么这个对象就会被GC回收。如果两个对象互相引用，而不再被第3者所引用，那么这两个互相引用的对象也会被回收。因为函数a被b引用，b又被a外的c引用，这就是为什么函数a执行后不会被回收的原因。

function a() {
 var i = 0; 
 function b() {
  alert(++i);
   };
    return b;
}; 
   var c = a(); 
   c();

use strict–严格模式

• 它不是一条语句，但是是一个字面量表达式，在 JavaScript 旧版本中会被忽略。
• “use strict” 的目的是指定代码在严格条件下执行。
• 严格模式下你不能使用未声明的变量。
• “use strict” 指令只允许出现在script或函数的开头。若写在函数里面，则只会对函数里面起限制

为什么要使用严格模式

• 消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为;
  消除代码运行的一些不安全之处，保证代码运行的安全；
• 提高编译器效率，增加运行速度；
• 为未来新版本的Javascript做好铺垫。
• "严格模式"体现了Javascript更合理、更安全、更严谨的发展方向，包括IE 10在内的主流浏览器，都已经支持它，许多大项目已经开始全面拥抱它。
• 另一方面，同样的代码，在"严格模式"中，可能会有不一样的运行结果；一些在"正常模式"下可以运行的语句，在"严格模式"下将不能运行。掌握这些内容，有助于更细致深入地理解Javascript，让你变成一个更好的程序员。

深浅拷贝

• 浅拷贝只复制指向某个对象的指针而不复制对象本身，新旧对象还是共享同一块内存。
• 深拷贝会另外创造一个一模一样的对象，新对象跟原对象不共享内存，修改新对象不会改到原对象。
• 深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型
  的。
  

js中的then（）是什么意思

• then()方法是异步执行。
• 就是当.then()前的方法执行完后再执行then()内部的程序，这样就避免了，数据没获取到等的问题。
• 语法：promise.then(onCompleted, onRejected);
  参数
• promise必需。Promise 对象。
• onCompleted必需。承诺成功完成时要运行的履行处理程序函数。
• onRejected可选。承诺被拒绝时要运行的错误处理程序函数

jquery和DOM对象是怎样转换的

什么是DOM对象

• 使用JavaScript中的方法获取页面中的元素返回的对象就是dom对象。比如使用document.getElement*系列的方法返回的就是dom对象。

什么是jQuery对象

• jquery对象就是使用jquery的方法获取页面中的元素返回的对象就是jQuery对象。比如使用$()方法返回对象都是jquery对象。

jQuery对象和DOM对象的相互转换

1. jQuery --> DOM

• jQuery提供了两种方法：[index]和get(index)
• jQuery对象是一个类似数组的对象，可以通过[index]方法得到相应的DOM对象

1.var $students = $("#students");//jQuery对象
var student = $students[0];//DOM对象
2.另一种方法是jQuery本身提供的，通过get(index)方法得到相应的DOM对象
var student = $students.get(0);

2. DOM --> jQuery

• 只需用$()把DOM对象包起来即可

var student = document.getElementById("student");//DOM对象
var $student = $(student);//jQuery对象

函数节流和函数防抖

概念

• 节流函数：让一个函数无法在短时间内连续调用，只有当上一次函数执行后，过了规定的时间间隔，才能进行下一次该函数的调用。
• 函数防抖：频繁触发的情况下，只有足够的空闲时间，才执行代码一次。（比如生活中的坐公交，就是一定时间内，如果有人陆续刷卡上车，司机就不会开车。只有别人没刷卡了，司机才开车。）
• 函数节流和函数防抖，两者都是优化高频率执行js代码的一种手段。

应用场景

• 懒加载、滚动加载、加载更多或监听滚动条位置；
• 百度搜索框，搜索联想功能；
• 防止高频点击提交，防止表单重复提交；

原理

• 主要实现思路就是通过 setTimeout 定时器，通过设置延时时间，在第一次调用时，创建定时器，先设定一个变量true，写入需要执行的函数。第二次执行这个函数时，会判断变量是否true，是则返回。当第一次的定时器执行完函数最后会设定变量为false。那么下次判断变量时则为false，函数会依次运行。目的在于在一定的时间内，保证多次函数的请求只执行最后一次调用。

同步和异步的区别

同步

• 概念：所有的操作都做完，才返回给用户。这样用户在线等待的时间太长，给用户一种卡死了的感觉（就是系统迁移中，点击了迁移，界面就不动了，但是程序还在执行，卡死了的感觉）。这种情况下，用户不能关闭界面，如果关闭了，即迁移程序就中断了。
• 优点：同步是按照顺序一个一个来，不会乱掉，更不会出现上面代码没有执行完就执行下面的代码
• 缺点：是解析的速度没有异步的快，客户体验不友好；

异步

• 概念：将用户请求放入消息队列，并反馈给用户，系统迁移程序已经启动，你可以关闭浏览器了。然后程序再慢慢地去写入数据库去。这就是异步。但是用户没有卡死的感觉，会告诉你，你的请求系统已经响应了。你可以关闭界面了。
• 优点：异步是接取一个任务，直接给后台，在接下一个任务，一直一直这样，谁的先读取完先执行谁的， 客户端可以做其他的事情，这样节约了时间，提高了效率。
• 缺点：没有顺序 ，谁先读取完先执行谁的 ，会出现上面的代码还没出来下面的就已经出来了，会报错；
• 异步虽然效率更高，但是我们有时候是需要拿到返回的数据在进行操作的，这些是异步所无法解决的。

map和forEach的区别

相同点

• 都是循环遍历数组中的每一项
• forEach和map方法里每次执行匿名函数都支持3个参数，参数分别是item（当前每一项）、index（索引值）、arr（原数组）
• 匿名函数中的this都是指向window
• 只能遍历数组

不同点

1.forEach()

• 没有返回值。

2.map()

• 有返回值，可以return 出来。

for…in和for…of的区别

• for…in…遍历数组，对象的键值（下标）

let arr = [1, 2, 3];
for (let i in arr) {
	console.log(i)
}
let obj = {
	name: 'wuxiaodi',
	age: 18,
};
for (let i in obj) {
	console.log(i);0,1,2,name,age
}

• 如果想要遍历到对象的值，改成下列

let arr = [1, 2, 3];
for (let i in arr) {
	console.log(arr[i])
}
let obj = {
	name: 'wuxiaodi',
	age: 18,
};
for (let i in obj) {
	console.log(obj[i]);1,2,3,'wuxiaodi',18
}

• for…of…遍历数组的值,不能遍历对象

let arr = [1, 2, 3];
for (let i of arr) {
	console.log(i);1,2,3
}