杨灿就是杨火山-CSDN博客

原创带你快速入门koa：koa-router路由系统深入解析

一、自己手写实现简单的koa路由系统koa本身是一个高级应用框架之下的框架，所以很多东西都是精简的，需要我们自己根据需要引入插件，本身是没有路由系统的。本身要做路由引导，可以简单的做逻辑处理。需要返回什么给客户端，直接传给ctx.body就可以，koa自动帮我们做了序列化操作。二、koa-router插件，三步实现简单的路由Koa-router:https://github.com/ZijianHe/koa-routervar Koa = require('koa');var Rout

2021-02-08 12:13:53 5654 9

原创 ts入门笔记——ts类型声明和类型断言

ts入门笔记——ts类型声明和类型断言学习路径1.学习ts声明变量类型2.学习ts的类型断言（解释型类型转换）3.学习ts的接口进一步详解ts在线运行练习网站：https://www.tslang.cn/play/index.html一、ts简介1.什么是TypeScript(TS)？TypeScript简称TSTS和JS之间的关系其实就是Less/Sass和CSS之间的关系就像Less/Sass是对CSS进行扩展一样, TS也是对JS进行扩展就像Less/Sass最终会转换成CS

2020-09-28 11:38:35 8067 3

原创你必须要会的DOM操作

思维导图必须要会的DOM操作||—— 获取指定的元素对象||—— 编辑指定元素的内容|—— 编辑指定元素的属性内容||—— 设置DOM事件和定时器1.1. 获取想要的元素DOM操作返回的是一个对象, 浏览器渲染之后html标签也是都会转化为对象通过id获取指定元素由于id不可以重复, 所以找到了就会将找到的标签包装成一个对象返回给我们, 找不到就返回Nulllet ...

2019-12-11 21:05:19 1106

原创使用husk+commitlint+lint-stage规范化前端开发代码

按照husky官方文档初始化husky后，发现commit的一直没有出发husky的钩子。

2022-08-21 11:32:09 962

原创 process.env读取和设置 / webpack打包时传入变量 / npm传入变量

