Node.js 补充
前言参考：Node.js
初识 Node.js
使用 Node.js 运行 js 文件
输入：node 要执行的js文件的路径
cmd 中快捷键：Tab 快速补全、Esc 快速情况当前输入的命令
Node.js 中的 fs 模块fs.readFile12const fs = require('fs') // 注意不能使用 import fs from 'fs';fs.readFile(path[, options], callback)
path：文件路径（必选）
options：配置选项，若是字符串则指定编码格式 （可选）
encoding：编码格式
flag：打开方式
callback：回调函数 （必选）
err：错误信息
data：读取的数据，如果未指定编码格式则返回一个 Buffer
12345678910111213141516// 1. 导入 fs 模块，来操作文件const fs = require('fs')// 2. 调用 fs.readFile() 方法读取文件// 参 ...
前端HTML、CSS补充
前言本文是 Pink 老师HTML CSS 教程学习后的补充记录。
参考：黑马程序员pink老师前端入门教程
HTML 补充浏览器内核
浏览器
内核
备注
IE
Trident
IE、猎豹安全、360极速浏览器、百度浏览器
firefox
Gecko
可惜这几年已经没落了，打开速度慢、升级频繁、猪一样的队友flash、神一样的对手chrome。
Safari
webkit
现在很多人错误地把 webkit 叫做 chrome内核（即使 chrome内核已经是 blink 了）。苹果感觉像被别人抢了媳妇，都哭晕在厕所里面了。
chrome
Chromium/Blink
在 Chromium 项目中研发 Blink 渲染引擎（即浏览器核心），内置于 Chrome 浏览器之中。Blink 其实是 WebKit 的分支。大部分国产浏览器最新版都采用Blink内核。二次开发
Opera
blink
现在跟随chrome用blink内核。
标签基本补充
123456789101112131415161718192021222324<!DOCTYPE html ...
JavaScript补充
前言本文主要记录博主遇到的JavaScrprt的补充知识。
Ajax参考：3小时Ajax入门到精通 CSDN
AJAX 简介 异步的 JS 和 XML(AsynchronousJavaScript And XML)，浏览通过 Ajax 向服务器发送异步请求，可以无刷新获取数据。
优点：无需刷新页面与服务器端进行通信、允许你根据用户事件来更新部分页面内容
缺点：没有浏览历史不能回退、存在跨域问题、SEO 不友好
XML 简介 可扩展标记语言，和 HTML 类似，但 XML 中没有预定义标签，用来表示一些数据
12345678<!-- 使用 XML 来表示 一个学生的信息 --><student> <name>张三</name> <age>18</age> <gender>男</gender></student><!-- XML 已被 JSON 取代 -->{"name":&qu ...
TypeScript
前言TypeScript 基础
安装 TypeScript1234npm install -g typescript // 安装tsc -V // 检查版本号// 注：如果 ts 文件中只有 js 语法，html 引入改 ts 文件不会报错且可以执行
TypeScript中的基本类型类型声明123456// 语法let 变量: 类型;let 变量: 类型 = 值;function fn(参数: 类型, 参数: 类型): 类型{ ...}
自动类型判断
TS拥有自动的类型判断机制
当对变量的声明和赋值是同时进行的，TS编译器会自动判断变量的类型
所以如果你的变量的声明和赋值时同时进行的，可以省略掉类型声明
123// 如：let a = 1; 则 a 的类型为 numberlet a = 1;// a = 'hello world' 报错
类型
类型
例子
描述
number
1、-1、1.1
任意数字
string
‘hi’、”hi”、hi
任意字符串
boolean
true、false
布尔值true或 ...
Vite
前言vite 的笔记
Vite介绍构建工具
市面上主流的构建工具有哪些:
webpack
vite
parcel
esbuild
rollup
grunt
gulp
什么是构建工具
浏览器他只认识html、css、js文件，当项目出现其他文件需要手动编译，而构建工具会自动编译。
vite相较于webpack的优势
构建速度快
webpack支持多种模块化, 开始必须要统一模块化代码, 意味着需要将所有的依赖全部读一遍
vite的上手难度更低, webpack的配置是非常多的, loader, plugin。
vite是基于es modules的，webpack更多的关注兼容性, 而vite关注浏览器端的开发体验。
webpack 不能改的原因
12345678910111213141516// webpack支持多种模块，这一段代码最终会到浏览器里去运行const lodash = require("lodash"); // commonjs 规范import Vue from "vue"; // es6 module// w ...
前端文件流
前言本文记录 JavaScript 中的文件流，持续更新中……
使用Blob下载文件1234567891011121314151617181920212223242526272829303132333435363738// 模拟下载请求function download() { axios({ url: `http://localhost:2000/download`, method: 'GET', responseType: 'blob', }).then(result => { // 如果接口请求填写了 responseType: 'blob'，可以不需要new blob const blob = new Blob([result.data], { type: "image/jpeg" }) const u ...
vue3
前言vue3的学习记录
vue3新的特性
Composition API（组合API）
setup配置
ref与reactive
watch与watchEffect
provide与inject
……
新的内置组件
Fragment
Teleport
Suspense
其他改变
新的生命周期钩子
data 选项应始终被声明为一个函数
移除keyCode支持作为 v-on 的修饰符
……
vite1234567## 不需要全局安装## 创建工程yarn create vite## 安装依赖yarn## 运行yarn dev
参考：vue3保姆级教程
vue3-cli项目分析12345678910// main.js 分析// 没有了 Vue 的构造函数，只是createApp的工厂函数，可以直接调用// 创建应用实例对象——app(类似于之前Vue2中的vm，但app比vm更“轻”)import { createApp } from 'vue'import App from './App.vue' ...
前端可视化
# 前言本文记录所学的一点可视化知识
数据可视化
Skia 是 Chrome 和 Android 的底层 2D 绘图引擎，Skia 采用 C++ 编程，由于它位于浏览器的更底层，所以我们平常接触较少。
OpenGL（Open Graphics Library）是2D、3D图形渲染库，它可以绘制从简单的2D图形到复杂的3D景象。OpenGL 常用于 CAD、VR、数据可视化和游戏等众多领域。
Chrome 使用 Skia 作为绘图引擎，向上层开放了 canvas、svg、WebGL、HTML 等绘图能力。
canvas标签只是图形容器，相当于一个画布，canvas 元素本身是没有绘图能力的。所有的绘制工作必须在 JavaScript 内部完成，相当于使用画笔在画布上画画。
1234// 注意：必须指定宽高---canvas标签默认宽度与高度 300 * 150// canvas标签的w|h务必通过canvas标签属性width|height设置// 切记不能通过样式去设置画布的宽度与高度这样canvas的坐标体系会出现问题<canvas id="charts ...
VSCode配置
前言一些 VSCode 插件和配置记录
插件
相关插件配置
别名路径跳转 – @在项目中可以跳转（暂没配置）
翻译(英汉词典) –翻译（不用配置）
Auto Rename Tag –HTML前后自动修改（不用配置）
Chinese (Simplified) (简体中文) –不用配置
Code Spell Checker – 代码单词拼写检查
遇到不应该报错的单词需要配置 如：vuex（右键选择Ignore Words -> 添加到User里）
DotENV – 环境变量文件支持插件
EditorConfig for Vs Code –配和项目中的编辑器.editorconfig文件使用（统一编辑器代码格式化）
ESlint –js语法检查配和.eslintrc.js使用（暂未配置）
JetBrains Icon Theme – 文件图标插件
Live Sass Compiler – 将scss转成css
配置不生成map文件
Live Server – 代理服务器HTML打开浏览器（自动监听变化
插件配置默认打开浏览器为Chrome
Luke Dark ...
HTML5补充
前言HTML（Hyper Text Markup Language）超文本标记语言，是用来描述网页的一种语言。
参考：小火柴的前端小册子
标签标签有单标签和双标签
注意：HTML标签对大小写不敏感，但要全小写。
实体HTML中某些字符是预留的，需要被替换为字符实体（如： ）
全局属性（一共16个）
属性名
值
作用
contenteditable
true/false
指定是否可以在浏览器里编辑内容
data-*
用于存储页面或应用程序的私有定制数据
draggable
true/false/auto
用户是否可以拖动元素注意：链接和图像默认是可拖动的
spellcheck
true/false
规定是否对元素进行拼写和语法检查，对拼写错误的单词会在其下方出现红线
语法规范
文件应以 <!DOCTYPE ......> 首行顶格开始，推荐 <!DOCTYPE html>
声明文档编码charset，必须是 head第一个子元素<meta charset="utf-8">
...