2023年常见的Js基础面试题，大家可进行参考

一、请解释 JavaScript 中 this 是如何工作的。

首先：this 永远指向函数运行时所在的对象，而不是函数被创建时所在的对象。匿名函数或不处于任何对象中的函数指向 window 。

1、 方法调用模式

当函数被保存为对象的一个属性时，成该函数为该对象的方法。函数中this的值为该对象。

var foo = {
    name: 'fooname',
    getName: function (){
        return this.name  
    }
}
foo.getName();  // this => foo

2、 函数调用模式

当函数并不是对象的属性。函数中this的值为全局对象

note：某个方法中的内部函数中的this的值也是全局对象，而非外部函数的this

function foo(){
    this.name = 'fooname';  
}
foo();  // this => window

3、构造器调用模式

即使用new调用的函数，则其中this将会被绑定到那个新构造的对象。

function Foo(){
    this.name = 'fooname';
}
var foo = new Foo();  // this => foo

4、使用apply或call调用模式

该模式调用时，函数中this被绑定到apply或call方法调用时接受的第一个参数

function getName(name){
    this.name = name;
}
var foo = {};
getName.call(foo, name);  // this =>foo

改变this的值主要方法(目前想到的，欢迎评论添加)：

apply或call方法调用时强制修改，使this指向第一个参数。

使用Function.bind方法创造新的函数，该新函数的中this指向所提供的第一个参数。

二、请解释原型继承 (prototypal inheritance) 的原理。

JavaScript没有“子类”和“父类”的概念，也没有“类”(class)和“实例”(instance)的区分，全靠“原型链”(prototype chain)模式，来实现继承。

每个函数Sub都有一个属性prototype，prototype指向一个原型对象，原型对象中也有一个指向函数的属性constructor，通过new一个函数Sub可以产生实例instance，调用这个instance的某个属性或方法时，instance会先查找自身是否有这个方法或者属性，没有的话就会去实例的构造函数Sub的原型prototype中查找，即Sub.prototype，如果给原型对象Sub.prototype赋予另一个类型的实例superInstance，则是在superInstance中查找的，这个superInstance中也有属性prototype指向某个原型对象，以此一级级往上最终到Object.prototype，这样就形成了原型继承。

利用此原理可以自己实现一个inherits函数：

function inherits(subType, superType){
    var _prototype = Object.create(superType.prototype);
    _prototype.constructor = subType;
    subType.prototype = _prototype;
}

三、请描述事件冒泡机制 (event bubbling)。

事件冒泡(event bubbling)，事件最开始时由触发的那个元素身上发生，然后沿着DOM树向上传播，直到document对象。如果想阻止事件起泡，可以使用e.stopPropagation()。

四、什么是 “use strict”; ? 使用它的好处和坏处分别是什么?

优点

消除Javascript语法的一些不严谨之处，减少一些怪异行为;

消除代码运行的一些不安全之处，保证代码运行的安全;

提高编译器效率，增加运行速度;

为未来新版本的Javascript做好铺垫。

缺点

严格模式改变了语义。依赖这些改变可能会导致没有实现严格模式的浏览器中出现问题或者错误。

五、请解释 JavaScript 的同源策略 (same-origin policy)。

同源策略限制了一个源(origin)中加载文本或脚本与来自其它源(origin)中资源的交互方式。同源指的是协议、域名、端口相同，同源策略是一种安全协议。

六、请解释 JSONP 的工作原理，以及它为什么不是真正的 Ajax。

JSONP(JSON with Padding)是一种非官方跨域数据交互协议，它允许在服务器端集成< script >标签返回至客户端，通过javascript回调的形式实现跨域访问。

因为同源策略的原因，我们不能使用XMLHttpRequest与外部服务器进行通信，但是< script >可以访问外部资源，所以通过JSON与< script >相结合的办法，可以绕过同源策略从外部服务器直接取得可执行的JavaScript函数。

原理

客户端定义一个函数，比如jsonpCallback，然后创建< script >，src为url + ?jsonp=jsonpCallback这样的形式，之后服务器会生成一个和传递过来jsonpCallback一样名字的参数，并把需要传递的数据当做参数传入，比如jsonpCallback(json)，然后返回给客户端，此时客户端就执行了这个服务器端返回的jsonpCallback(json)回调。

通俗的说，就是客户端定义一个函数然后请求，服务器端返回的javascript内容就是调用这个函数，需要的数据都当做参数传入这个函数了。

优点 - 兼容性好，简单易用，支持浏览器与服务器双向通信

缺点 - 只支持GET请求;存在脚本注入以及跨站请求伪造等安全问题

补充一点，JSONP不使用XMLHttpRequest对象加载资源，不属于真正意义上的AJAX。

以上就是“2023年常见的Js基础面试题，大家可进行参考”，你能回答上来吗?如果想要了解更多的Java面试题相关内容，可以关注星辉Java官网。