2023面试题记录

1、js怎么判断对象为空?

判断对象是否为空的一个简单方法是检查对象的所有可枚举属性。如果一个对象没有可枚举属性,那么我们可以认为它是空的。你可以使用 Object.keys() 函数来获取对象的所有可枚举属性,然后检查得到的数组的长度。如果长度为0,那么对象是空的。

function isEmpty(obj) {  return Object.keys(obj).length === 0 && obj.constructor === Object;  
}  var myObj = {};  if (isEmpty(myObj)) {  console.log("对象是空的");  
} else {  console.log("对象不是空的");  
}

2、最新的 url 参数获取的 API

对于获取URL参数的API,你可以使用JavaScript的URLSearchParams接口

const urlParams = new URLSearchParams(window.location.search);  
const myParam = urlParams.get('myParam');

3、新版本发布后,怎么用技术手段通知用户刷新页面?

新版本发布后,你可以使用Web Push通知用户刷新页面。

if ('serviceWorker' in navigator) {  navigator.serviceWorker.register('/service-worker.js')  .then(() => console.log('Service Worker Registered'))  .catch(err => console.log('Service Worker Registration Failed: ', err));  
}

4、Vue 项目怎么提高项目性能?

  • 懒加载:使用Vue的异步组件和Webpack的代码拆分功能,将大型依赖文件拆分成小块,根据需要动态加载。
  • 代码拆分:将大型Vue组件拆分成多个小型组件,减少渲染时间和内存占用。
  • 优化图片:使用压缩和优化工具,例如TinyPNG和ImageOptimizer,减少图片大小和加载时间。

5、缓存

        5.1、强缓存

        强制浏览器在一定时间内直接从本地缓存读取数据,不向服务器发送请求。强缓存可以通过设置响应头信息实现,常见的响应头有 Expires 和 Cache-Control。

        5.2、协商缓存

        在强缓存失效时,浏览器会向服务器发送请求,询问服务器该资源在最后一次访问后是否有修改。如果没有修改,服务器会返回 304 状态码,告诉浏览器可以继续使用本地缓存,否则会返回新的资源内容。协商缓存可以通过设置响应头信息实现,常见的响应头有 Last-Modified 和 ETag。

        5.3、浏览器缓存的主要流程可以概括为以下几个步骤:

            5.3.1、浏览器收到 HTTP 请求时,会根据 URL 判断该资源是否已经被缓存。如果已经被缓存,则直接从本地缓存读取资源。
            5.3.2、如果未被缓存或者缓存已经过期,浏览器会向服务器发送请求,并在请求中带上一些信息,例如上次访问时间、Etag 等。
服务器收到请求后,根据请求中的信息判断资源是否有更新。如果资源没有更新,则返回一个 304 响应码,告诉浏览器可以继续使用本地缓存;如果资源已经更新,则返回新的资源内容和一些缓存相关的头信息。
            5.3.3、浏览器收到响应后,会根据响应头信息来更新本地缓存,并将新的资源内容展示给用户

6、new一个构造函数的过程

  • 创建一个空对象。
  • 将这个新对象的原型指向构造函数的prototype属性。
  • 执行构造函数,并且将this指向新创建的对象。
  • 如果构造函数没有返回值或者返回一个非对象值,则返回新创建的对象。如果构造函数返回一个对象,则返回这个对象。
function myNew(ctor, ...args) {// 创建一个新对象,并将该对象的原型指向构造函数的原型对象const obj = Object.create(ctor.prototype);// 调用构造函数,并将新对象作为 this 参数传递进去const result = ctor.apply(obj, args);// 如果构造函数返回了一个非空对象,则返回该对象;否则,返回创建的新对象if (typeof result === 'object' && result !== null) {return result;}return obj;
}
// 测试:
function Person(name, age) {this.name = name;this.age = age;
}const person = myNew(Person, '张三', 18);
console.log(person.name); // 输出:张三
console.log(person.age); // 输出:18

7、EventLoop

  1. 代码开始执行,创建一个全局调用栈,script作为宏任务执行
  2. 执行过程过同步任务立即执行,异步任务根据异步任务类型分别注册到微任务队列和宏任务队列
  3. 同步任务执行完毕,查看微任务队列
    • 若存在微任务,将微任务队列全部执行(包括执行微任务过程中产生的新微任务)
    • 若无微任务,查看宏任务队列,执行第一个宏任务,宏任务执行完毕,查看微任务队列,重复上述操作,直至宏任务队列为空
    • 宏任务(script、定时器、ajax、I/O);微任务(promise.then、async await、MutationObserve 监听dom变化)

8、什么是js原型链

        JavaScript中的每个对象都有一个原型,也就是它们继承属性和方法的对象。而这个原型又可以有自己的原型,形成了所谓的“原型链”。
        当我们访问一个JavaScript对象的属性或方法时,首先会在该对象本身查找是否存在该属性或方法。如果不存在,它会沿着该对象的原型链向上查找,一直到Object.prototype为止。如果还没有找到,则返回undefined。

        因此,通过原型链,我们可以实现继承和代码复用。例如,我们可以创建一个基础对象,并将其作为其他对象的原型,使得后者能够共享基础对象的属性和方法。

