前端面试基础面试题——9

 1.js 延迟加载的方式有哪些?

 2.js同步和异步的区别?

3.什么是浏览器的同源政策?

4.介绍一下 js 的节流与防抖?

5.js 中的深浅拷贝实现?

6.Js 动画与 CSS 动画区别及相应实现

7.观察者模式和发布订阅模式有什么不同?

8.js 中的命名规则

9.JavaScript怎么清空数组?

10.微任务和宏任务


1.js 延迟加载的方式有哪些?

一般有以下几种方式:

  • defer 属性
  • async 属性
  • 动态创建 DOM 方式
  • 使用 setTimeout 延迟方法
  • 让 JS 最后加载
 2.js同步和异步的区别?

同步,可以理解为在执行完一个函数或方法之后,一直等待系统返回值或消息,这时程序是处于阻塞的,只有接收到返回的值或消息后才往下执行其他的命令。  

异步,执行完函数或方法后,不必阻塞性地等待返回值或消息,只需要向系统委托一个异步过程,那么当系统接收到返回值或消息时,系统会自动触发委托的异步过程,从而完成一个完整的流程。 

3.什么是浏览器的同源政策?

我对浏览器的同源政策的理解是,一个域下的 js 脚本在未经允许的情况下,不能够访问另一个域的内容。这里的同源的指的是两个
域的协议、域名、端口号必须相同,否则则不属于同一个域。

同源政策主要限制了三个方面

第一个是当前域下的 js 脚本不能够访问其他域下的 cookie、localStorage 和 indexDB。

第二个是当前域下的 js 脚本不能够操作访问操作其他域下的 DOM。

第三个是当前域下 ajax 无法发送跨域请求。

同源政策的目的主要是为了保证用户的信息安全,它只是对 js 脚本的一种限制,并不是对浏览器的限制,对于一般的 img、或者
script 脚本请求都不会有跨域的限制,这是因为这些操作都不会通过响应结果来进行可能出现安全问题的操作。

4.介绍一下 js 的节流与防抖?

函数防抖: 在事件被触发 n 秒后再执行回调,如果在这 n 秒内事件又被触发,则重新计时。

函数节流: 规定一个单位时间,在这个单位时间内,只能有一次触发事件的回调函数执行,如果在同一个单位时间内某事件被触发多次,只有一次能生效。

5.js 中的深浅拷贝实现?

浅拷贝指的是将一个对象的属性值复制到另一个对象,如果有的属性的值为引用类型的话,那么会将这个引用的地址复制给对象,因此两个对象会有同一个引用类型的引用。浅拷贝可以使用  Object.assign 和展开运算符来实现。

深拷贝相对浅拷贝而言,如果遇到属性值为引用类型的时候,它新建一个引用类型并将对应的值复制给它,因此对象获得的一个新的引用类型而不是一个原有类型的引用。深拷贝对于一些对象可以使用 JSON 的两个函数来实现,但是由于 JSON 的对象格式比 js 的对象格式更加严格,所以如果属性值里边出现函数或者 Symbol 类型的值时,会转换失败。

6.Js 动画与 CSS 动画区别及相应实现

 CSS3 的动画的优点

在性能上会稍微好一些,浏览器会对 CSS3 的动画做一些优化
代码相对简单

缺点

在动画控制上不够灵活
兼容性不好

JavaScript 的动画正好弥补了这两个缺点,控制能力很强,可以单帧的控制、变换,同时写得好完全可以兼容 IE6,并且功能强大。对于一些复杂控制的动画,使用 javascript 会比较靠谱。而在实现一些小的交互动效的时候,就多考虑考虑 CSS 吧

7.观察者模式和发布订阅模式有什么不同?

发布订阅模式其实属于广义上的观察者模式

在观察者模式中,观察者需要直接订阅目标事件。在目标发出内容改变的事件后,直接接收事件并作出响应。

而在发布订阅模式中,发布者和订阅者之间多了一个调度中心。调度中心一方面从发布者接收事件,另一方面向订阅者发布事件,订阅者需要在调度中心中订阅事件。通过调度中心实现了发布者和订阅者关系的解耦。使用发布订阅者模式更利于我们代码的可维护性。

