前端面试0906
// 请给出输出结果
function foo(){
console.log(a);
}
function bar(){
var a = 3;
console.log(this.a);
foo();
}
var a = 2;
bar();
2 2
// 请从下面的问题中挑选3道进行回答
1. 防抖和节流分别是什么,一般用在什么场景?
防抖(Debounce)和节流(Throttle)都是用来控制某个函数在一定时间内的触发次数.
作用:减少触发频率,提高性能或者说避免资源浪费。
区别:
防抖 (多次触发 只执行最后一次)
节流 (规定时间内 只触发一次)
防抖:
登录、短信验证等按钮避免用户点击太快,发行多次请求;调整浏览器窗口大小时,resize 次数过于频繁,计算过多,造成页面卡顿的情况;文本编辑器实时保存;搜索框等。
节流:
鼠标连续不断地触发某事件(如点击事件),单位时间内只触发一次;监听滚动事件,例如:懒加载;每隔多少秒计算一次相关数据。
2. 如何理解同步和异步,浏览器是如何处理异步任务的?
同步与异步是指访问数据的机制,同步一般指主动请求并等待IO操作完成的方式。
异步则指主动请求数据后便可以继续处理其它任务,随后等待IO操作完毕的通知。
同步和异步最大的区别就在于:同步需要等待,异步不需要等待。
1.1 同步请求
对于同步请求而言,浏览器在发送一个请求之后,需要等待服务器响应返回,才能够发送下一个请求,这一过程的示意图如下所示:
同步请求存在着两个明显的缺陷:
① 请求发出后必须要等待响应
比如当遇到请求阻塞,网络延迟等情况时,用户需要进行等待,这样会导致用户体验效果差。
② 每次请求都需要重新加载整个页面
比如在访问某个页面时,有的时候用户可能只需要请求获取页面某一部分内容的响应,但是当用户发送请求后,整个页面的所有内容都需要重新加载后再响应给用户,这样同样会导致用户的体验较差。
1.2 异步请求
与同步请求相对,发送异步请求不需要等待服务器响应,随时可以发送下一次的请求,减少了用户遇到请求阻塞、网络延迟时需要等待的时间。
同样以用户访问某个页面为例,用户需要请求获取页面某一部分内容的响应,如果用户发送的是异步请求,那么服务器会根据请求对页面进行局部的刷新,而不用每次请求都刷新整个页面,异步请求可以提升用户的体验。
原文链接:https://blog.csdn.net/weixin_48016395/article/details/123859626
浏览器通过setTimeout、setInterval、Promise、async/await、Ajax等实现异步
3. 响应式布局是什么,如何实现响应式布局?
响应式布局
4. 什么是AJAX以及它是如何工作的?
ajax
5. 什么是sessionStorage,localStorage和cookie,以及他们之间的区别是什么?
// 输入一个递增排序的数组和一个数字s,在数组中查找两个数,使得它们的和正好是s
// 如果有多对数字的和等于s,则输出任意一对即可。
// 输入:nums = [2,7,11,15], target = 9,输出:[2,7] 或者 [7,2]
// 输入:nums = [10,26,30,31,47,60], target = 40,输出:[10,30] 或者 [30,10]
TypeScipt:
function twoSum(nums: number[], target: number): number[] {
};
JavaScipt:
var twoSum = function(nums, target) {
let left,right;
for(let i=0;i<nums.length;i++){
for(let j=i+1;j<num.length;j++){
if(nums[i]+nums[j]===target){
left=i;
right=j;
console.log(‘[’+num[i]+‘,’+num[j]+‘]’);
break;
}
}}
};
// 用VUE或者React编写一个倒计时组件
// 组件接收的参数为秒,展示效果为“剩余:HH:MM:SS”
// 100 剩余:00:01:40
// 100 剩余:00:01:39
// 100 剩余:00:01:38
// …
let param=100;
let s,m,h;
s=param%60;
m=param/60;
h=param/3600;
相关文章:
![](https://img-blog.csdnimg.cn/6058e5f3923547be8e8e2f1dc931ffca.png)
前端面试0906
// 请给出输出结果 function foo(){ console.log(a); } function bar(){ var a 3; console.log(this.a); foo(); } var a 2; bar(); 2 2 // 请从下面的问题中挑选3道进行回答 1. 防抖和节流分别是什么,一般用在什么场景? 防抖(Debounc…...
![](https://img-blog.csdnimg.cn/img_convert/42605178a0dd3b3ef0f16650dd162e71.png)
OceanBase社区版4.x核心技术解密
数字化时代,各行各业的数据量呈现爆发式增长,对于海量数据价值的挖掘和应用,正成为推动创新的主要力量,与此同时,数据计算复杂度正在提升。在此背景下,对于数据处理的基石数据库而言,正面临市场…...
![](https://www.ngui.cc/images/no-images.jpg)
快速安装k8s
RKE安装方式 官方文章资源地址 https://rke.docs.rancher.com/installation rke工具下载地址(arm,amd,windows都有) https://github.com/rancher/rke/releases x86的用amd64下载rke工具 https://github.com/rancher/rke/releases/download/v1.4.8/rke_li…...
![](https://www.ngui.cc/images/no-images.jpg)
[FFmpeg] 常用ffmpeg命令
去水印 ffmpeg -i water.jpeg -strict -2 -vf delogox300:y250:w56:h18:show0 no_water.jpeg 打时间戳 ffmpeg -i perf_60Hz_Raw.mp4 -vf "drawtextfontsize160:fontcolorred:text%{pts\:hms}" -c:v libx264 -an -f mp4 perf_output.mp4 -y ffmpeg -i perf_8k.mp4 -v…...
![](https://www.ngui.cc/images/no-images.jpg)
代码随想录训练营第五十七天|647. 回文子串、516.最长回文子序列
647. 回文子串 题目链接/文章讲解/视频讲解:代码随想录 1.代码展示 //647.回文子串 int countSubstrings(string s) {//step1 构建dp数组,明确dp数组的含义,dp[i][j]的含义是在下标为i和j区间内的字串是否为回文串vector<vector<bool&…...
![](https://img-blog.csdnimg.cn/7b2f3fa522c747b0b97db738bf1de10e.png)
对线程池设置做压测
线程池代码 Configuration public class ThreadPoolConfig {// 核心线程池大小private int corePoolSize 24;// 最大可创建的线程数private int maxPoolSize 25;// 队列最大长度private int queueCapacity 100;// 线程池维护线程所允许的空闲时间private int keepAliveSeco…...
![](https://www.ngui.cc/images/no-images.jpg)
【网络通信 -- WebRTC】项目实战记录 -- mediasoup android 适配 webrtc m94
【网络通信 -- WebRTC】项目实战记录 -- mediasoup android 适配 webrtc m94 【1】下载并配置 depot_tools 下载 depot_tools git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git编辑 ~/.bashrc 将 depot_tools 添加到路径中 vim ~/.bashrc export…...
![](https://img-blog.csdnimg.cn/791774eae24e4a25ab647b08b3676a26.png)
【力扣周赛】第 357 场周赛(⭐反悔贪心)
文章目录 竞赛链接Q1:6925. 故障键盘解法1——直接模拟解法2——双端队列 Q2:6953. 判断是否能拆分数组(贪心)Q3:2812. 找出最安全路径⭐解法1——多源BFS瓶颈路模型?解法2——多源BFS 倒序枚举答案 并查…...
![](https://img-blog.csdnimg.cn/d902bc7f5b694004b7f44b14699fd5c3.png)
css重置
css 重置 CSS 重置的主要目标是确保浏览器之间的一致性,并撤消所有默认样式,创建一个空白板。 如今,主流浏览器都实现了css规范,在布局或间距方面没有太大差异。但是通过自定义 CSS 重置,也可以改善用户体验和提高开…...
![](https://www.ngui.cc/images/no-images.jpg)
tcpdump相关
Linux内核角度分析tcpdump原理(一)Linux内核角度分析tcpdump原理(二)...
![](https://img-blog.csdnimg.cn/5995fdf1187b4c92b059c68dd7f2647e.png)
MFC新建内部消息
提示:记录一下MFC新建内部消息的成功过程 文章目录 前言一、pandas是什么?二、使用步骤 1.引入库2.读入数据总结 前言 先说一下基本情况,因为要在mapview上增加一个显示加载时间的功能。然后发现是要等加载完再显示时间,显示在主…...
![](https://www.ngui.cc/images/no-images.jpg)
linux查找目录
要在Linux中查找目录,可以使用find命令。下面是查询目录的几个示例: 1,查找当前目录下所有子目录: find . -type d 2,在指定路径下查找目录: find /path/to/directory -type d 3,查找以特定名称开头的目录: find . -t…...
![](https://img-blog.csdnimg.cn/88c7ac922db54a858b5fa7c967cf73b9.png)
机器学习:可解释学习
文章目录 可解释学习为什么需要可解释机器学习可解释还是强模型可解释学习的目标可解释机器学习Local ExplanationGlobal Explanation 可解释学习 神马汉斯,只有在有人看的时候能够答对。 为什么需要可解释机器学习 贷款,医疗需要给出理由,让…...
![](https://www.ngui.cc/images/no-images.jpg)
UE5- c++ websocket里实现调用player里的方法
# UGameInstance里直接调用 获取到引用了,就可以自然的调用。忽略 # UGameInstance里间接调用,通过代理调用 前置已经添加了websocket,具体步骤参考,链接在UWebSocketGameInstance.h里新增代理,并在链接成功后进行绑定。 #pragma…...
![](https://img-blog.csdnimg.cn/baa49bb1b018479996f86bd20fed0bb8.png)
线性代数的学习和整理18:什么是维度,什么是秩?秩的各种定理秩的计算 (计算部分未完成)
目录 0 问题引出:什么是秩? 概念备注: 1 先厘清:什么是维数? 1.1 真实世界的维度数 1.2 向量空间的维数 1.2.1 向量空间,就是一组最大线性无关的向量组/基张成的空间 1.3 向量α的维数 1.3.1 向量的…...
![](https://img-blog.csdnimg.cn/285e988571d74c518604be60a6bbbcab.png)
Centos 6.5 升级到Centos7指导手册
一、背景 某业务系统因建设较早,使用的OS比较过时,还是centos6.5的系统,因国产化需要,需将该系统升级到BClinux 8.6,但官方显示不支持centos 6.x升级到8,需先将centos6.5升级到centos7的最新版,…...
![](https://www.ngui.cc/images/no-images.jpg)
详解python中的映射类型---字典
概述 映射类型是“键-值”数据项的组合,每个元素是一个键值对,即元素是(key,value),元素之间是无序的。键值对(key,value)是一种二元关系,源于属性和值的映射…...
![](https://img-blog.csdnimg.cn/63ec4a9a28b34d2aaf027f7f54ad5241.png)
gdal求矢量图形的形心
gdal求矢量图形的形心 #include "gdal_priv.h" #include "ogrsf_frmts.h"int main() {OGRRegisterAll();OGRPolygon* square_1 new OGRPolygon();OGRLinearRing* ring_1 new OGRLinearRing();// 添加 square_1 的点ring_1->addPoint(0, 0);ring_1-&g…...
![](https://www.ngui.cc/images/no-images.jpg)
<深度学习基础> Batch Normalization
Batch Normalization批归一化 BN优点 减少了人为选择参数。在某些情况下可以取消dropout和L2正则项参数,或者采取更小的L2正则项约束参数;减少了对学习率的要求。现在我们可以使用初始很大的学习率或者选择了较小的学习率,算法也能够快速训…...
![](https://img-blog.csdnimg.cn/3d0426a162c941aa93c3a0a9e03de64c.png)
Ubuntu yolov5 环境配置
查看Ubuntu版本 $ cat /proc/version Linux version 5.4.0-150-generic (builddbos03-amd64-012) (gcc version 7.5.0 (Ubuntu 7.5.0-3ubuntu1~18.04)) #167~18.04.1-Ubuntu SMP Wed May 24 00:51:42 UTC 2023虚拟机磁盘扩容 因为在环境搭建过程中遇到了磁盘空间不足的问题&a…...
![](https://img-blog.csdnimg.cn/e89b5059145a42ea8de964b12b732554.png)
【自执行闭包JS逆向】某网站登录MD5加密分析
文章目录 一、写在前面二、抓包分析三、加密函数分析 一、写在前面 最近工作比较忙,不过还是在督促自己利用有限的时间学习更新一些技术文章。互联网这个行业大家目前也都知道是非常内卷的,所有大家在工作之余养成良好的自主学习习惯是非常好的ÿ…...
![](https://img-blog.csdnimg.cn/10cbf89a594548cb80dceb803e57bb21.png)
Stable Diffuse 之 安装文件夹、以及操作界面 UI 、Prompt相关说明
Stable Diffuse 之 安装文件夹、以及操作界面 UI 、Prompt相关说明 目录 Stable Diffuse 之 安装文件夹、以及操作界面 UI 、Prompt相关说明 一、简单介绍 二、安装文件相关说明 三、界面的简单说明 四、prompt 的一些语法简单说明 1、Prompt :正向提示词 &am…...
![](https://img-blog.csdnimg.cn/e37bb6ec919b43248f15b80c2797a6bb.jpeg#pic_center)
【Linux】- 一文秒懂shell编程
shell编程 1.1 Shell 是什么1.2 Shell 脚本的执行方式1.3 编写第一个 Shell 脚本2.1 Shell 的变量2.2 shell 变量的定义2.3 设置环境变量3.1 位置参数变量3.2 预定义变量4.1 运算符4.2 条件判断5.1 流程控制5.2 case 语句5.3 for 循环5.4 while 循环5.5 read基本语法6.1函数6.2…...
![](https://www.ngui.cc/images/no-images.jpg)
CentOS下多网卡绑定多IP段时导致只有一个会通的问题解决
CentOS下多网卡绑定多IP段时导致只有一个会通的问题解决 虚拟机配置多个网络地址,结果同时只能有一个ip是通的, 原因:Linux默认开启了反向路由检查导致的,比如说外面访问eth0的网卡,而网关在eth1上,又或者从…...
![](https://www.ngui.cc/images/no-images.jpg)
关于实现 Vue 动态数据显示,比如数字 0 或 1 怎么显示为 男 或 女等等的动态显示实现方法
具体 Vue 代码演示: test.vue 文件演示: <template> <!-- 方法一 --> <div>{{ test.data 0 ? 男 : 女}}</div><!-- 方法二 --> <div>{{ test.data 0 ? 男 : }}{{ test.data 1 ? 女 : }}{{ test.d…...
![](https://img-blog.csdnimg.cn/e91c1169c00e429397404ede6c5b8bf7.png)
mac制作ssl证书|生成自签名证书,nodejs+express在mac上搭建https+wss(websocket)服务器
注意 mac 自带 openssl 所以没必要像 windows 一样先安装 openssl,直接生成即可 生成 ssl/自签名 证书 生成 key # 生成rsa私钥,des3算法,server_ssl.key是秘钥文件名 1024位强度 openssl genrsa -des3 -out server_ssl.key 1024让输入两…...
![](https://www.ngui.cc/images/no-images.jpg)
Unix System V BSD POSIX 究竟是什么?
学习Linux系统,很多同学对这些单词概念很模糊、一脸懵逼! 黄老师觉得,了解了历史,才会真正明白这些单词的含义,坐稳、黄老师发车了!!! 首先介绍一下什么是Unix? UNIX(非复用信息和计算机服务,英语:Uniplexed Information and Computing Service,UnICS)取“UNI…...
![](https://img-blog.csdnimg.cn/5e7f41244c074e269ef7b893102d8145.png)
数据集学习笔记(六):目标检测和图像分割标注软件介绍和使用,并转换成YOLO系列可使用的数据集格式
文章目录 一、目标检测1.1 labelImg1.2 介绍1.3 安装1.4 使用1.5 转换1.6 验证 二、图像分割2.1 labelme2.2 介绍2.3 安装2.4 使用2.5 转换2.6 验证 一、目标检测 1.1 labelImg 1.2 介绍 labelImg是一个开源的图像标注工具,用于创建图像标注数据集。它提供了一个…...
![](https://img-blog.csdnimg.cn/525ff6863e6b46b994dc442b4ed024e6.png)
【高阶数据结构】红黑树 {概念及性质;红黑树的结构;红黑树的实现;红黑树插入操作详细解释;红黑树的验证}
红黑树 一、红黑树的概念 红黑树(Red Black Tree) 是一种自平衡二叉查找树,在每个结点上增加一个存储位表示结点的颜色,可以是Red或Black。 通过对任何一条从根到叶子的路径上各个结点着色方式的限制,红黑树确保没有…...
![](https://www.ngui.cc/images/no-images.jpg)
获取对象占用内存
添加依赖 <dependency><groupId>org.apache.lucene</groupId><artifactId>lucene-core</artifactId><version>4.0.0</version> </dependency>添加vm启动参数 --add-opens java.base/java.langALL-UNNAMED --add-opens java.ba…...
![](http://www.turingbook.com/Data/Newswire/e037f9da-b400-47e9-ae18-89c1b330d11f/Asset/3pic-upcomingbooks.gif)
南京小程序开发网站制/流量神器
- 误区:思维中常犯的6个基本错误 ——本书通过许多生动玄妙的生活小事,深刻而犀利地揭示了6种思维陷阱,介绍了形成正确信念和作出科学决策应遵循的方法。通过作者引人入胜的叙事方式,层层深入的分析讲解,你不仅能产生…...
![](/images/no-images.jpg)
asp.net网站加速/小程序拉新推广平台
/**这个例子要实现向已有的数据库中插入一条数据。*/importjava.sql.*;importorg.omg.CORBA.portable.Streamable;importcom.mysql.jdbc.Statement;publicclassTestDML{publicstaticvo.../** 这个例子要实现向已有的数据库中插入一条数据。*/import java.sql.*;import org.omg.…...
![](http://d.hiphotos.baidu.com/baike/s%3D220/sign=7e812992d539b60049ce08b5d9513526/8435e5dde71190ef1d89b8aece1b9d16fdfa6054.jpg)
学校网站资源建设方案/一站式软文发布推广平台
肢体语言(body language)又称身体语言,是指通过头、眼、颈、手、肘、臂、身、胯、足等人体部位的协调活动来传达人物的思想,形象地借以表情达意的一种沟通方式。肢体语言也是演员的必修课程,不同角色不同情况下的肢体语…...
![](/images/no-images.jpg)
公司网站公司/网络舆情监控系统
版权声明:本文为博主原创文章,转载请注明出处。 https://blog.csdn.net/twilight_karl/article/details/77587740 查看进程 ps ps aux查看所有进程,使用BSD操作系统格式 ps -le 查看系统所有进程,使用Linux标准命令格式 参数 - a…...
![](/images/no-images.jpg)
做网站设计的广告公司/企业网站推广外包
时间运算 >>> datetime.datetime.now() #当前年月 时间datetime.datetime(2018, 2, 13, 16, 12, 6, 850532)>>> datetime.datetime.now() datetime.timedelta(minutes10) #当前年月 时间 加上 参数时间minutes 10 (加上10分钟)datetime.datetime(…...
![](https://img-blog.csdnimg.cn/img_convert/c4052d27001540b03892662861963c1e.png)
做赌博网站条件/seo优化网站
Vivo手机可以使用便签工具,既包括系统自带便签,也可以在手机应用商店搜索安装好用的云便签敬业签。在这款手机云便签中不仅可以使用文字、图片、录音及文件附件等方式添加便签内容,还能设置将便签内容直接显示在手机桌面上。那么,…...