h5/web前端面试题

不念不忘少年蓝@ 2022-07-12 02:08 210阅读 0赞

1.js中apply和call的作用和区别是什么？  
①主要作用其实就是改变了函数运行时的上下文，简单来讲就是改变所调用函数this的指向，第一个参数是什么对象，此时this就指向这个对象。当一个object没有某个方法，但是其他的有，我们可以借助call或apply用其它对象的方法来操作。  
②二者区别仅仅是第二个参数不同，call需要按照顺序一个一个写入，而apply是数组形式，也可以通过 arguments 这个数组来便利所有的参数  
2.js中作用于链的理解？  
①所谓函数作用域就是说：-》变量在声明它们的函数体以及这个函数体嵌套的任意函数体内都是有定义的。每个Javascript执行环境都有一个与它关联在一起的作用域链。”这是犀牛书上的表述，把它翻译成大白话就是：作用域的优先级顺序  
简单来说：根据函数执行的当前上下文进行查找变量，如果在当前函数中找到，则使用它，找不到向父级函数一层层的去查找，直到找到为止，如 child->parent->windows 当前执行的函数总在链的头部  
②改变作用域链可以使用with语句，但一般情况下尽量不去使用它

引用一段摘过来的内容，感觉比较适合理解  
在js中对象的外在表现形式为函数。  
第一步. 定义后：每个已定义函数，都有一个内在属性\[scope\]，其对应一个对象的列表，列表中的对象仅能内部访问。  
例如：建立一个全局函数A，那么A的\[Scope\]内部属性中只包含一个全局对象(Global Object)，而如果我们在A中创建一个新的函数B，那么B的\[Scope\]属性中就包含两个对象，函数A的Activation Object对象在前面，全局对象(Global Object)排在后面。  
简而言之，一个函数的\[Scope\]属性中对象列表的顺序是上一层函数的Activation Object对象，然后是上上层的，一直到最外层的全局对象。

第二步.执行时：当一个函数被执行的时候，会自动创建一个可以执行的对象(Execution Object)，并同时绑定一个作用域链(Scope Chain)。作用域链会通过下面两个步骤来建立，用于进行标识符解析。  
首先，将函数对象\[Scope\]内部属性中的对象，按顺序复制到作用域链Scope Chain中。  
其次，在函数执行时，会创建一个新的Activation Object对象，这个对象中包含了this、参数(arguments)、局部变量(包括命名的参数)的定义，这个Activation Object对象会被置于作用域链的最前面。  
所以在Scope Chain中最后顺序是本函数的Activation Object，然后是上层函数的Activation Object，再上上层的Activation Object，一直到Global Object。  
当执行js代码的过程中，遇到一个标识符，就会根据标识符的名称，在执行上下文(Execution Context)的作用域链中进行搜索。从作用域链的第一个对象（该函数的Activation Object对象）开始，如果没有找到，就搜索作用域链中的下一个对象，如此往复，直到找到了标识符的定义。如果在搜索完作用域中的最后一个对象，也就是全局对象(Global Object)以后也没有找到，则会抛出一个错误，提示undefined。  
3.什么是闭包？闭包的作用是什么？  
我的理解是，闭包就是能够读取其他函数内部变量的函数。  
①闭包是很多语言都具备的特性,在js中,闭包主要涉及到js的几个其他的特性:作用域链,垃圾(内存)回收机制,函数嵌套,等等.  
从定义上来看，所有的函数都可以是闭包  
②函数的嵌套，函数A return 函数B 赋值给C使用  
③可以在外部使用一个函数的局部变量就可以使用闭包  
用途：一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。  
4.原型的理解？  
javascript中的每个类都有prototype对象，新构建的对象都可以使用其prototype中的属性和方法，每一个对象中都包含了**proto**属性，这个属性指向了  
自身构造函数中的prototype，所以当我们在调用对象中的方法时，首先在对象本身进行查找，如果没有，就在它的prototype查找  
简单说：  
prototype就是“一个给类的对象添加属性和方法的方法”，使用prototype属性，可以给类动态地添加方法，以便在JavaScript中实现“ 继承”的效果。  
另外还有一点，如果是类中直接添加的一个对象属性，那么在它的所有实例中都是区分开的存储在不同的内存中，但如果是prototype中的对象属性话，他们是共用  
一片内存的，一个实例中修改了它，在另外一个实例也能看到修改的

\[javascript\] view plain copy print?  
function test()\{  
this.show=function()\{  
console.log(‘test’);  
\}  
\}

test.prototype.a=\{x:1\};  
var t1=new test();  
t1.a.x=’t1’;  
console.log(t1.a);  
var t2=new test();  
console.log(t2.a);

5.js继承的几种方式？  
js原型（prototype）实现继承  
构造函数实现继承 A a=new B()  
call , apply实现继承  
6.ajax如何实现？  
7.jsonp的作用？  
JSONP的最基本的原理是：动态添加一个标签，而script标签的src属性是没有跨域的限制的。这样说来，这种跨域方式其实与ajax XmlHttpRequest协议无关了。

利用在页面中创建节点的方法向不同域提交HTTP请求的方法称为JSONP，这项技术可以解决跨域提交Ajax请求的问题  
JSONP的优点是：它不像XMLHttpRequest对象实现的Ajax请求那样受到同源策略的限制；它的兼容性更好，在更加古老的浏览器中都可以运行，不需要XMLHttpRequest或ActiveX的支持；并且在请求完毕后可以通过调用callback的方式回传结果。  
JSONP的缺点则是：它只支持GET请求而不支持POST等其它类型的HTTP请求；它只支持跨域HTTP请求这种情况，不能解决不同域的两个页面之间如何进行JavaScript调用的问题。

最简单的实现：

function test()\{  
this.show=function()\{  
console.log(‘test’);  
\}  
\}

test.prototype.a=\{x:1\};  
var t1=new test();  
t1.a.x=’t1’;  
console.log(t1.a);  
var t2=new test();  
console.log(t2.a);

5.js继承的几种方式？  
js原型（prototype）实现继承  
构造函数实现继承 A a=new B()  
call , apply实现继承  
6.ajax如何实现？  
7.jsonp的作用？  
JSONP的最基本的原理是：动态添加一个