Git 基础知识总结
一、Git 的核心概念Git 是一个分布式版本控制系统,它通过记录文件的快照(snapshot) 而不是差异,来管理代码的历史变化。 1. 四大核心对象 对象 作用 特点 Blob 存储文件内容(不包含文件名) 内容相同 → 哈希相同 Tree 存储目录结构(文件名 + 指向 blob 或子 tree) 目录的“快照” Commit 代表一次提交,指向一个 tree,记录作者、时间、消息和父提交 历史的“节点” Tag 指向某个 commit 的固定引用,用于标记版本(如 v1.0) 不会移动 ✅ 所有对象都通过 SHA-1 哈希唯一标识。 二、暂存(add) git add 的作用 核心功能:将工作目录中的文件变更添加到暂存区(index) ,为下一次提交准备内容。 本质操作: 读取文件内容 → 生成 Blob 对象 → 更新 .git/index 文件。 结果:暂存区记录了“下一次提交”的快照。 暂存区(index) 存放的目录是最新的 commit 的 tree 目录和 add 的 三、提交(Commit)与快照 每次 git co...
HTML 微数据和JSON-LD
用途让搜索引擎理解网页内容的“含义” 怎么用https://schema.org 词汇表 JSON-LD 描述网页的语义 12345678<script type="application/ld+json"> { "@context": "https://schema.org", // 这是“词典”的地址 "@type": "Person", // "Person" 这个词的定义在 schema.org 上 "name": "张三", "jobTitle": "软件工程师" }</script> 微数据 itemtype 描述术语 itemprop 描述具体属性 123456<div itemscope itemtype="https://schema.org/Person"...
HTML原生的弹窗 dialog
模态和非模态模态对话框(Modal Dialog) 阻止背景交互:当模态对话框打开时,它会阻止用户与对话框之外的应用程序其他部分进行交互,直到对话框被关闭。 强制用户响应:通常用于需要用户必须完成或取消某个操作才能继续的情况,比如确认删除、填写重要信息等。 示例:浏览器中的 alert()、confirm()、prompt() 都是模态的。 非模态对话框(Non-modal Dialog) 允许背景交互:非模态对话框打开时,用户仍然可以与应用程序的其他部分进行交互,对话框不会阻止用户操作其他部分。 不强制立即响应:通常用于提供辅助信息或工具,用户可以不理会它而继续其他工作,比如查找/替换对话框、调色板等。 属性closedby any closerequset none 一种是轻量级关闭用户操作 ,即当用户点击或轻触对话框外部时, 会自动关闭一种是平台特定的用户操作 ,例如在桌面平台上按下 Esc 键,或在移动平台上执行“返回”或“关闭”手势。一种是开发者指定的机制,通过 JavaScript 调用 close() 方法,或者通过 form 的提交 any: 任...
JavaScript 浏览器环境的模块
| 涵盖:导入导出、执行机制、跨平台设计 一、模块基础:import 与 export1. 导出(export) 类型 语法 特点 命名导出 export const name = 'Alice';export function greet() {}export { name, greet }; 可多个,导入时名字必须匹配 默认导出 export default function() {}export default obj; 每模块最多一个,导入时可自定义名字 2. 导入(import) 场景 语法 说明 导入命名导出 import { name, greet } from './utils.js'; 名字必须匹配 导入默认导出 import main from './utils.js'; 名字可自定义 同时导入 import main, { version } from './utils.js'; 默认 + 命名 全部导入 import * as utils from...
JavaScript 模块重新导出(桶文件)引出的性能问题分析
模块中重新导出的问题 [模块中关于桶文件的描述] 详见 📚 JavaScript 模块系统深度笔记 什么是“桶文件”(Barrel file)?“桶文件”(Barrel file)是一种在 JavaScript/TypeScript 项目中常见的模式。它是一个特殊的模块文件(通常命名为 index.ts, index.js, all.ts 等),它的主要作用是从当前包(package)或目录下的其他多个模块中重新导出(re-export)它们的成员,从而创建一个单一的、方便的入口点。 举个例子: 假设你有一个名为 @my-lib/utils 的工具库包,里面包含几个工具函数文件: 123456@my-lib/utils/├── src/│ ├── stringUtils.ts│ ├── numberUtils.ts│ └── dateUtils.ts└── index.ts <-- 这就是“桶文件” stringUtils.ts: 12export function capitalize(str: string): string {...
解构
解构数组对象其实都还挺简单理解的,但是在函数中解构的同时带上默认值就有点不太好理解了 1function f({ a = "", b = 0 } = {}): void {} 初读很乱,我们从外往里拆: ① 最外层:= {} 1function f(param = {}) {} 当调用 f() 时,如果没有传参数,就用一个空对象 {}不然解构会出现问题 如果解构 undefined 或 null 会出现问题解构底层就是在读对象属性,而 undefined / null 不能读属性 ② 中间层:对象解构 { a, b } 1function f({ a, b }) {} 从参数对象中取出 a 和 b ③ 内层:属性默认值 1{ a = "", b = 0 } 如果对象里:没有 a → 用 “” 没有 b → 用 0 这是“二层默认值”:外层默认...
展开
展开操作符(...)会把数组或对象的元素“拷贝一份”放进新的数组或对象里,原来的数组 / 对象本身不会被修改。但拷贝是“浅拷贝”,不是深拷贝。 二、这段代码做了什么1234let first = [1, 2]let second = [3, 4]let bothPlus = [0, ...first, ...second, 5] 等价理解为: 1let bothPlus = [0, 1, 2, 3, 4, 5] 关键点 bothPlus 是 一个全新的数组 first 和 second 没有被修改 12first // [1, 2]second // [3, 4] 三、浅拷贝1️⃣ 对基本类型(number / string)123456let a = [1, 2]let b = [...a]b[0] = 100a // [1, 2] ← 不受影响 因为: 数字是值类型 拷贝的是真实的值 2️⃣ 对引用类型(对象 / 数组)123456let a = [{ x: 1 }]let b = [...a]b[0]...
file 协议
🎯 一、file: 协议是什么? 🔥 一句话定义:file: 协议是一种 URL 格式,用来指向你本地硬盘上的文件,就像文件资源管理器的路径一样。 📁 二、基本语法1234file:[//<host>]<path> └──┬───┘ └──┬──┘ │ └── 路径(必须) └───────── 主机名(可选) 常见形式 格式 说明 示例 file:///路径 本地文件(最常见) file:///C:/Users/Alice/docs/hello.txt file://主机名/路径 网络共享文件(少见) file://server/shared/report.pdf ✅ 三个斜杠 ///:前两个是 语法中的://,第三个表示“根目录” 🌰 三、实际例子1. 打开本地 HTML 文件1file:///Users/Alice/project/index.html 👉 在浏览器地址栏输入,就能打开你电脑上的 index.html 2. 引用本地图片1<img src...
npm `package.json` 文件说明
npm(Node Package Manager) 是一个 包管理工具(Package Manager),它的主要职责是: 安装依赖:npm install lodash 发布包:npm publish(把你的代码发布到 npm 仓库) 管理版本:通过 package.json 和 package-lock.json 运行脚本:通过 npm run build、npm run dev 等 ✅ 一句话总结 package.json 是一个 项目说明书,它告诉: 你:这个项目依赖哪些包、怎么运行 npm / yarn / pnpm:怎么安装、发布、管理这个项目 别人:这是个什么项目、怎么使用它 它就像一本书的“封面 + 目录 + 前言”。 🧩 举个生活例子:开餐馆 类比 对应 package.json 餐馆名字 "name": "小王面馆" 菜单(有什么菜) "scripts":start, build 等命令 食材从哪进货 "dependencies&q...