8.js 中的命名规则

(1)第一个字符必须是字母、下划线(_)或美元符号($)
(2)余下的字符可以是下划线、美元符号或任何字母或数字字符

一般我们推荐使用驼峰法来对变量名进行命名,因为这样可以与 ECMAScript 内置的函数和对象命名格式保持一致。

9.JavaScript怎么清空数组?

方法1

arrayList = [];

直接改变arrayList所指向的对象,原对象并不改变。

方法2

arrayList.length = 0;

这种方法通过设置length=0 使原数组清除元素。

方法3

arrayList.splice(0, arrayList.length);

10.微任务和宏任务

事件循环是一个宏观的表述,其实异步任务之间并不完全相同,其执行时机有所区别。细分来说的话异步任务分为两种:microtask 与 macrotask

宏任务macrotask 主要有:script(整体代码)、setTimeout、setInterval、I/O、UI交互事件、postMessage、MessageChannel、setImmediate(Node.js 环境)

微任务microtask 主要有:process.nextTick,Promises【new Promise().then(回调)】,MutationObserver(html5 新特性)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/104058.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

GIS小技术分享(一):python中json数据转geojson或者shp

1.环境需求 geopandspandasshapelyjsonpython3 2.输入数据(path字段,线条) [{"id": "586A685D568311B2A16F33FCD5055F7B","name": "普及江","path": "[[116.35178835446628,23.57…

贴片电容材质的区别与电容的主要作用

一、贴片电容材质NPO、COG、X7R、X5R、Y5V、Z5U区别 主要是介质材料不同,不同介质种类由于它的主要极化类型不一样,其对电场变化的响应速度和极化率也不一样。在相同的体积下的容量就不同,随之带来的电容器介质的损耗、容量的稳定性也就不同…

【OpenCv光流法进行运动目标检测】

opencv系列文章目录 文章目录 opencv系列文章目录前言一、光流法是什么?二、光流法实例1.C的2.C版本3.python版本 总结 前言 随着计算机视觉技术的迅猛发展,运动目标检测在图像处理领域中扮演着至关重要的角色。在现实世界中,我们常常需要追…

ES相关面试问题整理

索引模板了解么 索引模板,一种复用机制,就像一些项目的开发框架如 Laravel 一样,省去了大量的重复,体力劳动。当新建一个 Elasticsearch 索引时,自动匹配模板,完成索引的基础部分搭建。 模板定义&#xf…

基于LSTM-Adaboost的电力负荷预测的MATLAB程序

微❤关注“电气仔推送”获得资料(专享优惠) 主要内容: LSTM-AdaBoost负荷预测模型先通过 AdaBoost集成算法串行训练多个基学习器并计算每个基学习 器的权重系数,接着将各个基学习器的预测结果进行线性组合,生成最终的预测结果。代码中的LST…

Grafana 10 新特性解读:体验与协作全面提升

作者:徽泠(苏墨馨) 为了庆祝 Grafana 的 10 年里程碑,Grafana Labs 推出了 Grafana 10,这个具有纪念意义的版本强调增强用户体验,使各种开发人员更容易使用。Grafana v10.0.x 为开发者与企业展示卓越的新功能、可视化与协作能力&…

虚幻引擎5:增强输入的使用方法

一、基本配置 1.创建一个输入映射上下文(映射表) 2.创建自己需要的操作映射或者轴映射 3.创建完成之后进入这个映射,来设置类型,共有4个类型 1.Digital:是旧版操作映射类型,一般是按下抬起来使用,像跳跃…

[管理与领导-116]:IT人看清职场中的隐性规则 - 13 - 项目负责人如何帮助项目经理提升项目管理的威望、成就感、积极性,从而提升项目执行的效率?

目录 前言: 一、项目负责人与项目经理两种角色的比较 二、项目负责人如何帮助项目经理 三、其他安排 3.1 赋予项目经理更多的责权 3.2 确保项目经理的话语权 前言: 项目负责人是项目最终的负责人,然而,很多时候&#xff0c…

uniapp h5 MD5加密

文章目录 1.当使用 CryptoJS 进行 MD5 加密时,你需要先引入 CryptoJS 库并确保它已经正确安装。下面是一个更详细的示例代码:2.然后,在需要使用 MD5 加密的地方,引入 CryptoJS 代码库:3.接下来,我们定义一个…

Linux实现原理 — I/O 处理流程与优化手段

Linux I/O 接口 Linux I/O 接口可以分为以下几种类型: 文件 I/O 接口:用于对文件进行读写操作的接口,包括 open()、read()、write()、close()、lseek() 等。 网络 I/O 接口:用于网络通信的接口,包括 socket()、conne…

Easypoi 多sheet数据导入导出

easypoi功能如同名字easy,主打的功能就是容易,让一个没见接触过poi的人员 就可以方便的写出Excel导出,Excel模板导出,Excel导入,Word模板导出,通过简单的注解和模板 语言(熟悉的表达式语法),完成以前复杂的写法。 1.引入依赖包 <dependency><groupId>cn.afterturn…

RabbitMQ常见的交换机类型

RabbitMQ安装 pom.xml里导入相关的依赖&#xff1a; <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-amqp</artifactId></dependency> application.properties配置文件 spring.rabbitmq.hos…

Nginx - 反向代理与负载均衡

目录 一、Nginx 1.1、Nginx 下载 1.2、nginx 基础配置的认识 a&#xff09;第一部分&#xff1a;全局块 b&#xff09;第二部分&#xff1a;events 块 c&#xff09;第三部分&#xff1a;http 块 http 块中 内嵌的 server 块 1.3、一些常用配置 1.3.1、location 匹配级…

java正则表达式 及应用场景爬虫,捕获分组非捕获分组

正则表达式 通常用于校验 比如说qq号 看输入的是否符合规则就可以用这个 public class regex {public static void main(String[] args) {//正则表达式判断qq号是否正确//规则 6位及20位以内 0不能再开头 必须全是数子String qq"1234567890";System.out.println(qq…

【机器学习】sklearn特征选择(feature selection)

文章目录 特征工程过滤法&#xff08;Filter&#xff09;方差过滤相关性过滤卡方过滤F验表互信息法小结 嵌入法&#xff08;Embedded&#xff09;包装法&#xff08;Wrapper&#xff09; 特征工程 特征提取(feature extraction)特征创造(feature creation)特征选择(feature se…

【软件设计师-下午题总结】

目录 下午题之总结于学习记录&#xff1a;题一、数据流图&#xff1a;1、熟悉相关的图形2、实体名称3、数据存储4、补充缺失的数据流和起点终点5、用结构化语言描述6、描述&#xff0c;找加工逻辑的时候7、如何保持数据流平衡 题二&#xff1a;实体联系图&#xff1a;1、常用图…

Django Test

Django--Laboratory drug management and early warning system-CSDN博客 创建项目doinglms django-admin startproject doinglms python manage.py runserver 运行开发服务器(Development Server) 创建一个自定义 App,名称为 lms: python manage.py startapp lms

minio桶命名规则

一、背景 今天做项目需要上传图片到minio&#xff0c;上传失败&#xff0c;查看错误是桶未创建成功。 minio桶的创建具有自己的命名规则&#xff0c;不符合则无法创建。 二、命名规则 1、存储桶名称的长度必须介于 3&#xff08;最小&#xff09;到 63&#xff08;最大&…

【数据结构】二叉树--堆排序

目录 一 降序(建小堆) 二 升序 (建大堆) ​三 优化(以升序为例) 四 TOP-K问题 一 降序(建小堆) void Swap(int* x, int* y) {int tmp *x;*x *y;*y tmp; }//降序 建小堆 void AdjustUp(int* a, int child) {int parent (child - 1) / 2;while (child > 0){if (a[chil…

Ubuntu 22.04.3 LTS单机私有化部署sealos

推荐使用奇数台 Master 节点和若干 Node 节点操作系统 :Ubuntu 22.04 LTS内核版本 :5.4 及以上配置推荐 :CPU 4 核 , 内存 8GB, 存储空间 100GB 以上最小配置 :CPU 2 核 , 内存 4GB, 存储空间 60GB 这里采用的Ubuntu 22.04.3 LTS 版本&#xff0c;Ubuntu 20.04.4 LTS这个版本…