- 博客(40)
- 收藏
- 关注
RSS订阅原创 谈谈你对WebSocket的理解
一、什么是WebSocketWebSocket是一种基于TCP的全双工通信协议，在应用层。1.为什么需要WebSocket1、传统上的HTTP协议它是无状态的，服务器不能够识别是哪个客户端发送的请求，不能够保存状态。2、WebSocket弥补了这一问题，在客户端向服务端发送请求之后，服务器处理请求并返回到客户端，使用WebSocket可以使得服务器主动向浏览器推送消息2.WebSocket与HTTP的区别1、HTTP是客户端直接向服务端发送请求，WebSocket是在完成一次握手之
2022-04-04 09:55:01
2541
原创 浏览器的回流和重绘（Reflow&&Repaint）
回流一定会引起重绘，重绘不一定引起回流回流：页面的部分内容或者全部内容重新渲染重绘：对元素的样式进行改变会导致回流的操作页面首次渲染 元素内容改变 字体大小改变 激活CSS伪类 添加删除DOM元素如何避免回流CSS尽量不使用table布局 避免使用CSS表达式JavaScript避免频繁操作样式 避免频繁操作DOM 给元素设置display 避免频繁读取总结一切引起元素位置改变的行为都会引起回流不会引起元素位置发生改变的行为称为重绘...
2022-03-27 13:26:27
1078
原创 从零开始学JavaScript-----事件循环
1、什么是事件循环它是在同步异步的基础上加入宏任务、微任务，异步任务分为宏任务和微任务。2、宏任务setInterval、setTimeout3、微任务es6的nextTick、promise.then链式4、宏任务和微任务执行顺序的问题由于js是单线程的，在执行事件的时候需要排队，这时候需要异步任务。宏任务在前、微任务在后（宏任务一定是在微任务全清的情况下执行）...
2022-03-27 13:16:27
222
原创 异步与同步
promise与异步Promise是异步编程的一种解决方案回调可以称异步。注意：Array上的那些函数，虽然需要回调函数，但它不是异步。所以这些不用Promise处理。1、同步(1)使用alert介绍同步阻塞(2)使用函数计算两个数的和调用后用变量接收2、异步常见的应用场景：(1)网络请求(2)读取文件(3)js中的事件函数就是非常典型的异步表现形式。异步的特点：①都有一个延迟时间②不影响其他代码运行同步和异步的区别：同步：没有回调，函数调用直接用等号赋值，如果程
2022-01-05 21:36:28
409
原创 1本地存储-----Cookie、LocalStorage
本地存储本地存储分为Cookie、 LocalStorage 与 SessionStoragelocalStorage 设置：localStorage.setItem(key, value) 读取：localStorage.getItem(key) 删除：localStorage.removeItem(key) cookie存储数据的一种方式（或者方案），达到保存状态。很大的概率是应用在登录成功以后（保存登录状态）保存状态的鼻祖就是cookie。localSto
2022-01-04 22:39:20
196
原创 JavaScript----继承
继承1、原型链继承 原型链继承：原型链继承就是将父类的实例对象赋值给子类的原型对象。 面试题：如何用一句话实现继承：将父的实例赋给子类的原型（一定要说，有不足）。 不足： 1、如果父类有引用类型，子类一改，会导致后续的都改了 2、子的constructor指向父类，这是不对的，应该指向自己的构造函数 2、对象冒充继承 对象冒充继承：在子类的构造函数中，调用父类的构造函数，并用call改this指向为子的实例 好处：解决了父类引用类型子类一改全改的问题
2022-01-03 11:12:42
337
原创 判断数据类型的方法
判断数据类型的方法数据类型分为两类：基本数据类型和引用数据类型①typeof只能判断出来基本数据类型，引用数据类型都返回object②instanceof可以判断出来引用数据类型，但是null是个特例null instanceof Object ----false③这个方法可以判断出所有数据类型Object prototype toString call（参数）.slice(8,-1)...
2022-01-03 11:10:10
239
原创 深拷贝与浅拷贝
目录如何实现深拷贝JSON.parse(JSON.stringify(xxx))（不能拷贝对象中的方法）递归的方法实现深浅拷贝ES6 新增 ... 展开方式实现深拷贝使用lodash工具库实现深拷贝深拷贝：将内存地址中存放的数据完整的克隆下来，放入到新开辟的内存空间中。浅拷贝：①拷贝基本数据类型：直接拷贝实体数据②拷贝复杂数据类型：只能拷贝引用地址，拷贝不到实体数据如何实现深拷贝JSON.parse(JSON.stringify(xxx))（不能拷贝对象中的方法）
2022-01-02 12:12:41
367
原创 express框架
目录简介安装及基本使用工具的使用nodemonRest Client路由中间件简介中间件的好处总结特点使用中间件简介Express是基于基于 Nodejs平台，快速、开放、极简的 Web 开发框架官网地址：Express - 基于 Node.js 平台的 web 应用开发框架 - Express 中文文档 | Express 中文网作用：使用 Express，我们可以方便、快速的创建 Web 网站的服务器或 API 接口(纯json数据)的服务
2022-01-01 10:29:15
212
原创 nodejs创建服务器步骤
1、引入http模块。这个模块是内置模块const http = require('http')2、http身上有个createServer() 函数 创建服务器的。const server = http.createServer() //得到 个服务器对象3、 兼听事件: 兼听用户发的请求事件server.on( 'request',function(req,res){ /* req:request简写。语法上只是一个形参而已，请求消息
2022-01-01 10:13:56
711
原创 HTTP基础总结
服务端和客户端请求：用户主动发起诉求处理：去找到相应的页面响应：找到页面返回给用户URL地址简单来说就是网址。URL（全称是Uniform Resource Locator）中文叫统一资源定位符，用于标识互联网上每个资源的唯一存放位置。浏览器只有通过URL地址，才能正确定位资源的存放位置，从而成功访问到对应的资源。通信协议就是规定 。你如何发请求（如何把诉求告诉服务器），以及如何响应（如何把结果返回给客户端）服务器名称网址（域名），在全世界没有重复的域名 。刚才我们说
2022-01-01 10:06:09
1144
原创 nodejs基础总结
目录Node简介Node.js的特点Node与JavaScript之间的区别文件操作文件夹操作其他关于node中出现的一些错误模块系统npm与包包管理工具npmpackage.json.gitignore的深刻含义包的分类Node简介Node.js是一个能够在服务器端运行JavaScript的开放源代码、跨平台JavaScript运行环境。Node.js主要用于编写像Web服务器一样的网络应用官网地址：Node.js中文官网：Nod
2022-01-01 10:01:49
202
原创 ES6基础知识总结
目录let和const命令字符串新增方法Symbol数据结构数组解构对象解构运算符箭头函数继承iterator迭代器let和const命令ES6新增的两个命令，用来声明变量let命令let命令的特点：①不存在变量提升和暂时性死区②不能重复声明③块级作用域在ES5中var 存在变量提升，有全局作用域和局部作用域const命令const特点和建议某些值，从始至终不会变，那么建议使用常量。const 声明常量 。一旦声明常量必
2022-01-01 09:57:21
125
原创 git介绍
目录git介绍git的三个区域git操作步骤git分支本地仓库文件上传到远程仓库git介绍git的三个区域工作区、暂存区、仓库区git操作步骤①使用git初始化项目②编写代码③把工作区添加到暂存区：git add .④把暂存区添加到仓库区 git commit -m 提交说明git分支使用步骤①先初始化git init②先在master上提交一次，主分支才会真正的存在③创建分支·：git branch 分支名④切换分支并且创建分
2022-01-01 09:55:01
190
原创 从零开始学JavaScript-----防抖和节流（debounce和throttle）
防抖：事件在函数执行过程中只执行了一次防抖分为两种：立即执行和非立即执行立即执行：事件一触发就执行一次，在函数执行的时间段，不在触发事件，如果触发，这个时间段无效非立即执行：事件触发后，在函数最后的时间执行一次防抖（使用了闭包和定时器）防抖的缺点：事件在不断被触发的时间段里，函数不会执行下面是一段防抖的代码 <h1>0</h1> <script> let h1 = document.querySelector('h1'
2021-12-26 21:19:25
407
原创 ES6--------为对象部署iterator接口
1、简介迭代、循环、遍历、递归等可以称为循环。Iterator是一种接口机制，为各种不同的数据结构提供统一的访问机制, 遍历器, 因为现在有Array / Object / Set / Map 4种结构, 所以ES6 加入了Iterator遍历器, 只要拥有这个Iterator遍历器, 就都可以使用for...of进行遍历2、iterator的作用 为各种数据结构，提供一个统一的、简便的访问接口 使得数据结构的成员能够按某种次序排列 ES6创造了一种新的遍历命令for.
2021-12-24 20:09:07
969
原创 nodejs------------------模块的种类
自定义模块：（开发者自己定义的模块，每一个js文件都可以称为一个模块）,开发者可以使用commonjs规范自己写的js文件，都称为自定义模块 内置模块：（由Node.js官方提供，如：fs、path、querystring等） 第三方模块：（由第三方开源出来的模块，使用前需要npm工具从npm社区下载） 1、自定义模块(1)如何定义数据和功能函数（如何定义公共代码）(2)外部如何使用定义的数据和功能函数1. 自定义模块 开发者自己写的模块，官方定义：每一个...
2021-12-24 16:18:52
552
原创 nodejs------------------文件夹操作
1、创建目录语法：fs.mkdirSync( path[,options] )参数说明：path：必选参数，要创建的文件夹完整路径名称options：可选参数，是否递归创建文件夹，{ recursive:true } true代表递归创建2、删除目录语法：fs.rmdirSync( path[,options] )3、读取目录语法：fs.readdirSync(path)参数说明：path：必选参数，要读取的文件夹的完整路径如果读取成功返回一个数组。
2021-12-24 14:31:44
706
原创 nodejs------------------文件操作
1、写入文件const fs = require('fs')fs.writeFileSync('demo/test1.txt','world\r\n',{ flag:'a' }) //第3个参数不写，默认为'w'2、读取文件// let result = fs.readFileSync('demo/test1.txt')// console.log( result.toString(),'读取的内容' ) //十六进制转换成字符串//读取json文件let result = fs
2021-12-24 10:30:56
91
原创 jQuery基础知识整理
1、class操作 jQuery元素.addClass('class名'); 添加 一次可以添加多个 jQuery元素.removeClass('class名'); 删除 一次可以删除多个 jQuery元素.toggleClass('class名'); 切换 如果有这个class，则删除，如果没有，则添加 jQuery元素.hasClass('class名'); 查找是否有，返回布尔值 2、css操作 jQuery元素.css('样式属性', '值'); /..
2021-12-13 17:36:35
561
原创 从零开始学JavaScript——JS增删改查（事件委托）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>D.
2021-12-04 21:53:37
465
原创 从零开始学JavaScript——JS阻止默认事件的方法
阻止默认事件的两种方法1、在发生函数最后加上return false2、ev.preventDefault();阻止默认事件的兼容 //阻止默认事件的兼容 function preventDefault(ev){ if(ev.preventDefault){ //标准模式 ev.preventDefault(); }else{ //
2021-12-04 21:14:54
1353
原创 从零开始学JavaScript——JS阻止冒泡的兼容及二级菜单
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.
2021-12-04 20:40:51
101
原创 从零开始学JavaScript——JS处理事件绑定兼容
封装一个函数，实现事件绑定的兼容与解绑的兼容<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0
2021-12-04 19:58:24
390
原创 （二）JS基础知识总结
目录第一天第二天第三天第四天第五天第六天第七天第八天第一天1、什么是JavaScript，有什么特点，作用是什么JavaScript 是一种具有面向对象能力的、解释型的程序设计语言。特点：解释性、基于对象、事件驱动、安全性、跨平台作用：验证发往服务器端的数据、增加 Web 互动、加强用户体验度2、JavaScript数据类型有哪些？基本数据类型：Number String Boolean Null Undefined引用数据类型 ：Obje
2021-12-04 16:17:49
211
原创 从零开始学JavaScript——js数组去重的三种方法
1.通过indexOf查找数组下标的方式去重，如果返回值等于负一，则证明新数组中没有这个数，添加进来。var arr1 = [1, 2, 33, 2, 2, 1, 1, 4, 4]; var arr2 = ['a','b','b','c','c','s','s','d','f','d']; function array(arr) { var newArr = [];//存储去重后的新数组 for (var i = 0; i
2021-12-04 11:04:19
518
原创 从零开始学JavaScript——JS对象方法总结
目录扩展原型上的方法扩展数组的indexOf方法，兼容IE8及以下1、字面量方法2、实例创建3、工厂模式创建对象4、创建对象-构造函数5、创建对象-原型方法6、混合模式创建对象7、创建对象-动态混合扩展原型上的方法扩展String.prototype.trim这个方法，让它兼容IE8及以下 if (!String.prototype.trim) { String.prototype.trim = function () {
2021-12-03 23:56:04
103
原创 排序算法（选择排序，冒泡排序，快速排序）
目录1、选择排序2、冒泡排序3、快速排序1、选择排序从第一项起，每一项都和后面所有项依次比较，如果被比较项比当前项小，则两项交换位置。每一轮，都找到一个最小的数，放到前面。var arr = [5, 32, 2, 7, 45];console.log(fn(arr));function fn(arr) { for (var i = 0; i < arr.length - 1; i++) { for (var j = i + 1; j ...
2021-12-03 17:36:47
407
原创 （一）JS基础知识总结
目录1、new 操作符具体干了什么呢?2、JavaScript 对象的几种创建方式？3、JavaScript 原型，原型链？4、什么是回调函数，作用是什么？5、什么是闭包，闭包有什么作用，说说你对闭包的理解。6、分别解释防抖节流。7、call 和 apply 的作用和区别？1、new 操作符具体干了什么呢?(1) 创建一个新对象；(2) 将构造函数的作用域赋给新对象（因此 this 就指向了这个新对象）；(3) 执行构造函数中的代码（为这个新对象添加属性）；(4
2021-12-03 17:14:51
186
原创 从零开始学JavaScript——JS拖拽三大事件
说到拖拽，我们要知道的三大事件onmousedown（鼠标按下选择元素） onmousemove（按住鼠标移动元素） onmousedown(鼠标松开释放元素)接下来我们来看一个小案例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
2021-12-01 17:08:37
1673
原创 JS添加表格
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> #form { width: 480px; margin: 30px auto; border: 1px solid #eee; .
2021-11-27 09:07:40
1234
原创 从零开始学JavaScript——数据渲染（用js在页面制作一个表格）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.
2021-11-27 09:06:11
708
原创 js小案例总结
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.
2021-11-26 23:19:49
198
原创 从零开始学JavaScript——DOM与表单操作
目录一、获取节点1、子节点2、节点基本属性3、父节点4、其他节点二、操作节点1、创建节点2、追加节点3、插入节点4、删除节点5、替换节点6、克隆节点三、表单操作1、获取表单元素2、表单事件3、表单方法4、得焦失焦5、input事件6、change事件一、获取节点1、子节点 父级.children：返回元素节点（在IE8及以下，会返回注释节点，在IE9及以下，正常返回） 父级.childNodes：在IE9
2021-11-26 20:09:20
281
原创 数组的迭代方法与正则
目录一、数组的迭代方法1、forEach2、map3、filter4、every5、some6、find和findIndex二、正则1、写法2、修饰符3、正则的方法testexecmatchsplitreplacesearch4、正则相关实例一、数组的迭代方法1、forEach// 数组.forEach(function (item, index, array) { });// 接收一个函数做为参数，该函数有三个参数
2021-11-26 19:56:06
244
原创 定时器的总结
1.setTimeout超时定时器，延迟执行，延迟某个特定的时间开始执行，只执行一次作用：一般用于咨询弹框、网站广告弹窗等相关操作 设置定时器：var 定时器引用 = setTimeout(函数, 时间毫秒); 清除定时器：clearTimeout(定时器引用) 2、setInterval间歇定时器，间歇执行，即隔某个时间就执行一次作用：一般用于轮播图、倒计时、抽奖等相关操作 设置定时器：var 定时器引用 = setInterval(函数, 时间毫秒);
2021-11-26 19:44:33
296
原创 HTML，CSS书写规范
css书写规范书写代码前确认版心（页面有效区） 考虑样式表规划，提高样式重复使用率 提前沟通页面中模棱两可的需求和交互效果，方便后续合理布局
2021-11-11 16:23:02
357
原创 js倒计时
倒计时原理1.未来时间 - 当前时间 = 毫秒数2.将毫秒数转换成：xx天xx小时xx分钟xx秒<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=d
2021-11-10 09:14:06
60
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人