HTML5的新特性和CSS3的新特性
HTML5的新特性
可以更清晰地描述网页的结构和内容,提高网页的可读性和可访问性,同时也有利于搜索引擎优化(SEO)。
:如日期选择器、颜色选择器、滑块等,使表单更加易用,同时内置了表单验证功能,减少了前端验证代码的编写量。
等
CSS3的新特性
改善布局和样式 如边框圆角、边框阴影、渐变、文本装饰
动画和过渡 transition 属性和 @keyframes 规则制定动画效果
多列布局和弹性盒子布局
媒体查询 不同屏幕的尺寸使用不同的css
自定义字体和背景
网格布局 上下居中水平对齐方式 /* 水平和垂直都居中 */
div 上下居中对齐的几种方式
第一种:flex布局
.parent {
display: flex;
justify-content: center; /* 水平居中 /
align-items: center; / 垂直居中 /
height: 100vh; / 或者其他需要的高度 */
}
第二种使用Grid 网格布局
.parent {
display: grid;
place-items: center; /* 水平和垂直都居中 / height: 100vh; / 或者其他需要的高度 */
}
.child {
position: absolute;
top: 50%;
left: 50%;
transform:translate(-50%, -50%);
}
第四中使用line-height 适用于单行文本
.parent {
line-height: 100vh;
text-align: cente
}
伪类和伪元素的区别
css 选择器的优先级排序
优先级排序从高到低: !important 行内样式 ID选择器 类选择器
深拷贝与浅拷贝
浅拷贝 在栈内存中重新开辟一块内存空间,并将拷贝对象储存在栈内存中的数据存放到其中。 :
实现方法: 使用赋值运算符(=)或者Object.assign()函数进行拷贝
示例:
const a = [1, 2, 3];
const b = a; // 浅拷贝
b[0] = 4;
console.log(a); // [4, 2, 3]
console.log(b); // [4, 2, 3]
深拷贝 会另外创造一个一模一样的对象
实现方法:递归拷贝 JSON.parse(JSON.stringify(obj)) …扩展运算符
示例
const a = [1, 2, 3];
const b = […a]; // 这只适用于一层深拷贝
const c = JSON.parse(JSON.stringify(a)); // 深拷贝
c[0] = 4;
console.log(a); // [1, 2, 3]
console.log©; // [4, 2, 3]
代码示例:
HTTPS的工作流程,,HTTPS证书的验证
1.JSONP原理
利用标签 的 src 没有跨域限制的“漏洞” 来达到与第三方通讯的目的
只能处理
服务器端对于CORS的支持,主要就是通过设置来进行的。如果浏览器检测到相应的设置,就可以允许Ajax进行跨域的访问。
2. cookie、sessionStorage、localStorage的区别
3.link和a标签区别
4 vue中的跨域问题
如果后端地址不带路径’/api’, 路径:‘http://www.xxxxxx.com/api’ 改为‘http://www.xxxxxx.com’即可。
6 浏览器与服务器的交互原理
可以简单分为7 个步骤
1—> 输入网址
2—> 浏览器发送 http 请求
3—> 与dns 建立tcp/ip 3次握手
4—> 服务器 解析 并查找对应的域名
5—> 服务器相应数据返回
6—>浏览器 下载 解析 服务器的响应数据
7—> 创建dom树 并解析css 与js 知道页面渲染完毕
7 什么是CSS盒模型 >>> -IE盒模型和W3C盒模型
8 A解释一下闭包,B为什么要使用闭包? 缺点
A 这里b函数访问了构造函数a里面的变量,所以形成了一个闭包
B 因为我们想要持续的使用一个变量,放在全局中会造成全局污染,放在函数中,函数执行完后会销毁,变量也随之销毁,因此需要使用闭包。
拓展: 闭包函数是在window作用域下执行的,也就是说,this指向windows
缺点 : 内存泄露问题, 所以不能滥用闭包,
9 解释一下作用域链
10 如何处理不让别人盗用你的图片,访问你的服务器资源?
1.如果你用的是nginx,那可以考虑用location 通配你的图片后缀,根据refer,再决定是否返回图片资源。
2. 又拍云 七牛云 都有防盗链配置
3. 假设没有使用cdn,即需要自己做防盗链。
一是对refer做判断看来源是不是自己的网站,如果不是就拒绝,这个适用范围最大,也很容易激活成功教程, 因为refer可以伪造。第二个是通过session校验,如果不通过特定服务生成cookie和session就不能请求得到资源。这个最保 险,因为session在后端。
4.给图片加水印
11 如何优化网站性能
1 许多的小图片整合到一张大图片中(精灵图)减少网页的http请求,提升网页加载速度。
对于 一些小图标,可以使用base64位编码,以减少网络请求。但不建议大图使用,比较耗费CPU; 小图标优势在于:.减少HTTP请求; .避免文件跨域; .修改及时生效;
2 代码压缩 应用第三方资源库 cdn托管
3 控制资源文件加载优先级 css 优先 一般情况下都是CSS在头部,JS在底部。
4 利用浏览器缓存
5 减少页面重排
6 图片lazyload 懒加载 提高用户体验
7禁止使用gif图片实现loading效果(降低CPU消耗,提升渲染性能);
8、使用CSS3代码代替JS动画(尽可能避免重绘重排以及回流);
9 减少dom 操作 优化js
ES5 与 ES6新特性
js中操作数组的方法
1.对于MVVM的理解?
1.MVVM 是 Model-View-ViewModel 的缩写。
2 mvvm的设计原理是基于mvc的
3.
Model代表数据模型 .
View 代表UI 组件视图
ViewModel监听模型数据的改变和控制视图行为、处理用户交互,简单理解就是一个同步View 和 Model的对象,连接Model和View
2 Vue2的生命周期 vue3的生命周期
1 什么是vue2生命周期?
2.vue生命周期的作用是什么?
答:它的生命周期中有多个事件钩子,让我们在控制整个Vue实例的过程时更容易形成好的逻辑。
3.vue生命周期总共有几个阶段?
答:它可以总共分为8个阶段:创建前/后, 载入前/后,更新前/后,销毁前/销毁后。
4.第一次页面加载会触发哪几个钩子?
答:会触发 下面这几个beforeCreate, created, beforeMount, mounted 。
5.DOM 渲染在 哪个周期中就已经完成?
答:DOM 渲染在 mounted 中就已经完成了。
3 Vue2实现数据双向绑定的原理:Object.defineProperty(),
vue实现数据双向绑定-订阅者模式的方式,在数据变动时发布消息给订阅者,触发相应监听回调
3-1 Vue3实现数据双向绑定的原理:Proxy
当属性被修改时,Proxy对象的set陷阱会被触发。此时,Vue3会通知所有依赖该属性的Watcher对象进行更新。Watcher对象会调用对应的更新函数,从而触发视图的重新渲染
4 Vue组件间的参数传递 和父子组件方法调用
5 Vue的路由实现:hash模式 和 history模式区别,上线有什么区别。
1 hash模式:在浏览器中符号“#”,
2 history模式:history采用HTML5的新特性;且提供了两个新方法:pushState(),replaceState()可以对浏览器历史记录栈进行修改,以及popState事件的监听到状态变更。
:
hash模式:URL 形式:http://example.com/#/path,# 后面的部分来模拟一个完整的 URL,不会引起页面的重新加载。
history 模式:URL 形式:http://example.com/path,需要配置服务器,不然就会当成真正的路径要后端配置重定向,不然就访问不到。
6 vue路由的钩子函数 (路由守卫)
首页可以控制导航跳转,,等,一般用于页面title的修改。一些需要登录才能调整页面的重定向功能。
beforeEach主要有3个参数:
to:route即将进入的目标路由对象,
from:route当前导航正要离开的路由
next:function一定要调用该方法resolve这个钩子。执行效果依赖next方法的调用参数。可以控制网页的跳转。
Vue-router的跳转原理:
7 .vuex是什么?怎么使用?哪种功能场景使用它?
Vuex可以理解为一种开发模式或框架,通过状态集中管理驱动组件的变化,应用级的状态集中放在store中,改变状态的方式是提交mutations,异步逻辑封装在action中
8 对keep-alive 的了解?
答:。
5.1 v-for与v-if 一起使用
由于v-for会先执行,如果列表项很多,即使大部分项都不满足v-if的条件,Vue仍然会先遍历整个列表,然后再对每个元素进行条件判断。这可能会导致不必要的计算 性能下降,特别是在处理大型数据集时,可能会使代码的逻辑变得不清晰
可以 … 例: <p @click=“one(),two()”>点击
这个key值对数据改变之后的diff更新比较有很大的性能提升,或者说有了key和没有key是两种比较和更新机制
Key的作用主要是为了高效的更新虚拟DOM。另外vue中在使用相同标签名元素的过渡切换时,也会使用到key属性,
其目的也是为了让vue可以区分它们,否则vue只会替换其内部属性而不会触发过渡效果 就不会达到最小更新
index值不是一定不变的,如果不加key值的话,删除前面的项。后面的index可能变也可能不变,
比如加个定时器的时候会变,不加定时器不会变
在父组件的方法中调用子组件的方法,很重要 (“嘿嘿嘿”);
代码文档
vue页面在加载的时候闪烁花括号{}},v-cloak指令和css规则如[v-cloak]{display:none}一起用时,这个指令可以隐藏未编译的Mustache标签直到实例准备完毕。
深度监听
可以 在路由里设置需要缓存的组件 缓存 后 页面跳转回来 不会重新获取数据渲染
通过object.defineProperty 的数据劫持
结论 : (。。。。源码可以查看 搜索 fenElement 可查看for比if判断优先 亲自也测过)
创建期setup()
挂载期:
onBeforeMount() 组件挂载到节点上之前执行的函数
onMounted() 组件挂载完成后执行的函数,此时可以访问和操作DOM
更新期:
onBeforeUpdate(): 组件更新之前执行的函数
onUpdated(): 组件更新完成之后执行的函数
销毁期:
onBeforeUnmount(): 组件卸载之前执行的函数,可以进行一些善后的工作,例如清理定时器等
onUnmounted(): 组件卸载完成后执行的函数,表示组件已经被完全销毁
1.Vue 3在速度和体积上相较于Vue 2更小、更快
2.生命周期钩子函数有所变化 , 例如beforeCreate和created被setup()函数替代。而其他的生命周期钩子函数则需要在前面加上on前缀,如onBeforeMount、onMounted等
3.响应式系统 ,Vue 2使用Object.defineProperty()数据劫持来实现响应式数据绑定,Vue 3则使用Proxy来替代
vue和react的区别 (三个角度分析)
…数组快速去重 数组扁平化new Set
…数组快速删除最后一个数据pop
array.pop()
…如何监听 DOM 树中的节点添加、删除、属性更改和内容更改等事件
首先js是单线程的,那么就会出现一个问题就是阻塞问题,浏览器是怎么解决这个问题呢,比如说网络请求和settimeout,它是通过异步来做的,如果都用异步的话都会放在队列里面,异步队列有一个问题他没有优先级,所以为了更灵活增加了事件循环
js是单线程它有 ,同步任务,和异步任务,一般是异步任务又分为微任务和宏任务
先执行同步任务队列执行完了,再执行微任务队列完了之后再执行宏任务,每 执行一次宏任务时会时时检测微任务队列有没有任务,如果有微任务 会先清空微任务队列,执行完了 再去执行下一个宏任务。所以一次循环,这就是事件循环
Boolean null String Number Object Undefined
:Number、String 、Boolean、Null和Undefined。基本数据类型是按值访问的,因为可以直接操作保存在变量中的实际值
比如:Object 、Array 、Function 、Data等。
能够区分除数组和对象和null外的所有类型 [] {} null 都返回object
instanceof 及原理
object.toString().call()
= ==相等 ===全等 强制转换和 隐式转换
A 这里b函数访问了构造函数a里面的变量,所以形成了一个闭包
B 因为我们想要持续的使用一个变量,放在全局中会造成全局污染,放在函数中,函数执行完后会销毁,变量也随之销毁,因此需要使用闭包。
拓展: 闭包函数是在window作用域下执行的,也就是说,this指向windows
: 内存泄露问题, 所以不能滥用闭包
call /apple 用法一样 接受参数的方式不太一样 其中 this 是你想指定的上下文。 数据多的用apply
bind()创建的是一个新的函数(称为绑定函数),与被调用函数有相同的函数体,当目标函数被调用时this的值绑定到 bind()的第一个参数上
事件委托利用了事件冒泡
事件冒泡允许多个操作被集中处理(例如,把事件处理器添加到一个父级元素上,避免把事件处理器添加到多个子级元素上),并且可以在对象层的不同级别捕获事件。
事件委托是利用事件冒泡原理实现的,即事件目标自身不处理事件,而是把处理任务委托给其父元素或者祖先元素,甚至根元素
阻止事件冒泡,可以通过event.stopPropagation()方法来阻止事件冒泡
首先,webstorage中包含sessionStorage和localStorage。 cookie和webstorage的区别:
1.出现的时间:
2.跟随请求状态:
3.储存大小:
4.生命周期:
5.存在的位置
示例:
1.创建了一个新对象 var obj = {}
2 this关键字指向obj
3 prototype原型指向obj原型,
4 执行构造函数
函数防抖和节流是优化高频率执行js代码的一种手段,js中的一些事件如浏览器的resize、scroll,鼠标的mousemove、mouseover,input输入框的keypress等事件在触发时,会不断地调用绑定在事件上的回调函数,极大地浪费资源,降低前端性能。为了优化体验,需要对这类事件进行调用次数的限制。
: 在一段连续操作结束后,处理回调,利用clearTimeout 和 setTimeout实现
:每隔一段时间,只执行一次函数。
:滚动加载,加载更多或滚到底部监听 谷歌搜索框,搜索联想功能 高频点击提交,表单重复提交
1.普通函数调用,此时 this 指向 window
2.构造函数调用, 此时 this 指向 实例对象
3.对象方法调用, 此时 this 指向 该方法所属的对象
4.通过事件绑定的方法, 此时 this 指向 绑定事件的对象5.定时器函数, 此时 this 指向 window
Promise是JavaScript中异步编程的一种解决方案,用于处理异步操作的结果
:
Promise对象的状态不受外界影响,只有异步操作的结果才能决定其状态
解决了回调地狱问题,使得代码结构更加清晰和可维护
提供了统一的API,使得异步操作的控制更加容易
在ES8中引入了async/await,它是基于Promise实现的,使得异步编程更加简洁和直观
在 then 方法中返回另一个 Promise,因此可以将多个 then 方法串联起来,形成一个链式调用。每个 then 方法的返回值都会作为下一个 then 方法的输入,从而实现异步操作的顺序执行。
如果你在 catch 块中再次抛出错误,这个新的错误可以被外层的 try…catch 语句捕获,或者如果没有外层的 try…catch 语句,它会继续向上抛出,直到被捕获或导致程序终止。
是 单线程的 重上到下 按顺序执行
代码运行的两个阶段:
1、预解析—把所有的函数定义提前,所有的变量声明提前,变量的赋值不提前
2、执行—从上到下执行(按照js运行机制)
1、原型链继承
2、构造继承
3、实例继承
4、拷贝继承
5、组合继承
当JavaScript代码运行时,需要分配内存空间来存储变量和值。当变量不再参与运行时,就需要系统收回被占用的内存空间,这就是垃圾回收
常见内存泄露的原因
- 全局变量引起的内存泄露
- 闭包引起的内存泄露:慎用闭包
- dom清空或删除时,事件未清除导致的内存泄漏
- 循环引用带来的内存泄露
优化写法
在对象结束使用后 ,令obj = null
js中开辟空间的操作有new(), [ ], { }, function (){…}。最大限度的实现对象的重用;
慎用闭包。闭包容易引起内存泄露
:是一种编程思想,将现实世界的事物抽象为对象,并使用类和对象来创建各种功能
内部环境可以通过作用域链来访问外部环境的属性和方法,但是,外部环境不能访问内部环境的任何属性和方法。注意,只能通过定义函数来延长作用域链条。
- 概念:闭包就是能够读取其他函数内部变量的函数。由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成“定义在一个函数内部的函数”。所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。
- 例子:函数b就是一个闭包函数,用于获取函数a内部的变量i。当函数a的内部函数b,被函数a外的一个变量c引用的时候,就创建了一个闭包。
- :闭包可以用在许多地方。它的最大用处有两个
:所有的函数都有一个特殊的属性prototype(原型),prototype属性是一个指针,指向的是一个对象(原型对象),原型对象中的方法和属性都可以被函数的实例所共享。所谓的函数实例是指以函数作为构造函数创建的对象,这些对象实例都可以共享构造函数的原型的方法。
:原型链是用于查找引用类型(对象)的属性,查找属性会沿着原型链依次进行,如果找到该属性会停止搜索并做相应的操作,否则将会沿着原型链依次查找直到结尾。常见的应用是用在创建对象和继承中。
多人开发 避免版本冲突
- 代码合并冲突
.
Entry Output Module Chunk Loader Plugin
Entry : 配置入口文件 webpack会找出有哪些模块是入库的依赖 , 相关的依赖会被处理 输出到bundles的文件中
Output :output属性会告诉webpack 他所创建的bundles 如何命名 默认值为 https://blog.csdn.net/weixin_/article/details/dist
module : 模块,在 Webpack 里一切皆模块,一个模块对应着一个文件。Webpack 会从配置的 Entry 开始递归找出所有依赖的模块。
Chunk : 代码块,一个chunk由多个模块组合而成,用于代码的合并和分割。
loader:模块转换器,用于将模块的原内容按照需要转成你想要的内容babel和webpack的区别: babel JS新语法编译工具,只关心语法,不关心模块化 webpack -打包构建工具,是多个Loader plugin的集合
Grunt和Gulp的工作方式是:在一个配置文件中,指明对某些文件进行类似编译,组合,压缩等任务的具体步骤,工具之后可以自动替你完成这些任务。
Webpack的工作方式是:把你的项目当做一个整体,通过一个给定的主文件(如:index.js),Webpack将从这个文件开始找到你的项目的所有依赖文件,使用loaders处理它们,最后打包为一个(或多个)浏览器可识别的JavaScript文件。
可通过plugin扩展
使用场景不局限于web开发
良好的开发体验
webpack的缺点是
5 webpack面试题 !
webpack打包原理?
把所有依赖打包成一个 bundle.js 文件,通过代码分割成单元片段并按需加载
Webpack是一个模块打包器,grunt和gulp是执行任务的,
webpack可以递归的打包项目中的所有模块(递归:指定一个入口,分析模块的依赖,它会递归的查找所有相关的依赖),
最终生成几个打包后的文件,他和其他的工具的最大的不同在于它支持code-splitting(代码分割),模块化(AMD,ESM,CommonJS)开发,全局的分析工具(分析整个项目引入的模块)
- 什么是模块热跟新 ? 有什么优点?
如何利用webpack来优化前端性能?
代码压缩 按需加载 使用Dll进行分包
.
正常情况下node_module会被打包成一个文件,使用dll技术,对可以将那些不常更新的框架和库进行单独打包,生成一个chunk
如何提高webpack的构建速度?
- 如何利用webpack来优化前端性能?
模块热更新是webpack的一个功能,他可以使得代码修改过后不用刷新浏览器就可以更新,是高级版的自动刷新浏览器。
它是吧所有模块构建完了,再去启动项目的
前端构建工具。提供了快速的冷启动和即时的热模块更新,
解决了传统打包工具在开发阶段的缓慢问题
通过index.html的type="module"脚本标签直接从服务器加载模块
vite.config.js是Vite的配置文件,允许你自定义Vite的行为,如定义入口文件、基础路径、构建输出、插件等
1.Vite 为什么比 Webpack 快:
Vite 在开发环境中使用原生 ES 模块(ESM)来加载模块,而不是通过打包工具。这样可以显著减少启动时间和热更新时间。
原生 ESM 支持使得 Vite 可以按需加载模块,而不需要提前打包所有文件
2.vite有哪些缺点?
插件生态系统相对较小
兼容性差, IE11 等不支持 ESM 的浏览器
1.优化网络请求
2.减少不必要的模块加载
3.配置 Vite 的缓存策略,例如使用 vite-plugin-pwa 插件来实现 PWA 缓存。确保资源在首次加载后能够被有效缓存
它使用虚拟DOM 而不是真正的DOM。
它可以进行服务器端渲染。
它遵循单向数据流或数据绑定。
优点:
代码可读性很好
性能好
虚拟DOM是真实DOM在内存中的表示,ul的表示形式保存在内存中,并且与实际的DOM同步,这是一个发生在渲染函数被调用和元素在屏幕上显示的步骤,整个过程被称为调和
key 用于识别唯一的 DOM 元素帮助 React 优化渲染
- 类组件可以使用其他特性,如状态和生命周期钩子,并且他有this
- 函数组件只能接收props渲染到页面,无状态组件,没有this,不能使用生命周期钩子,但可以使用hooks
- 函数组件性能要高于类组件 因为类组件使用要实例化,而函数组件直接执行取返回结果即可 为了提高性能,尽量使用函数组件
不同版本中有所调整v16之前的,
类组件生命周期方法
初始化/挂载 constructor(props)
挂载 render()
挂载后 componentDidMount()
更新 render()
更新后 componentDidUpdate
卸载 componentWillUnmount()
函数组件生命周期钩子Hook 方法
初始化 useState()
挂载 useEffect()
卸载 useCleanup()
componentWillMount:在渲染之前执行,
componentDidMount:在第一次渲染之后执行,
componentWillReceiveProps:在初始化render的时候不会执行
shouldComponentUpdate:确定是否更新组件。
componentWillUpdate:在shouldComponentUpdate返回 true 确定要更新组件之前件之前执行。
componentDidUpdate:它主要用于更新DOM以响应props或state更改。
componentWillUnmount:它用于取消任何的网络请求,或删除与组件关联的所有事件监听器。
一种访问DOM节点的方法
通过React.createRef()创建的
在第一发布react时,还引入了一种新的js方言jsx,将原始 HTML 模板嵌入到 JS 代码中。JSX 代码本身不能被浏览器读取,必须使用Babel和webpack等工具将其转换为传统的JS
如果试图直接更新state,就不会重新渲染组件,需要使用setState()方法更新state,它对state对象进行更新,当state改变时,组件通过重新渲染来响应
在 HTML 中,表单元素如 < input>、< textarea>和< select>通常维护自己的状态,并根据用户输入进行更新,这种组件跟踪渲染表现为受控组件
是由 DOM 处理表单数据的地方,而不是在 React 组件中
Context 通过组件树提供了一个传递数据的方法,从而避免了在每一个层级手动的传递 props 属性
1.组件优化 尽量通过props来处理数据避免不必要的重新渲染
2.使用reduce管理数据
3.利用本地存储
4静态资源压缩,优化CSS、JavaScript文件大小
TypeScript 编译阶段
JSX编译阶段
创建虚拟DOM
渲染虚拟DOM
DIFF算法与更新DOM
真实DOM更新
函数组件中可以使用类组件中的特性问题
Redux 是当今最热门的前端开发库之一。它是 JavaScript 程序的可预测状态容器,用于整个应用的状态管理。使用 Redux 开发的应用易于测试,可以在不同环境中运行,并显示一致的行为
这里是引用
Action – 这是一个用来描述发生了什么事情的对象。
Reducer – 这是一个确定状态将如何变化的地方。
Store – 整个程序的状态/对象树保存在Store中。
View – 只显示 Store 提供的数据。
useState: 定义state的数据
useEffect:副作用函数
useMemo:用来计算数据
useMemo和useEffect 相比较来说,useMemo 是组件更新的时候触发生命周期
useCallback:当父组件向子组件传递函数的时候
useRef:相当于createRef的使用,创建组件的属性信息
useContext:相当在函数组件中获取context状态数的内容信息
useReducer:useReducer是用来弥补useState的补不足, 可以把数据进行集中式的管理,单独处理数据的逻辑信息
1.WebSocket 提供了低延迟的实时通信能力,能够在服务器端有新数据时立即推送给客户端。
2.WebSocket 支持客户端和服务器之间的双向通信,可以实现实时聊天、实时数据更新等场景
3.WebSocket 使用长连接,相对于频繁的短连接请求,减少了网络开销。
4.WebSocket 具备跨域通信的能力,可以跨域进行实时通信
1.客户端发送 WebSocket 握手请求
2.服务器收到握手请求后,验证请求头的字段,并返回握手响应
3.客户端收到握手响应后,验证响应头的字段,并生成一个 Sec-WebSocket-Accept 值进行验证
4.验证通过后,WebSocket 连接建立成功,客户端和服务器可以开始进行实时通信
WebSocket 在出现错误时会触发 error 事件,可以通过设置 onerror 事件处理函数来处理错误,例如:
当 WebSocket 连接关闭时,会触发 close 事件,可以通过设置 onclose 事件处理函数来执行一些清理操作或重新连接等操作,可以通过调用 close() 方法来显式地关闭 WebSocket 连接
在onopen事件中,使用setInterval方法定时发送心跳数据包。例如,每5000毫秒发送一次心跳数据包,可以使用如下代码:
到此这篇浏览器兼容性面试题(浏览器的兼容性问题 js面试)的文章就介绍到这了,更多相关内容请继续浏览下面的相关推荐文章,希望大家都能在编程的领域有一番成就!版权声明:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若内容造成侵权、违法违规、事实不符,请将相关资料发送至xkadmin@xkablog.com进行投诉反馈,一经查实,立即处理!
转载请注明出处,原文链接:https://www.xkablog.com/qdvuejs/61174.html