- 博客(14)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 浏览器中的Event Loop
我在学习浏览器的Event Loop时看了大量的文章，那些文章都写的很好，但是往往是每篇文章有那么几个关键的点，很多篇文章凑在一起综合来看，才可以对这些概念有较为深入的理解。于是，我在看了大量文章之后，想要写这么一篇博客，不采用官方的描述，结合自己的理解以及示例代码，用最通俗的语言表达出来。希望大家可以通过这篇文章，了解到Event Loop到底是一种什么机制。如果在文中出现书写错误的地方，欢迎大家留言一起探讨。Event Loop是什么？event loop是一个执行模型，在不同的地方有不同的实现。
2021-05-15 17:24:20
284
原创 js中的浅拷贝与深拷贝
Js中数据类型分原始数据类型与引用数据类型。原始数据类型：布尔类型、Number、String、Nul、Undefine、Symbol引用数据类型:Function、Date、Object、Array、正则1、 按值传递与按址传递。Js中一种数据类型一旦被定义，计算机会分给变量一块地址。计算机内存中原始数据类型是按值传递的，定义一个变量 var a=666,内存地址直接将数值666放在内存地址中，并且直接将数值赋值给变量a;引用数据类型是按址传递的，顾名思义，址指的是地址，如定义变量
2021-05-12 00:03:24
131
1
原创 localtunnel实现内网穿透
1. 内网穿透是什么？对于前端领域的同学来说，指在公网上访问到部署在本地的服务器上的项目。应用场景：前端同学在公司内网部署了一个项目，老板在外出差想访问我在本地的一个项目，这时候百年可使用内网穿透，使用公网访问本地启动的服务。2. 工具localtunnel生成唯一可在公网访问的url,该url会代理本地运行的web服务请求,localtunnel是部署在国外的，访问比较满。优势：部署方便，不需要部署测试环境，为了方便向世界暴露你的项目，而且修改起来也是很方便。3.使用方法全局安装localt
2021-05-09 23:11:27
1691
原创 计算机网络中的OSI模型
为什么要了解OSI七层模型？对于前端领域得同学来说，了解计算机网络计算显得尤其重要，无论是应付面试，还是在技术领域做架构设计都是有用的，下面逐一介绍哪7层模型。应用层作用：提供高级API，定义了网络主机提供的方法和接口(业务协议，高级协议等)。应用层往往对应用户行为，最常见的http协议。区别与像王者荣耀这种应用，这种只是应用，并非是计算机网络中的应用层，应用层应是中协议。展示层（通常也被称作语法层）作用：展示层一般将应用层的数据转化为传输格式，保留语义，例如序列化、加密协议，字符串编码解码，例
2021-04-13 23:41:31
202
原创 React中的css
react开发中组件时，当样式比较简单时，可是使用内联样式写，如<div style={{color:'red'}}></div>去描述你的样式。当react项目比较庞大，组件繁琐时采用内联样式显得不适合，这部我们会想到外部样式。react中的外部样式像写css工程一样，定义一个css样式文件，在组件中import引入写好的样式。 // text.css文件如下 .text1{color:red} .text2{color:green}将css文件引入你的组件工程，如在
2021-01-11 22:09:57
1889
4
原创 react开发的工具及插件
工欲善其事，必先利其器，为了方便开发react项目，先做好准备工作。脚手架下载react工程使用名命令行下载react-cli,执行以下命令并运行整个项目工程（你的电脑需要安装node）。 npm install -g create-react-app create-react-app my-app cd my-app npm run start安装插件推荐两款好用的插件，其他插件可根据喜好和需要自行安装。Simple react snippets -----简单的命令生成react项
2020-12-21 23:16:59
374
原创 提高代码可扩展性之适配器模式
工作过程中，需求变更，接口改变使常有的事。为了既不影响原有接口方法，又要实现变更的需求，可以采用一些设计模式提高代码的可扩展性。总结一下，可扩展性有这么几个特点：1、需求变更不需要重写。2、代码修改不会引起大规模的变动。3、方便加入新的模块。适配器模式...
2020-09-15 23:30:30
363
1
原创 提高代码复用性之模板方法模式
桥接模式同享元模式、桥接模式一样，主要使为了提高项目中的代码的复用性，从而提高代码质量。桥接模式目的：定义一系列操作的骨架，简化后面类似的操作。当一个功能朝着多样化发展，不妨定义一个基础的模块，把具体实现功能延申到后面。好比建房子，先给出一套基本的房子骨架，房主可以根据自己的需求实现自己想要的房子类型。应用场景：当项目中出项很多个类似的操作。相同的操作一个类又满足不了要求，多个类又显得代码冗余，这时桥接模式就能排上用场。如项目中的弹框操作，有相同的基本操作功能，如弹框的弹出隐藏。又有不一样的地方，每
2020-07-23 00:05:15
202
原创 提高代码可复用性之桥接模式
桥接模式为了提高代码质量，优化代码，js代码中也常用使用桥接模式优化。目的：通过桥接模式代替耦合。通过独立方法间的桥接来形成整体功能，这样每个方法都可以被高度复用。应用场景：减少模块之间的耦合度。项目中可根据具体需求，看是否可以用桥接模式去优化你的代码。下面根据一个小的业务需求介绍使用桥接模式的优点。实例：创建多个dom,并给每个dom绑定鼠标移入移出事件。言简意赅，下面直接搬出不使用桥接模式的命令式编程。function menuItem(word) { this.word = "";
2020-07-15 23:52:05
988
原创 提高代码可复用性之享元模式
好的项目的代码具有很高的复用性，高复用低耦合是好代码的体现。什么样的代码具有高复用？高复用的代码具有以下三个特点：1.对象可以使用不用修改。2重复代码少。3模块功能单一。下面结合具体功能代码总结js中提高代码质量的设计模式——享元模式。享元模式目的：减少对象或者代码数量。设计方法：观察代码中共有和私有的部分，提取共有部分和私有部分，私有部分作为外部数据传递，从而减少开发代码中对象的数量。应用场景：当代码中创建了大量类似的对象和类似的代码块。结合自己开发过程中的代码来谈谈感悟。比如要项目开发文件上传
2020-07-13 21:49:20
1470
2
原创 js实现防抖与节流实现原理
本章主要介绍什么是防抖与节流、怎么实现防抖与节流、防抖与节流在实际开发中得作用。防抖函数防抖：当持续触发事件时，一定时间内再没有触发事件，事件处理函数才会执行一次，如果设定时间到来之前，又触发了一次事件，就得重新开始延时。为什么要做防抖？在前端开发过程中，resize，scoll，mousemove，mouseover等事件会被频繁频繁得触发，如果不做限制，1s得时间内有可能执行上百次，甚至...
2020-03-20 14:59:32
449
1
原创 js实现复合函数
在數學中，複合函數（英語：function composition）是指逐點地把一個函數作用於另一個函數的結果，所得到的第三個函數。例如，函數 f : X → Y 和 g : Y → Z 可以複合，得到從 X 中的 x 映射到 Z 中 g(f(x)) 的函數。直觀來說，如果 z 是 y 的函數，y 是 x 的函數，那麼 z 是 x 的函數。得到的複合函數記作 g ∘ f : X → Z，定...
2020-03-20 11:05:58
824
原创 js实现单元测试
什么是单元测试？测试是一种验证我们代码是否可以按预期工作的方法，换种说法就是写些代码来验证一段代码的正确性，被测试的对象可以是样式、功能、流程、组件等。单元测试是对软件中最小可测试单元进行检测和验证。单元测试能有效的提升工作效率：1能监测出潜在的bug,2能快速反馈功能的输出，3能保证代码重构的安全性，4能方便协同开发。如和能写出最简单的单元测试代码？被测对象单元如：let add=(a,b...
2020-03-13 16:46:59
2622
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人