9、防抖&节流

// 防抖-多次点击,只执行一次
function debounces(fn, time) {let timerreturn function() {if(timer) {clearTimeout(timer)}timer = setTimeout(() => {fn.apply(this, arguments);  }, time)}
}// 节流-一定时间内,只执行一次
function throttle(fn, time) {let timerreturn function() {if (timer) {timer = setTimeout(() => {fn.apply(this, arguments)timer  = null}, time)}}
}

今天先到这块,持续更新...

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

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

相关文章

企业如何转动自己的命运齿轮,实现数字化转型

企业进行数字化转型,需要熟悉数字化转型相关知识,了解众多前辈企业数字化转型成功或失败的案例,从中提炼出数字化转型的关键要点,在数字化转型的浪潮中,破浪前行。 数字化转型关键因素 1、数据 数据是数字化转型的基…

【PTA】攀拓(PAT)- 程序设计(甲级)2023年春季考试

个人学习记录,代码难免不尽人意。 今天又斥资买了今年春季的真题一试,呃,感觉尽力了,89分,在当年排名23,感觉还不错,没有出现读不懂的题目和没有思路的情况,扣的11分分别是第二题两个…

TortoiseGit设置作者信息和用户名、密码存储

前言 Git 客户端每次与服务器交互,都需要输入密码,但是我们可以配置保存密码,只需要输入一次,就不再需要输入密码。 操作说明 在任意文件夹下,空白处,鼠标右键点击 在弹出菜单中按照下图点击 依次点击下…

R语言分析糖尿病数据:多元线性模型、MANOVA、决策树、典型判别分析、HE图、Box's M检验可视化...

全文链接:https://tecdat.cn/?p33609 Reaven和Miller(1979)研究了145名非肥胖成年人的葡萄糖耐量和胰岛素血液化学指标之间的关系。他们使用斯坦福线性加速器中心的PRIM9系统将数据可视化为3D,并发现了一个奇特的图案&#xff0c…

2023年MySQL实战核心技术第三篇

目录 六 . 事务隔离:隔离级别,事务隔离原理,MVCC等原理的讲解 6.1 解释: 6.2 隔离性与隔离级别 6.2.1 SQL 标准的事务隔离级别: 6.2.2 事务隔离级别解释: 6.2.3 例子: 6.2.3.1 若隔离级别是“读…

【C++】源文件.cpp和头文件.h分离编程

优势介绍 将C代码分为头文件(.h)和源文件(.cpp)的做法有以下几个好处: 模块化和代码组织:将函数和类的声明(包括函数原型、类的成员和属性等)放在头文件中,将函数和类的…

如何使用Docker部署Nacos服务?Nacos Docker 快速部署指南: 一站式部署与配置教程

🌷🍁 博主猫头虎(🐅🐾)带您 Go to New World✨🍁 🦄 博客首页——🐅🐾猫头虎的博客🎐 🐳 《面试题大全专栏》 🦕 文章图文…

【Spring面试】二、BeanFactory与IoC容器的加载

文章目录 Q1、BeanFactory的作用是什么?Q2、BeanDefinition的作用是什么?Q3、BeanFactory和ApplicationContext有什么区别?Q4、BeanFactory和FactoryBean有什么区别?Q5、说下Spring IoC容器的加载过程(※)Q…

WPF——Control与Template理解

文章目录 一、前言二、控件三、模板3.1 DataTemplate3.2 ControlTemplate3.3 ContentPresenter 四、结语 一、前言 最近又翻看了下刘铁猛的《深入浅出WPF》,发现对模板章节中的部分内容有了更深的体会,所以写篇文扯扯。 文章标题是Control与Template&a…

掌动智能国产化测试工具的重要性与优势

在信息技术领域的快速发展下,对于软件和硬件产品的质量和性能要求也日益提高。同时针对信创要求,国产化测试工具在这个过程中发挥着重要的作用,不仅能够提升产品的可靠性和稳定性,还能够降低测试成本和提高测试效率。作为国内领先…

PBR纹理的10种贴图

PBR 是基于物理的渲染的首字母缩写。它试图通过模拟材料如何吸收和反射光,以模仿现实世界中的光流的方式产生视觉效果。最近的游戏引擎由于其逼真的效果而越来越多地使用 PBR 纹理。对于实时渲染,它们被认为是真实世界场景的最佳近似值。 推荐&#xff…

pyechart练习二:星巴克门店分布

一、概述 数据集:25601行13列 二、可视化 1、星巴克全球分布图 (1)普通地图 由于包或数据格式错误,地图无法显示区域颜色。 import pandas as pd from pyecharts.charts import * import pyecharts.options as opts df pd.r…