本文章解决的问题？如何在node中读取和设置process.env变量？webpack打包的时候，想要方便区分生成和开发环境，利用环境变量编写分支逻辑，要怎么办？npm运行的时候可不可以向node传入一个环境变量？先了解node的process.envprocess.env 属性返回包含用户环境的对象。参见 [environ(7)](http://url.nodejs.cn/zvAzBK)。此对象的示例如下所示：{ TERM: 'xterm-256color', SHELL: '

2022-01-16 22:23:41 3669 1

原创利用vite的glob引入，实现自动添加路由

vite中支持利用glob引入多个模块https://cn.vitejs.dev/guide/features.html#jsonVite 支持使用特殊的 import.meta.glob 函数从文件系统导入多个模块：const modules = import.meta.glob('./dir/*.js')以上将会被转译为下面的样子：// vite 生成的代码const modules = { './dir/foo.js': () => import('./dir/foo.js')

2022-01-15 11:15:48 3247

原创 spa和ssr应用中vue-router引入的区别

一、传统的spa vue应用安装vue-routernpm install vue-router编写router-rules传入VueRouter构造函数创建router实例, 并全局注册vue-routerimport Vue from ‘vue’import Router from ‘vue-router’// 1. 引入页面组件import Foo from ‘…/pages/foo.vue’import Bar from ‘…/pages/bar.vue’// 2. 定义路由//

2021-12-25 22:17:35 585

原创 eslint或stylelint配置完之后vscode无法自动格式化问题的解决办法

配置了eslint和stylint规则之后，想要vscode在保存的时候自动帮你格式化修改。你需要安装对应的插件和开启对应的设置选项。本文忽略如果配置eslint和stylint规则，直接讲后面的部分。1. 在项目中设置推荐安装插件每个人都可以手动安装这两个插件，但在团队开发中，你无法保证每个成员都会自己手动安装，所以你可以在项目下设置一个.vscode/extensions.json 文件，这样项目被vscode打开就会检测本地是否有这两个插件，没有就会弹出提示。{ "recommend

2021-12-19 11:15:54 4084

原创 100个优化js代码的技巧

欢迎大家关注我的同名前端公众号：杨灿就是杨火山，点击可查看公众号二维码1.带有多个条件的 if 语句把多个值放在一个数组中，然后调用数组的 includes 方法。//longhandif (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') { //logic}//shorthandif (['abc', 'def', 'ghi', 'jkl'].includes(x)) { //logic}2. 简化 i.

2021-05-31 16:15:23 370

原创微信小程序多图片上传支持预览删除设置数量上限

github地址： https://github.com/Volcano-Yang/miniprogram-picture-uploadMiniprogram-Picture-Upload努力帮助你快速实现小程序的图片上传功能༼ つ ◕_◕ ༽つ Please give me a star ???? 功能支持设置图片上传数量本组件支持开发者设置小程序图片上传的数量上限，通过设置imgMaxNumber的值即可。支持预览图片用户上传图片之后，支持点击放大预览。支持删除已选择的图片

2021-05-27 22:18:20 522 2

原创 koa-static实现对静态资源处理和探讨

一、利用 koa-static 实现静态资源的访问安装koa-static npm i koa-static引入koa-static方法，并且传入静态资源目录路径const Koa = require("koa");const static = require("koa-static");const path = require("path");const app = new Koa();app.use(static(path.join(__dirname, "/static

2021-02-10 12:13:33 929

原创 node开发常用工具——pm2、nodemon、vscode launch配置和vscode断点调试

一、pm2文章：https://www.cnblogs.com/chyingp/p/pm2-documentation.html全局安装，简直不能更简单。npm install -g pm2入门教程（1）启动挑我们最爱的express应用来举例。一般我们都是通过npm start启动应用，其实就是调用node ./bin/www。那么，换成pm2就是pm2 start ./bin/www --watch注意，这里用了--watch参数，意味着当你的express应用代码发生变化时，p

2021-02-08 08:40:53 1253

原创 TS入门笔记2——TS接口进阶详解

一、为什么需要接口？let obj:object; // 定义了一个只能保存对象的变量// obj = 1;// obj = "123";// obj = true;obj = {name:'lnj', age:33};console.log(obj);之前我们已经介绍了用这种方式定义一个ts的对象，但是这样定义内部的属性并没有被限制，意义是不大的。为了进一步定义对象内的各种属性，就产生了接口。二、什么是接口类型?和number,string,b

2020-10-06 20:55:38 2734

原创 TS入门笔记1——TS的类型声明

TS入门笔记1——TS的类型声明简单快速上手ts的学习路径：一、熟悉掌握熟悉的强类型定义，初步学习编写强类型代码。学习ts的声明变量类型，能够初步编写强类型代码；学习ts的接口,进一步强定义对象的丰富属性；学习ts的函数声明和实现定义，强类型化你的js函数；二、灵活面对类型转换，类型报错，类型文件的声明和引入，灵活编写强类型代码。学习ts的类型断言（解释型类型转换）；学习ts的泛型，更灵活的面对多可能性类型参数；学习ts的类型声明文件，全局定义；ts在线运行练习网站：ht

2020-10-06 20:48:45 1755

原创抱怨npm下载慢，win中cnpm安装麻烦，快来试试npm换源

配置方式：换源npm config set registry https://registry.npm.taobao.org检查是否改成功了npm config get registry

2019-12-20 19:57:17 293

原创用最简单的方法实现圣杯布局

在看了很多网上的教程后，真心浮动方法设置圣杯布局十分心累，最后整理两个十分简单好用的方法，供大家参考圣杯布局要求header和footer各自占领屏幕所有宽度，高度固定。中间的container是一个三栏布局。三栏布局两侧宽度固定不变，中间部分自动填充整个区域。中间部分的高度是三栏中最高的区域的高度。圣杯布局中的难点就是中间三列的样式设置（固定宽度+自适应+固定宽度）disp...

2019-12-14 23:27:35 243

原创三种方式搞定CSS的双列布局

双列布局左边一列固定，右边一列自动填满浮动解法float&margin-leftleft：float：left 和固定宽度 width：300pxright：margin-left：300px优缺点旧浏览器一个浮动一个固定会有问题margin决定于width，没有解耦right中内容不能使用clear消除浮动，否则会打乱布局 <style> ...

2019-12-14 23:26:08 1710

原创 OpenGL学习(三) 三维物体的绘制、相机设置、顶点数组

正交投影viod glOrtho(GLdouble left,GLdouble right,GLdouble bottom,GLdouble top,GLdouble near,GLdouble far)//设定一个正交投影矩阵，并定义了一个形状为直平行六面体的视域体。void glutWireCube(GLdouble size...

2019-12-14 23:19:32 1595

原创 OpenGL（一）二维图形的绘制：一个简单的绘制矩形程序

一段简单的绘制正方形的程序：#include <gl/glut.h>void display(){ glClear(GL_COLOR_BUFFER_BIT); glBegin(GL_POLYGON); glVertex2f(-0.5,-0.5); glVertex2f(-0.5,0.5); glVertex2f(0.5,0.5); glVertex2f(0.5,-0...

2019-12-14 22:48:42 1429

原创多种方法搞定CSS的水平居中、垂直居中、水平垂直居中布局

水平居中布局text-align&inline-block优缺点：三种display属性table|block&margin优缺点margin补课absolute&left&transform优缺点position补课：transfrom补课：垂直居中布局table-cell&vertical-align...

2019-12-13 09:38:20 737

原创不可不知的JS函数基本知识

赞过我的同学，今天写的程序都没有BUG。思维导图[不可不知的JS函数知识]||—— 关于函数的定义和作用|—— [函数的定义和作用] （ES6前后的三种定义方法）|—— [匿名函数的定义和作用]|—— [箭头函数]||—— 关于函数的参数|—— [argument的理解]|—— [默认参数的设置方式]||—— 关于函数的作用于|—— [作用域、作用域链、预解析]|...

2019-12-11 23:14:48 264

原创一文带你了解BOM基本知识

1.1. BOＭ和ＤOM的区别DOM就是一套操作HTML标签的API(接口/方法/属性)BOM就是一套操作浏览器的API(接口/方法/属性)1.2. BOM中常见的对象window: 代表整个浏览器窗口注意: window是BOM中的一个对象, 并且是一个顶级的对象(全局),下面的对象都能通过它找到Navigator: 代表当前浏览器的信息, 通过Navigator我们就能判断...

2019-12-11 21:32:12 615

原创入门markdown的正确姿势

入门markdown的正确姿势markdown编辑器的最大问题往往是没法同步，对图片编辑和保存不完善。这里我使用vscode+github来做md编辑器，这样的话md文件和图片文件都保存在github上，可以保证同步同时图片链接不会失效，感觉不错！下面我先讲md的基础语法，再讲我用到的插件，已经会语法的同学可以直接跳到插件推荐。目录入坑marddown的看过来语法设置段落简...

2019-10-19 16:37:10 282

原创怎么用指针操作二维数组

我们都知道一维数组的我们都很熟悉：int a[5] = { 1,2,3,4,5 };int*p = a;int i, j;这里p指针是int型指针，这里的赋值是将数组a的内存中的首地址啊a【0】在内存中的位置，地址传给p，这样p就能代表a数组了这时我们可以用平p【1】，p【2】……依次代表数组a【1】，a【2】……；接下来我们看二维数组，int b[2][3] = ...

2018-05-06 22:05:55 2682

原创 C++ 友元函数

C++ 友元函数类的友元函数是定义在类外部，但有权访问类的所有私有（private）成员和保护（protected）成员。尽管友元函数的原型有在类的定义中出现过，但是友元函数并不是成员函数。友元可以是一个函数，该函数被称为友元函数；友元也可以是一个类，该类被称为友元类，在这种情况下，整个类及其所有成员都是友元。如果要声明函数为一个类的友元，需要在类定义中该函数原型前使用关键字 frie...

2018-05-06 20:32:09 219

原创 C++ 拷贝构造函数

C++ 拷贝构造函数拷贝构造函数是一种特殊的构造函数，它在创建对象时，是使用同一类中之前创建的对象来初始化新创建的对象。拷贝构造函数通常用于：通过使用另一个同类型的对象来初始化新创建的对象。复制对象把它作为参数传递给函数。复制对象，并从函数返回这个对象。如果在类中没有定义拷贝构造函数，编译器会自行定义一个。如果类带有指针变量，并有动态内存分配，则它必须有一个拷贝构造函数。拷贝构...

2018-05-06 20:27:09 290 5

原创 c++中，new的用法很灵活，这里进行了简单的总结：

new int; //开辟一个存放整数的存储空间，返回一个指向该存储空间的地址(即指针) 　　 new int(100); //开辟一个存放整数的空间，并指定该整数的初值为100，返回一个指向该存储空间的地址 new char[10]; //开辟一个存放字符数组(包括10个元素)的空间，返回首元素的地址　　 new int[5][4]; //开辟一个存放二维整型数组(大小为5*4...

2018-05-06 20:26:17 13150

原创 C++ 类构造函数 & 析构函数

C++ 类构造函数 & 析构函数类的构造函数类的构造函数是类的一种特殊的成员函数，它会在每次创建类的新对象时执行。构造函数可用于为某些成员变量设置初始值。构造函数的名称与类的名称是完全相同的，并且不会返回任何类型，所以也不代表任何类型 �� 默认缺省构造函数下面的实例有助于更好地理解构造函数的概念：实例#include <iostream>us...

2018-05-06 20:23:30 272 3

原创 C++ 类成员函数

C++ 类成员函数类的成员函数（或称方法）是指那些把定义和原型写在类定义内部的函数，就像类定义中的其他变量一样。类成员函数是类的一个成员，它默认已经传进了全部类成员。让我们看看之前定义的类 Box，现在我们要使用成员函数来访问类的成员，而不是直接访问这些类的成员：class box{ public: double length; // 长度 ...

2018-05-06 20:20:45 324

原创 C++ 类 & 对象

C++ 类 & 对象 C++ 在 C 语言的基础上增加了面向对象编程。类是 C++ 的核心特性，类本质就是用户定义的类型。用自己定义的类定义的变量就叫对象，它包含了数据表示法和用于处理数据的方法（类中的函数）。类中的数据和方法称为类的成员。C++ 类定义定义一个类，本质上是定义一个数据类型的蓝图。它定义了类的对象包括了什么，以及可以在这个对象上执行哪些操作。类定义...

2018-05-06 20:19:07 204 3

原创数组指针与指针数组

数组指针，本质是指针，数组首元素地址的指针，是指向数组的指针。例：int (*p)[10]; p即为指向数组的指针，又称数组指针。（记得括号的位置） *（p+1)=1即是数组里的第二个元素为1指针数组，是数组元素为指针的数组例如 int *p[3],定义了p[0],p[1],p[2]三个指针，其本质为数组。 *（p+1)=1即是数组里的第二个元素为1是不正...

2018-05-06 20:17:14 175

原创 “打鱼”还是“晒网”

中国有句俗语叫“三天打鱼两天晒网”。某人从1990年1月1日起开始“三天打鱼两天晒网”，问这个人在以后的某一天中是“打鱼”还是“晒网”#include<stdio.h>typedef struct{ int year; int month; int day;}DATE;int countday(DATE today);int runyear(i...

2018-02-10 12:14:15 1744 1

原创百鸡问题拓展使用化代码

今有鸡翁一，值钱伍；鸡母一，值钱三；鸡鶵三，值钱一。凡百钱买鸡百只，问鸡翁、母、鶵各几何？下面是我自己的稍微拓展让其稍微好看和使用的代码，见笑了#include<stdio.h>int main(){ int mark=1; while(mark) { int num,money; printf("请输买鸡用的总费用:\n");...

2018-02-09 22:50:49 272

原创 Lucky Word//运用数组的桶的特性

问题 B: Lucky Word 题目描述笨小熊的词汇量很小，所以每次做英语选择题的时候都很头疼。但是他找到了一种方法，经试验证明，用这种方法去选择选项的时候选对的几率非常大！这种方法的具体描述如下：假设maxn是单词中出现次数最多的字母的出现次数，minn是单词中出现次数最少的字母的出现次数，如果maxn-minn是一个质数，那么笨小熊就认为这是个Lucky Word，这样的单词很可能就

2018-01-04 17:13:10 890 2

原创最大乘积连续子序列（数组）//枚举法的大好江山

问题 C: 最大乘积连续子序列（数组）题目描述输入n个元素组成的序列S，你需要找出一个乘积最大的连续子序列，如果这个最大乘积不是正数，则输出0。输入第一行输入n（1输出输出结果（结果之后无空格）。样例输入 3 2 4 -3 样例输出 8#includeint main(){ int n,arr[20]={1}; scanf("%d",&n)

2018-01-04 16:52:47 1824

原创字符串碎片（字符串）//strcmp函数的奇巧淫技（偷笑）//一维数组转化为二维数组解决问题

问题 E: 字符串碎片（字符串）一个由小写字母组成的字符串可以看成一些同一字母的最大碎片组成的。例如，”aaabbaaac”是由下面碎片组成的：”aaa”,”bb”,‘c’。输入字符串，请计算字符串的所有碎片及所有碎片的平均长度。所有碎片的平均长度 = 所有碎片长度之和/碎片个数输入测试次数t 每组测试数据为一行字符串输出对每组测试数据，输出字符串中按顺序出现的碎片和

2018-01-04 16:26:29 1603 2

原创矩阵问题之//矩阵旋转//一道找规律的题

问题 C: 矩阵旋转输入一个N*M的矩阵，要求将这个矩阵右转90度后输出。例如矩阵：A B C 右转90度后变成： D A D E F E B F C 输入第一

2018-01-04 10:55:06 1713

原创关于矩阵求和的常见算法//题目：n阶幻方矩阵验证

问题 : n阶幻方矩阵验证（数组） n阶幻方矩阵是指将1，2，3，…,n²数字填入n*n矩阵中，每行和，每列和，两条对角线的和均相等。给定n阶矩阵，验证是否n阶幻方矩阵。输入测试次数t 每组测试数据为：矩阵大小n，后跟n*n的矩阵数据。输出对每组测试数据，输出判定结果，YES或NO 样例输入 3 3 8 1 6 3 5 7 4 9 2 4 1 2 15 16

2018-01-04 10:35:36 2838

原创矩阵题目之//鞍点定位

问题 F: 鞍点定位在一个二维矩阵中，如果某个位置的数值是该行最大值，同时也是该列最小值，我们则称该位置是矩阵的鞍点。鞍点在工业控制，建筑力学等方面有着广泛应用。鞍点可能有多个，也可能没有。请编写程序找出矩阵的鞍点。输入第一行输入T表示有T个测试实例第二行输入两个参数A和B，分别表示矩阵的行数和列数第三行输入二维矩阵的数据，假定数据都是正整数以此类推输入下个实例输出

2018-01-03 09:13:49 2141

原创求两个数的最大公约数

下面介绍三种求最大公约数的办法，是我自己整理的，如果看官看的看了请你直视我的眼睛，看了就求你点个赞呗TMT。写了好多篇文章还没人给我点过。TTTTT！自创土办法！#includeint main(){ int a,b,n; scanf("%d%d",&a,&b); for(int i=1;i<=a&&i<=b;i++) { if(a%i==0

2017-12-30 21:25:57 247 1

空空如也

空空如也