04 2020 档案
摘要：HTTP协议发展历程 超文本传输协议是一个用于传输超文本文档的应用层协议，它是为 浏览器与 服务器之间的通信而设计的， 协议到目前为止全部的版本可以分为 、`HTTP 1.0 HTTP 1.1 HTTP 2.0 HTTP 3.0 HTTP 1.1 HTTP 2.0 HTTP 3.0`版本。 HTTP
阅读全文
摘要：Js箭头函数 箭头函数是 新增的语法，提供了一种更加简洁的函数书写方式，类似于匿名函数，并且简化了函数定义。 完整写法 完整写法类似于匿名函数，省略了 关键字。 省略小括号 当参数只有 个时，可以省略小括号，当没有参数或者两个以上的参时不能省略小括号。 省略大括号 当函数体只有一行语句时，可以省略
阅读全文
摘要：RESTful架构与RPC架构 在 架构中，关注点在于资源，操作资源时使用标准方法检索并操作信息片段，在 架构中，关注点在于方法，调用方法时将像调用本地方法一样调用服务器的方法。 RESTful架构 即表述性状态传递 ，是一种软件架构风格，也可以称作是一种设计 的模式， 通过 协议定义的通用动词方法
阅读全文
摘要：CSS3新特性 CSS3是最新的CSS标准，旨在扩展CSS2.1。 圆角 通过border-radius属性可以给任何元素制作圆角。 border-radius: 所有四个边角border-*-*-radius属性的缩写。 border-top-left-radius: 定义了左上角的弧度。 bor
阅读全文
摘要：YOLOV3目标检测 从零开始学习使用 进行图片的目标检测，比较详细地记录了准备以及训练过程，提供一个信号灯的目标检测模型训练实例，并提供相关代码与训练集。 DEMO测试 提供了模型以及源码，首先使用 训练好的权重文件进行快速测试，首先下载权重文件 将 的版本库 到本地，本次测试的 为`e6598d
阅读全文
摘要：HTML5新特性 HTML5是下一代HTML标准，是HTML最新的修订版本，2014年10月由万维网联盟W3C完成标准制定，HTML5将HTML从用于构造一个文档的一个简单标记，到一个完整的应用程序开发平台，HTML5还包括新元素和用于增强存储、多媒体和硬件访问的JavaScript APIs。 新
阅读全文
摘要：Js严格模式 JavaScript严格模式strict mode，即在严格的条件下运行。严格模式消除了Javascript语法的一些不合理、不严谨之处，减少一些怪异行为；消除代码运行的一些不安全之处，保证代码运行的安全；提高了引擎的效率，增加运行速度；为未来新的Js版本做好铺垫。 实例 针对整个脚本
阅读全文
摘要：浏览器页面呈现过程 从输入链接到浏览器呈现页面的过程中，浏览器所经历的过程。 DNS解析 首先浏览器将输入的链接进行DNS解析，也就是将域名转换为IP地址的过程，得到了服务器具体的IP地址，才可以进行TCP链接以及数据的传输。 具体DNS解析的过程，浏览器首先检查自身的DNS缓存是否对于此域名有IP
阅读全文
摘要：Function与Object JavaScript中内置了两个顶级对象Function、Object，Object是所有对象的基类，而所有的构造函数同时又是Function对象的实例。 Object JavaScript中的所有对象都来自Object，所有对象从Object.prototype继承
阅读全文
摘要：前端性能优化方案 前端资源比较庞大，包括HTML、CSS、JavaScript、Image、Flash、Media、Font、Doc等等，前端优化相对比较复杂，对于各种资源的优化都有不同的方式，按粒度大致可以分为两类，第一类是页面级别的优化，例如减小HTTP请求数、脚本的无阻塞加载、内联脚本的位置优
阅读全文
摘要：CSS引入方式 将CSS作用到HTML主要有四种方式，分别为HTML元素添加内联样式、<style>标签嵌入样式、<link>标签引入外部样式、@import导入外部样式。 内联方式 <div style="color: red"></div> 特点 不需要额外的HTTP请求。 适合HTML电子邮件
阅读全文
摘要：浏览器事件 常用浏览器事件与DOM事件，包括鼠标事件、键盘事件、框架/对象事件、表单事件、剪贴板事件、打印事件、拖动事件、多媒体事件、动画事件、过渡事件。 浏览器事件 加载相关 onbeforeunload: 该事件在即将离开页面（刷新或关闭）时触发。 onload: 文档加载完成后触发。 onun
阅读全文
摘要：Js继承的实现方式 继承是面向对象软件技术当中的一个概念，与多态、封装共为面向对象的三个基本特征。继承可以使得子类具有父类的属性和方法或者重新定义、追加属性和方法等。 原型链继承 通过将子类的原型对象指向父类的实例，实现继承访问父类属性方法等。 // 定义父类 function Parent(){
阅读全文
摘要：Js数组操作 JavaScript数组操作，主要包括Array对象原型方法以及常用操作如去重、扁平化、排序等。 Array.prototype forEach arr.forEach(callback(currentValue [, index [, array]])[, thisArg]) cal
阅读全文
摘要：TCP与UDP异同 TCP/IP模型的运输层有两个不同的协议：UDP用户数据报协议与TCP传输控制协议。 相同点 TCP与UDP都是运行在运输层的协议。 TCP与UDP的通信都需要开放端口。 不同点 TCP TCP是面向连接的协议，提供全双工通信，需要建立链接之后再传输数据，数据传输负载相对较大。
阅读全文
摘要：Js异步机制 JavaScript是一门单线程语言，所谓单线程，就是指一次只能完成一件任务，如果有多个任务，就必须排队，前面一个任务完成，再执行后面一个任务，以此类推。这种模式的好处是实现起来比较简单，执行环境相对单纯，坏处是只要有一个任务耗时很长，后面的任务都必须排队等着，会拖延整个程序的执行。常
阅读全文
摘要：Canvas基础 HTML5中引入<canvas>标签，用于图形的绘制，<canvas>为图形的绘制提供了画布，是图形容器，具体的图形绘制由JavaScript来完成。 实例 <!-- 绘制冒泡效果 --> <!DOCTYPE html> <html> <head> <title>Canvas</t
阅读全文
摘要：SVG基础 SVG可缩放矢量图形Scalable Vector Graphics是基于可扩展标记语言XML，用于描述二维矢量图形的一种图形格式。SVG严格遵从XML语法，并用文本格式的描述性语言来描述图像内容，因此是一种和图像分辨率无关的矢量图形格式，SVG于2003年成为W3C推荐标准。 示例 <
阅读全文
摘要：作用域与作用域链 通常来说，一段程序代码中所用到的名字并不总是有效或可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域scope，当一个方法或成员被声明，他就拥有当前的执行上下文context环境，在有具体值的context中，表达式是可见也都能够被引用，如果一个变量或者其他表达式不在当前
阅读全文
摘要：TCP三次握手 传输控制协议TCP，Transmission Control Protocol是一种面向连接的、可靠的、基于字节流的传输层通信协议，其是运行在OSI七层模型中的运输层，为了在不可靠的互联网络上提供可靠的端到端字节流而专门设计的一个传输协议。 三次握手 过程 client server
阅读全文
摘要：let与const ES2015(ES6)新增加了两个重要的JavaScript关键字: let和const。 块级作用域 代码块内如果存在let或者const，代码块会对这些命令声明的变量从块的开始就形成一个封闭作用域。 { let a = 1; var b = 2; function s(){r
阅读全文
摘要：Js模块化导入导出 CommonJs、AMD、CMD、ES6都是用于模块化定义中使用的规范，其为了规范化模块的引入与处理模块之间的依赖关系以及解决命名冲突问题，并使用模块化方案来使复杂系统分解为代码结构更合理，可维护性更高的可管理的模块。 CommonJS CommonJS是NodeJs服务器端模块
阅读全文
摘要：分布式SESSION一致性 SESSION是服务器为客户端创建的一个会话，存储用户的相关信息，用以标识用户身份等。在单服务器环境下是不需要考虑会话的一致性的问题的，但是在集群环境下就会出现一些问题，假如一个用户在登录请求时负载均衡到了A服务器，A服务器为其分配了SESSION，下次请求数据时被分配到
阅读全文
摘要：JSON WEB TOKEN JSON WEB TOKEN简称为JWT，是一个基于JSON的开放标准，用于通信双方之间传递安全信息的简洁的、URL安全的表述性声明规范，经常用于身份验证。 结构 JWT有三部分组成，他们之间用.分隔，这三部分分别是Header、Payload、Signature，结构
阅读全文
摘要：Table布局 <table>最常用的也是最正确的使用方法是制作表格，由于其对占据的空间有着划分的作用，便可以使用<table>来布局。 实例 实现一个简单的布局，将表格的border、cellpadding、cellspacing全部设置为0，表格的边框和间距就不占有页面空间，它只起到划分空间的作
阅读全文
摘要：Grid布局 目前CSS布局方案中,网格布局可以算得上是最强大的布局方案了。它可以将网页分为一个个网格，然后利用这些网格组合做出各种各样的布局。Grid布局与Flex布局有一定的相似性，都可以指定容器内部多个成员的位置。不同之处在于，Flex布局是轴线布局，只能指定成员针对轴线的位置，可以看作是一维
阅读全文
摘要：使用三种方式实现轮播图功能，分别为js控制切换与动画，js控制切换与css控制动画，纯css实现轮播效果
阅读全文
摘要：Flex布局 Flex布局也称弹性布局，可以为盒状模型提供最大的灵活性，是布局的首选方案，现已得到所有现代浏览器的支持。 基础 通过指定display: flex来标识一个弹性布局盒子，称为FLEX容器，容器内部的盒子就成为FLEX容器的成员，容器默认两根轴线，水平的主轴与垂直的交叉轴，主轴的开始位
阅读全文
摘要：Js选择器 JS选择器常用的有getElementById()、getElementsByClassName()、getElementsByName()、getElementsByTagName()、querySelector()、querySelectorAll()。 getElementById
阅读全文
摘要：Js中==与 JavaScript中提供==相等运算符与 严格相等运算符，建议是只要变量的数据类型能够确定，一律使用 ，各种类型的值的比较可以参考Js真值表 ==相等运算符 ==在判断相等时会进行隐式的类型转换， 其比较遵循一些原则，即先转换类型再比较。 如果有一个操作数是布尔值，则在比较相等性之前
阅读全文
摘要：Generator函数 生成器generator是ES6标准引入的新的数据类型，一个generator看上去像一个函数，但可以返回多次，通过yield关键字，把函数的执行流挂起，为改变执行流程提供了可能，从而为异步编程提供解决方案。 方法 Generator.prototype.next()：返回一
阅读全文