赛里木湖畔-优快云博客

原创学习脚手架第四节：脚手架的命令注册和参数解析

我们通过 nodejs 的process模块获取到命令行参数，并进行一系列逻辑判断，实现用户输入命令，执行命令对应的操作（这里用模拟操作)在实际项目应用中，一般会借助生成脚手架的框架来实现。目前市场占有率较高的脚手架框架是yargs和commander。那我们熟悉的脚手架vue-cli就是使用commander框架实现，学习 vue-cli 源码，首先要了解 commander 框架的基本实现。下一节就来看看 commander 框架的一些基础配置。

2024-09-02 23:51:50 597

原创学习脚手架第三节：脚手架的分包和多模块调试

本篇讲述了脚手架单模块和多模块的调试，如何在线上环境和本地调试环境中来回切换，本地调试可以方便更好的开发。

2024-08-10 19:17:49 868 2

原创从 Underscore.js 源码解读节流(throttle) 和防抖(debounce)函数

具体效果可以看下面视频演示。整体简化版本：更好理解。节流防抖函数效果演示。

2024-08-08 20:32:09 386

转载学习脚手架第一节：从 vue-cli 探究脚手架原理

脚手架本质是一个操作系统的客户端在终端中去执行一个命令，这个命令本身它就是一个客户端我们其实可以把脚手架理解为操作系统的一个客户端通过命令去执行它的时候，这个命令往往是这样的一个构造，如下比如：要创建一个vue的项目的时候, $上面这条命令由3个部分组成主命令: vue这个 command 是子命令，实际上它向脚手架(主命令)发送一个请求这个请求，让我们的脚手架帮我们完成一个动作，完成这个动作，就是create创建项目。

2024-08-05 20:31:31 94

原创学习脚手架第二节：使用原生 Node.js 开发脚手架

参考前端架构: 从vue-cli探究脚手架原理windows 系统可以用 git bash 执行which vue命令。git bash 模拟 unix 命令行终端，不仅可以进行 git 版本管理，也可以执行 shell 脚本命令创建 npm 项目创建脚手架入口文件，最上方添加。表示用 nodejs 执行配置，添加bin属性。bin 属性用于定义可执行文件的路径，是命令名到本地文件名的映射，编写脚手架代码发布到 npm。

2024-08-04 21:29:15 1771

原创 Event Loop 事件循环机制 & Promise async/await 执行顺序问题

await 之前的代码可以看做是同步的，await 右侧紧跟着的，也可以看作是同步的。await 下面的，被阻塞，整体看作是 Promise.then() 微任务。减少了 await 任务的循环次数，从而提高效能，通过直接调用 PromiseResolve() 代替之前的又一层 Promise封装。其中：defineProperty 和 Proxy 可被监听的数据拦截，本质上都是通过回调处理的，不是立刻执行的。js执行任务分为宏任务和微任务，宏任务放在任务队列，微任务放在微任务队列，先进先出（FIFO）。

2024-07-27 18:09:37 1132

原创 js原型和原型链继承

通俗来说，就是子类能够继承父类构造函数及原型对象上的属性和方法。那么怎么实现继承呢？：在组合式继承的基础上，使用Object.create创建空对象，并实现继承。：因为实例对象上有构造函数和他的原型对象上的所有属性和方法，被所有实例共享。父类为 Person，子类为Student，以下几种实现方法同上。父类为 Person，子类为Student。：在子类构造函数中直接调用父类构造函数。问题：父类构造函数被执行了两次。：将以上两种方法组合起来使用。

2024-07-20 12:01:43 367

原创 JS实现深拷贝(深克隆)和浅拷贝(浅克隆)

什么是深拷贝与浅拷贝浅拷贝：只复制对象的基本类型，对于引用类型，只是克隆地址数组的 Array.from(item) 方法就是实现的浅拷贝深拷贝：复制对象的基本类型和引用类型引用类型，只是克隆地址，那么原对象修改，克隆后的新对象也会跟着变化，克隆不彻底深拷贝的代码实现实现深拷贝需要用到递归的思想具体代码如下：// 实现深拷贝function deepClone(val) { //判断是普通类型或是null直接返回 if (typeof val !== 'object' || val

2020-09-22 09:34:19 745

原创 JS数组去重的方法Array

数组去重的方法方法一：对象的属性不能重复function unique1(arr) { var newArr = [] var obj = {} for (var key of arr) { //for of的key获取属性值 if (obj[key] === undefined) { //如果对象没有该属性值 newArr.push(key); //就将新数组末尾添加改属性值 obj[key] = 1; //并将对象中强行添加该属性 } }

2020-09-21 19:42:24 501

原创 JavaScript中数组的方法总结(map,forEach,reduce,some,every,filter,indexOf...)

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <script>

2020-09-17 17:33:04 326

原创 vue中多层嵌套组件父子孙组件传参

provide/inject首先搭建脚手架，我这里使用vue2.6.11父组件father.vue子组件child1.vue孙子组件child2.vue三者是层层嵌套关系#mermaid-svg-pa1BlDlRZvOK9eQ0 .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-pa1BlDlRZvOK

2020-09-01 17:09:09 3631

原创前端小白的算法之路——排序算法整合

一、冒泡排序实现原理每次排序相邻两个元素进行比较，满足大小关系，则后面一个元素跟下一个元素接着比较；不满足，则两个元素交换位置，后面那个元素接着跟下一个元素比较。这样每次循环都能找到一个最大的元素，下次循环就可以不带它了。js实现顺序排序（从小到大） function bubbleSort(arr) { for (var i = 0; i < arr.length; i++) { //i控制循环轮数 // 这里

2020-08-31 19:28:46 139

原创用JavaScript实现二分查找

二分查找原理（x是要查找的元素，arr是所要查找的数组）二分查找的基本思想是将n个元素分成大致相等的两部分，取arr[n/2]中间值与x做比较，如果x=arr[n/2],则找到x，算法结束；如果x<arr[n/2]，则只要在数组arr的左半部分继续查找x，如果x>arr[n/2]，则只要在数组arr的右半部分查找x。js实现 function binarySearch(arr, sel) { //首先确定首、尾下标 var low = 0; va

2020-08-31 15:22:20 2361 2

原创算法之快速排序篇

快速排序基本思想及实现今天给大家分享快速排序是如何实现的，希望大家看了这篇文章能够有所收获。（不要再被问碰一鼻子灰了）基本思想快速排序是通过一趟排序将要排序的数据分割成两部分，其中一部分数据比另一部分数据都要小，再按照此方法递归进行，最终实现整个数据变成有序系列。实现步骤将数组 [3,5,8,1,2,9,4,7,6] 从小到大排序，准备工作找一个基准数B（随机选择，这里为了方便演示，选择最右边的数字最基准数），这里找到基准数B是最右边的数字6，再找最左边的数字3表示为左标记L，最右边的数字7表

2020-08-30 11:56:52 142

原创如何向GitHub上传本地项目

如何向GitHub上传本地项目1.进入项目的根目录下，右击鼠标，选中【Git Bash Here】2.输入【git init】，回车3.输入【git add .】，回车，注意add后面有一个空格，再加一个点，将项目中所有文件添加到仓库中4.输入【git commit -m “first commit”】，回车5.输入【git remote add origin 你所新建的仓库地址】...

2019-07-31 22:07:55 112

赛里木湖畔的博客