- 博客(62)
- 收藏
- 关注
RSS订阅原创 ECMAScript新特性的前世今生
ECMAScript概述ECMAScript 是脚本语言的标准化规范，也就是语言的语法。比如：怎样定义变量、怎样定义函数和逻辑运算等等。那么ECMAScript 和 JavaScript 是何关系？JavaScript 是ECMAScript 的扩展语言，比如在浏览器环境中 JavaScript 就是 ECMAScript 和 WebAPI的集合ES（ECMAScript）于1997年被提出，2015年后基本保持一个版本的迭代名称标准版本发布时间ECMAScript201
2022-12-04 19:38:41
689
原创 Node.Js基础知识
V8libuv第三方模块：c-ares(DNS)、http（parse）、zlib主流后端语言处理多任务的时候，通常是开多线程。但是当任务量比较少时，线程就会浪费（服务员例子）。因此出现了 Reactor模式（应答者模式），单线程完成多线程工作。可以避免多个线程在上下文切换过程中考虑的状态保存、时间消耗、状态锁。因此：NodeJS 更适合用于IO密集型高并发请求同步时间：= 任务一 + 任务二异步时间：< 任务一 + 任务二异步IO内部会 轮询 IO 状态，重复调用IO操作，判断IO是否结束。
2022-12-03 19:46:42
853
原创 执行上下文和闭包
使用闭包可以突破变量作用域的限制，原来只能从一个作用域访问外部作用域的成员，有了闭包之后，可以在外部作用域访问一个内部作用域的成员。通过var 定义的变量都会存储到 Global 中，通过let、const 定义的变量会到Script 中。通过打印可知，闭包是函数定义时就存在，不是函数执行时才存在。函数执行阶段可分为2个：函数建立阶段、函数执行阶段。当调用函数时，还未执行函数内部代码。根据不同参数生成不同功能的函数。这里重点讲函数上下文。
2022-12-02 23:25:41
279
原创 勾勾-MIAN
JS的执行环境是单线程的，一次只能执行一个任务，多任务需要排队等候，这种模式可能会阻塞代码，导致代码执行效率降低。浏览器为了让JS 内部宏任务 与DOM 操作有序的执行，会在一个宏任务执行结束后，在下一个宏任务执行之前，对页面进行重新渲染。一开始整个脚本作为一个宏任务执行，执行过程中同步代码直接执行，宏任务等事件到达或者成功后，将方法的回调放入宏任务队列中，微任务进入微任务队列中。当前主线程的宏任务执行完出队，检查并清空微任务队列，接着执行浏览器的UI线程的渲染工作。然后再取出一个宏任务执行。
2022-11-29 11:20:28
520
原创 Generator异步方案
Generator 函数 是一种懒函数，相比普通函数而言，前面多个 *，但是使用起来大不同。首先先创建generator 实例，然后调用next 方法，让函数进行运行。会返回当前yield后的值 和 generator实例状态。当我们通过next 传值时，会将值赋给 上个yield 的结果并且返回下一个yield后的值。通过generator.throw() 方法主动抛出异常使用Generator 函数构造异步函数生成器方法封装上边方法有个局现性，要手写各种情况，不智能啊，可以用递归解决
2022-11-26 10:08:10
336
原创 请求跨域问题
这种方案对于前端来说没有什么工作量，和正常发送请求写法上没有任何区别，工作量基本都在后端（其实也没啥工作量，就是配置一些 HTTP 协议）在生产环境中需要配置生产服务器（比如 nginx、Apache 等）进行反向代理。在本地服务和生产服务配置代理的原理都是一样的，通过搭建一个中转服务器来转发请求规避跨域的问题。在开发模式下可以下使用开发服务器的 proxy 功能，比如 vite - server.proxy]可能有些后端开发人员觉得配置 CORS 麻烦不想搞，那纯前端也是有解决方案的。
2022-11-19 23:49:39
498
原创 axios须知
result : 是axios 包装后的对象，有请求参数config, 状态status 等等一些附加值，其中 data 就是 后端返回给前端的值（status, msg, data），只不过 data 中又把真实数据包裹了一层。为啥获取我们自己的数据还要 response.data.data?而不是 response.data？Axios 是一个基于 promise 的网络请求库，可以用于浏览器和 node.js。但是有时候我们是不是 在获取到数据时，有这样的疑问？
2022-11-19 15:52:05
371
原创 Git commit message规范
在团队开发中，提交代码内容说明，如果没有规范，那么我们如果想找历史版本就很难。如果有规范，团队中有人偷懒怎么办？那我们就要借助一些工具，做一些强制规定通常情况下，我们一般会遵循，这是目前使用最广的写法，比较合理和系统化，并且有配套的工具。
2022-10-25 19:48:57
565
原创 在开发构建中体现代码规范
我们在开发过程中，虽然VScode 的ESlint 在文件中把不符合规范的代码标注出来，并且使用来校验代码是否规范。但是能够在我们开发过程中实时进行校验？这个问题是有的，Vite官方现在给我们推荐了一个插件：```@nabla/vite-plugin-eslint``,可以在我们运行代码时 实时检查更改的文件是否有不符合的代码。
2022-10-25 07:50:09
197
原创 带你深入了解vscode-eslint插件
就会提示我们有哪些问题。这样就会有个问题，如果我们写了很多代码，当我们想提交时再去验证，如果发现一堆问题，估计我们内心也是万马奔腾。那么能不能当我们写代码那一时刻就提示我们说代码可能有问题？因此ESLint 插件就可以搞定。这个问题估计大多数人都知道，在我们写代码时每一个人的风格都不一样，有时候还会写错语法，那么如果提交到代码仓库，同组小伙伴估计要口吐芬芳了。eslint 就为我们提前先检查一下代码是否有风险。在聊ESlint 插件之前我们先聊聊eslint .
2022-10-22 23:02:40
1935
原创 前端神库lodash
在前端业务中，适当使用方法库可以让我们省去好多劳动力和bug,lodash 就是我比较喜欢使用的函数库，在实际应用中，只要用它。
2022-10-22 15:35:40
581
原创 JS函数组合
h(g(f(x)))例如：获取数组的最后一个元素再转换成大写字母,函数组合可以让我们写出这样嵌套的代码下面这张图表示程序中使用函数处理数据的过程，给 fn 函数输入参数 a，返回结果 b。可以想想 a 数据通过一个管道得到了 b 数据。当 fn 函数比较复杂的时候，我们可以把函数 fn 拆分成多个小函数，此时多了中间运算过程产生的 m 和 n。
2022-10-22 10:47:04
582
原创 函数柯里化
在调用函数，上述代码中。我们如果我们知道最小值是60，没次都传递是不是有点重复，怎样办？是不是我们可以将 min先存起来，是不是大聪明有点想法了，对滴，闭包对于上面的例子，其实用到一个专有名词就是函数柯里化。当一个函数有多个参数时，我们可以先传递一部分（这部分参数后面不会变化），然后然后返回一个函数接受剩余参数，返回结果。上述例子有很大的局限性，柯里化后的函数并不通用，在lodash库中提供了柯里化的函数。
2022-10-22 09:21:07
247
原创 javaScript之展开语法（...）之妙用
展开语法（…） 可以在函数调用/数组构造时，将数组表达式或者 string 在语法层面展开；还可以在构造字面量对象时，将对象表达式按 key-value 的方式展开。
2022-10-22 00:31:01
403
原创 心怀洒脱，面带坦然
随着社会节奏的加快，人心变得浮动和焦躁，在大街上我们可以看到形形色色的人，有脚步匆忙，有慢慢悠悠，有心情愉悦，也有嚎啕大哭的人各种心情是不分年龄的，有的人年纪一大把，但是思维还像个小孩。有的人虽然年龄很小，但是经过社会的打磨，变得十分老练。在我们处理事情时，我们的有的人，狂妄不羁，有的人小心翼翼，有的人无所谓有的人因为太考虑得失，满心畏惧心怀恐惧，会让我们觉得自己很可怜，但是可怜之人必有可恨之处。...
2021-10-18 21:44:49
155
原创 番茄鱼（私家菜）
个人非常喜欢吃鱼和番茄，将两者结合在一起的番茄鱼，营养美味又健康。用料黑鱼、番茄、番茄酱、蛋清、葱、姜、辣椒、花椒、柠檬、番茄、料酒、蚝油、胡椒粉、淀粉、准备工作鱼骨和鱼片分别加1小勺盐和、葱姜、料酒抓捏去腥使用清水将鱼片和鱼骨冲洗至水清，多冲洗几遍，可以去腥将鱼片的水分挤干在鱼片中加入1个蛋清、一勺盐、10克料酒、适量辣椒段和适量胡椒粉，向同一方向搅拌均匀加入1勺淀粉，搅拌至粘稠，将鱼片腌制20分钟左右准备两个番茄十字滑刀，将番茄在开水中烫一分钟，去皮，切小丁准备葱和姜切断烹饪
2021-09-24 13:44:20
164
原创 vConsole-手机网页调试神器
最近在做一个H5的项目，需要将项目嵌入到浙里办里，需要调用浙里办的API（定位和扫一扫）功能，但是并没有很好的调试工具，虽然有个政务中台调试工具，但是只能调试返回参数，这我看文档也能知道啊。想着能不能在开发的时候，通过手机直接调试，就发现了这个神器：vConsole,一个轻量、可拓展、针对手机网页的前端开发者调试面板。...
2021-09-15 20:03:56
1625
原创 茶道学习了解
茶分类：目前主要的茶叶分类，根据茶叶的工艺和品质再此基础上，再加工形成认识六大茶叶绿茶茶叶形状红茶物质转变乌龙茶黄茶白茶黑茶茶叶的选购1.无浑浊如何辨别分辨真假高山茶 && 平地茶茶的储存绿茶和半发酵茶黑茶储备绿茶名茶荟萃
2021-09-12 16:43:40
124
原创 你所不知道的v-bind用法
v-bind指令大家一定很熟悉，簡單來講就是給組件綁定屬性，但是 大家是不是很多少用到綁定對象，有人說，設置class 時我就是綁定對象，你說的很對，但是不是我想說滴參考資料v-bind
2021-09-11 10:59:59
1262
原创 ES6_class必知知识
在ES6 之前，我们实现类大部分是通过 构造函数 和 继承 的方式来实现。在ES6之后，出现class关键字，可以让我们快实现类，今天我们先不管class内部实现，先学习一下语法方面的知识。下面我们实现一个最简单的类 和 实例：class Point { constructor(x, y) { this.x = x; this.y = y; } play() { console.log("我会玩") }}let p
2021-09-05 17:00:33
109
原创 获取树数据的本级和子级
在我们做项目期间，肯定会遇到根据登录权限或一些限制 来处理树类型数据的场景，本文介绍 如何根据条件获取自己 和 子级数据。假如原始数据为：let originTrerData = [{ code: "330000", name: "浙江省", children:[ { code: "330100", name: "杭州市", children:[ { code: "330101", name: "上城区" }, { co
2021-09-05 15:41:17
478
原创 in Vs hasOwnProperty 判断属性是否存在
在原型继承过程中，会遇到一个问题是，某个属性是对象本身的 还是 继承下来的那 ？ 如果有哪位同学对原型链知识有点遗忘，可以点击原型链这样还搞不懂，拿砖拍你自己吧，别拍我查看一波。in 关键字in 关键字用来判断对象的自有属性和继承来的属性是否存在function Foo() { this.name = "胡三疯";}Foo.prototype.nationality = "中国"let foo = new Foo()console.log('name' in foo) // tr
2021-09-05 14:10:20
280
原创 原型链这样还搞不懂，拿砖拍你自己吧，别拍我
很多初学者接触原型链总以为很难，很高大上，其实不然，只要是搞懂几个属性，原型链就可明明白白的理解构造函数当我们创建 对象时，我们需要定义构造函数。构造函数 有什么特殊吗？然而并没有，就是普通的函数，只不过是我们人为的将首字母变为大写。当我们创建对象时，在执行构造函数前 加 new后得到 对象实例,这时候就有 原型链的 故事了。function Foo(name) { this.name = name; this.nationality = "中国"}let foo = ne
2021-09-04 19:42:28
146
原创 一文了解函数组合
前言当一个功能由多个函数嵌套实现时，就会写出类似洋葱形式的代码：h(f(g(x)))个人并不认为，洋葱形式代码有什么不好，但是如果层数太深，估计维护代码人员就要骂娘喽相比较洋葱形式代码，有一种类似管道形式的代码,在组合函数和复用细粒度函数方面，可能更有优势...
2021-08-31 21:31:20
295
原创 一文搞懂函数柯里化
啥子是柯里化函数柯里化 是根据老外的名翻译而来，个人认为应该叫 参数颗粒化更合适一些。举一个小栗子，写一个是否成年 的函数，如下function exceedLevel(level, age) { return level < age;}console.log(exceedLevel(18, 20));console.log(exceedLevel(18, 30));console.log(exceedLevel(18, 12));上边的代码每次都要传递参数 18，是不是有点烦
2021-08-26 23:32:08
564
原创 编程中常见英语
在 编程中 我们是不是经常碰到两种比较尴尬的情况：查看英文api 时傻傻看不懂 或阅读困难在编程过程中，定义变量时抓耳挠腮在编程中的英语含义，有时候和通用含义不太一样，这里叫 编程英语吧，本篇会总结在编程过程中经常碰到的英语单词 和 含义，持续更新~~accept 接收arguments 参数invoke 调用 例子：invoke function – 调用函数remaining 剩余的...
2021-08-26 22:21:41
472
原创 想学webpack，篇就够了
模块化打包工具webpack是前端模块化打包工具的一种，那为什么需要模块打包工具？主要是以下几个原因：ES Module存在环境兼容问题。虽然大部分浏览器兼容ES Module规范，但是还有一些浏览器器不兼容，可能一些新的特性浏览器并不会兼容。模块文件过多，网络请求频繁所有资源也应该进行模块化基于以上这些问题，那么需要一个工具既能让开发者在开发环境享受模块化带来的优势，又不必担心模块化对生产环境的影响。那么这个工具最起码能够实现以下几个目的：将ES Module各种特性转化为浏览器都能兼容的
2021-08-26 22:06:11
175
原创 函数式编程
前言最先了解函数式编程是从React开始的，后面Vue3 出现Composition API，使用之后发现函数式编程是真香，感觉这种编程范式跟有利于代码的组织和维护。因此，就带大家了解一下函数式编程的。可能大家在项目编程过程中也有用到，没有去关注这一点。啥是 函数式编程 ？我们常听说面向过程编程、面向对象编程，其实这些包括函数式编程是编程范式。编程范式 可以理解为编程的风格。 在一个项目中 我们可能用到多种编程范式。面向对象编程：把事物抽象成类和对象，通过封装、继承和多态来演示事物之间的关联。
2021-08-26 20:50:33
94
原创 合理使用记忆函数，优化程序性能
import { memoize } from "lodash-es";function fee(distance) { console.log("打印", distance); return distance * 5 + 500;}function _memoize(fn) { let cache = {}; return function () { let key = JSON.stringify(arguments); if (cache[key]) {
2021-08-24 21:05:32
147
原创 彻底搞懂闭包
闭包 是JS中一个很重要的概念，使用闭包可以让JS发挥更强大的能力，比如 柯里化，从而应用更多的场景。闭包概念闭包（Closure）：一个函数和对其周围状态（lexical environment，词法环境）的引用捆绑在一起（或者说函数被引用包围）闭包可以在另一个作用域中调用一个函数内部函数并并访问该函数作用域中的成员。function clouseFn() { let msg = "hell world!" return function() { console.l
2021-08-22 16:18:43
213
原创 forEach、map几个函数的功能和应用场景
在做项目时，经常会遇到处理数组的情况，JS提供了一个原生的API，比如：forEach、map 等等。在这里我们简单介绍这几个函数的应用场景，方便大家做项目时能够写少点代码，“偷点懒”。forEachforEach() 方法对数组的每个元素执行一次给定的函数。使用场景：当我们对数组的元素进行处理时（例如：增加元素，元素值改变），可以使用这个函数for example: 添加status 字段let blogs = [ {title:"胡三疯是帅锅",time:"2021-05-06", i
2021-08-21 16:57:48
2130
原创 彻底搞懂HTTP
什么是协议？协议是一种语言，也是一种约定好的规则。 那么使用HTTP协议，机器就能像人一样，使用双方都理解的语言（协议）进行交流（通信）。HTTP协议是专门用于客户端（浏览器）和服务端进行通信而设计。请求报文 和 响应报文当我们输入网站路径在打开一个页面时，浏览器在内部就会将 网站路径 按照 HTTP协议 转化为 请求报文 发送给服务器；当服务器处理之后发送内容给客户端时，要把内容 按照 HTTP协议 转化为 相应报文，浏览器解析响应报文 呈现页面内容。因此 问题的关键就在于理解 HTTP协议是
2021-08-21 11:38:56
114
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人