前端面试准备-------JavaScript（二）

最新推荐文章于 2022-04-02 11:50:21 发布

fj1247565817

最新推荐文章于 2022-04-02 11:50:21 发布

阅读量183

点赞数

分类专栏：问题面试代码文章标签：前端面试js

本文链接：https://blog.csdn.net/fj1247565817/article/details/99708963

版权

问题同时被 3 个专栏收录

11 篇文章 0 订阅

订阅专栏

代码

10 篇文章 0 订阅

订阅专栏

面试

8 篇文章 0 订阅

订阅专栏

~~本文是根据知乎~~ 爱前端不爱恋爱~~提供的目录整理供大家学习，后将持续更新~~
11、this关键字
12、函数式编程
13、手动实现parseInt
14、为什么会有同源策略
15、怎么判断两个对象是否相等
16、事件模型
事件委托、代理
如何让事件先冒泡后捕获
17、window的onload事件和domcontentloaded
18、for…in迭代和for…of有什么区别
19、函数柯里化
20、call apply区别，原生实现bind
call，apply，bind 三者用法和区别：角度可为参数、绑定规则（显示绑定和强绑定），运行效率、运行情况。

十一、this关键字

this对象是在运行时基于函数的执行环境绑定的：在全局函数中，this等于window，而当函数被作为某个对象的方法调用时，this等于那个对象。不过，匿名函数的执行环境具有全局性，因此其this对象通常指向window 。但有时候由于编写闭包的方式不同，这一点可能不会那么明显。

var name = "The Window";
var object = {
	name: "My Object",
	getNameA () {
		return this.name;
	},
	getNameB () {
		return function () {
			return this.name;
		}
	},
	getNameC () {
		var that = this;
		return function () {
			return that.name;
		}
	}
}
console.log(object.getNameA());//”My Object ” 
console.log(object.getNameB()());//”The Window ” 
console.log(object.getNameC()());//”My Object ”

理解js中的this

十二、函数式编程

简单说，“函数式编程"是一种"编程范式”（programming paradigm），也就是如何编写程序的方法论。它属于"结构化编程"的一种，主要思想是把运算过程尽量写成一系列嵌套的函数调用。
特性：

闭包和高阶函数。
惰性计算。
递归。
函数是"第一等公民"。
只用"表达式"，不用"语句"。
没有"副作用"。
不修改状态。
引用透明性。
副作用是修改系统状态的语言结构。

优点：

代码简洁，开发快速
接近自然语言，易于理解
更方便的代码管理
易于"并发编程"
代码的热升级

百度百科====函数式编程
 javascript函数式编程（一）

十三、手动实现parseInt

parseInt() 函数可解析一个字符串，并返回一个整数。
语法：parseInt(string, radix)
实例：

parseInt("10");			//返回 10
parseInt("19",10);		//返回 19 (10+9)
parseInt("11",2);		//返回 3 (2+1)
parseInt("17",8);		//返回 15 (8+7)
parseInt("1f",16);		//返回 31 (16+15)
parseInt("010");		//未定：返回 10 或 8

JS实现手写parseInt的方法示例

十四、为什么会有同源策略

同源策略，它是由Netscape提出的一个著名的安全策略。
现在所有支持JavaScript 的浏览器都会使用这个策略。
所谓同源是指，域名，协议，端口相同。

当一个浏览器的两个tab页中分别打开百度和谷歌的页面，当浏览器的百度tab页执行一个脚本的时候会检查这个脚本是属于哪个页面的，即检查是否同源，只有和百度同源的脚本才会被执行。如果非同源，那么在请求数据时，浏览器会在控制台中报一个异常，提示拒绝访问。

同源策略是浏览器的行为，是为了保护本地数据不被JavaScript代码获取回来的数据污染，因此拦截的是客户端发出的请求回来的数据接收，即请求发送了，服务器响应了，但是无法被浏览器接收。

十五、怎么判断两个对象是否相等

JavaScript专题之如何判断两个对象相等
 ES6中的Object.is()判断对象是否相等

十六、事件模型

事件模型
事件委托（代理）利用了事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。
如何让事件先冒泡后捕获
根据w3c标准，应先捕获再冒泡。若要实现先冒泡后捕获，给一个元素绑定两个addEventListener，其中一个第三个参数设置为false（即冒泡），另一个第三个参数设置为true（即捕获），调整它们的代码顺序，将设置为false的监听事件放在设置为true的监听事件前面即可。
DOM事件阶段以及事件捕获与事件冒泡先后执行顺序

十七、Window的onload事件和domcontentloaded

onload 事件会在页面或图像加载完成后立即发生。
DOMContentLoaded 事件触发时，仅当DOM加载完成，不包括样式表，图片，flash。

window.onload和DOMContentLoaded的区别
 window.onload 和 DOMContentLoaded 的区别

十八、for…in迭代和for…of有什么区别

转自MDN：for…in迭代和for…of有什么区别
无论是for...in还是for...of语句都是迭代一些东西。它们之间的主要区别在于它们的迭代方式。

for...in 语句以原始插入顺序迭代对象的可枚举属性。

for...of 语句遍历可迭代对象定义要迭代的数据。
以下示例显示了与Array一起使用时，for…of循环和for…in循环之间的区别。

Object.prototype.objCustom = function() {}; 
Array.prototype.arrCustom = function() {};

let iterable = [3, 5, 7];
iterable.foo = 'hello';

for (let i in iterable) {
  console.log(i); // logs 0, 1, 2, "foo", "arrCustom", "objCustom"
}

for (let i in iterable) {
  if (iterable.hasOwnProperty(i)) {
    console.log(i); // logs 0, 1, 2, "foo"
  }
}

for (let i of iterable) {
  console.log(i); // logs 3, 5, 7
}

十九、函数柯里化

柯里化（Currying）是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数，并且返回接受余下的参数且返回结果的新函数的技术。这个技术由 Christopher Strachey 以逻辑学家 Haskell Curry 命名的，尽管它是 Moses Schnfinkel 和 Gottlob Frege 发明的。

// 普通的add函数
function add(x, y) {
    return x + y
}

// Currying后
function curryingAdd(x) {
    return function (y) {
        return x + y
    }
}

add(1, 2)           // 3
curryingAdd(1)(2)   // 3

实际上就是把add函数的x，y两个参数变成了先用一个函数接收x然后返回一个函数去处理y参数。现在思路应该就比较清晰了，就是只传递给函数一部分参数来调用它，让它返回一个函数去处理剩下的参数。

详解JS函数柯里化