js 系列 - 随笔分类 - pleaseAnswer

11｜使用 canvs 实现分离饼图

摘要：关键设计思想分离式饼图实现原理每个扇形沿中间角度方向外移用 progress 控制动画过渡（0→1 = 合并 → 分离）通过深度排序解决视觉重叠问题响应式设计尺寸基于画布大小动态计算支持设备像素比适配（Retina 屏优化）交互反馈机制扇形悬停：放大+变亮图例阅读全文

posted @ 2025-07-22 10:16 pleaseAnswer 阅读(31) 评论(0) 推荐(0)

10｜使用 three.js 实现立体饼图和分离立体饼图

摘要：认识 three.js Q：什么是 Three.js？ Three.js 是一个用于在浏览器中创建和渲染 3D 图形的 js 库。它建立在 WebGL 之上，提供了更易于理解和操作的 API，大大降低了创建复杂 3D 应用的难度。 Three.js 的主要功能： 3D 模型：创建、导入和操作复杂的阅读全文

posted @ 2025-07-22 10:14 pleaseAnswer 阅读(134) 评论(0) 推荐(0)

⑨ ES11 新特性初探

摘要：1 全局模式捕获：String.prototype.matchAll() const str = ` <html> <body> <div>这是第一个div</div> <p>这是p</p> <div>这是第二个div</div> <span>这是span</span> </body> </html 阅读全文

posted @ 2022-05-18 17:46 pleaseAnswer 阅读(33) 评论(0) 推荐(0)

⑧ ES10 效率再提升

摘要：1 对象扩展 Object.fromEntries() 把键值对列表转换为一个对象 1.1 Object 转换 const obj = { name: 'imooc', course: 'es' } const entries = Object.entries(obj) console.log(en 阅读全文

posted @ 2022-05-18 17:41 pleaseAnswer 阅读(32) 评论(0) 推荐(0)

⑦ ES7 异步迭代&对象操作升级

摘要：1 异步迭代：for await of 1.1 同步迭代（模拟） const arr = ['es6', 'es7', 'es8', 'es9'] // 只适用于同步操作 arr[Symbol.iterator] = function() { let nextIndex = 0 return { n 阅读全文

posted @ 2022-05-18 17:37 pleaseAnswer 阅读(66) 评论(0) 推荐(0)

⑥ ES8 异步编程&对象拓展

摘要：1 异步编程解决方案 Async Await async 让我们写起 Promise 像同步操作 async/await 是函数定义的关键字 await 用于等待 promise 对象的返回结果，且不能单独使用必须放在 async 函数中利用 async 定义的函数会返回一个 promise 对象阅读全文

posted @ 2022-05-18 17:30 pleaseAnswer 阅读(38) 评论(0) 推荐(0)

⑤ ES7 数组&数值拓展

摘要：1 数组扩展：Array.prototype.includes(searchElement, fromIndex) fromIndex 从指定索引位置开始查找 1.1 返回值：Boolean const arr = ['es6', 'es7', 'es8'] console.log(arr.incl 阅读全文

posted @ 2022-05-18 17:27 pleaseAnswer 阅读(42) 评论(0) 推荐(0)

④ ES6 异步编程与模块化

摘要：1 异步操作必备知识 1.1 异步操作前置知识 1. js 是单线程的 2. 同步任务与异步任务 3. ajax 原理前后端数据分离前端 ↔ 后端 ajax 4. callback hell 回调地狱 2 Ajax 原理与 Callback Hell 2.1 ajax 原理一种前后端的交互方式阅读全文

posted @ 2022-05-18 17:17 pleaseAnswer 阅读(36) 评论(0) 推荐(0)

③ ES6 新特性

摘要：1 面向过程与面向对象 1.1 冰箱装大象 js是一种基于对象（object-based）的语言 1.2 类与对象类是对象的模板，定义了同一组对象共有的属性和方法 2 ES5中的类与继承 2.1 类 1. 如何定义类属性定义在类上方法定义在原型上 function People(name, a 阅读全文

posted @ 2022-05-18 17:05 pleaseAnswer 阅读(33) 评论(0) 推荐(0)

② ES6 必备知识

摘要：1 新的声明方式 1.1 作用域对象类型 global/window 全局作用域 function 函数作用域（局部作用域） {} 块级作用域 this 动态作用域 1.2 新的声明方式 let 1. 不属于顶层对象 window var 声明的顶层对象与全局变量挂钩，污染全局变量 var a 阅读全文

posted @ 2022-05-16 20:26 pleaseAnswer 阅读(36) 评论(0) 推荐(0)

① 课程介绍 & 环境搭建

摘要：1 课程介绍 es2015-es2020 每个版本引入的新特性对比各版本充分体现新特性语法优势每个语法的应用场景理论与实践相结合电子书 2 Node 安装与 npm 源切换查看 node 版本 node -v 查看 npm 版本 npm -v npm 源切换 nrm 安装 npm i - 阅读全文

posted @ 2022-05-16 20:22 pleaseAnswer 阅读(26) 评论(0) 推荐(0)

⑮ 算法设计思想之“回溯算法”

摘要：一、理论 1. 简介回溯算法是算法设计中的一种方法回溯算法是一种渐进式寻找并构建问题解决方法的策略回溯算法会先从一个可能的动作开始解决问题，如果不行就回溯并选择另一个动作，直到将问题解决 2. 什么问题适合用回溯算法解决？有很多路这些路里，有死路，也有出路通常需要递归来模拟阅读全文

posted @ 2022-02-10 16:28 pleaseAnswer 阅读(83) 评论(0) 推荐(0)

⑭ 算法设计思想之“贪心算法”

摘要：一、理论 1. 简介贪心算法是算法设计中的一种方法期盼通过每个阶段的局部最优选择从而达到全局的最优结果并不一定是最优 2. 零钱兑换输入： coins = [1, 2, 5], amount = 11 输出： 3 解释： 11 = 5 + 5 + 1 输入： coins = [1, 阅读全文

posted @ 2022-02-10 16:27 pleaseAnswer 阅读(115) 评论(0) 推荐(0)

⑬ 算法设计思想之“动态规划”

摘要：一、理论 1. 简介动态规划是算法设计中的一种方法它将一个问题分解成相互重叠的子问题，通过反复求解子问题，来解决原来的问题 2. 斐波那契数列定义子问题：F(n) = F(n-1) + F(n-2) 反复执行：从2循环到n，执行上述公式 3. 动态规划 VS 分而治之关键区别典例阅读全文

posted @ 2022-02-10 16:26 pleaseAnswer 阅读(68) 评论(0) 推荐(0)

⑫ 算法设计思想之“分而治之”

摘要：一、理论 1. 简介分而治之是算法设计中的一种方法它将一个问题分成多个和原问题相似的小问题，递归解决小问题，再将结果合并以解决原来的问题 2. 场景 2.1 归并排序分：把数组从中间一分为二解：递归地对两个子数组进行归并排序合：合并有序子数组 2.2 快速排序分：选基准，阅读全文

posted @ 2022-01-28 15:36 pleaseAnswer 阅读(105) 评论(0) 推荐(0)

⑪ 进阶算法之“搜索算法”

摘要：一、理论 1. 排序和搜索简介排序：把某个乱序的数组变成升序或降序数组搜索：找出数组中某个元素的下标 1.1 js中的排序和搜索 js中的排序：sort() js中的搜索：indexOf() 1.2 排序算法冒泡排序选择排序插入排序归并排序快速排序 1.3 搜索算法顺序搜索二分搜索阅读全文

posted @ 2022-01-27 15:22 pleaseAnswer 阅读(54) 评论(0) 推荐(0)

⑩ 数据结构之“堆”

摘要：一、理论 1. 堆简介堆是一种特殊的完全二叉树所有的节点都大于等于（最大堆）或小于等于（最小堆）它的子节点 1.1 js中的堆 js中通常用数组表示堆左侧子节点的位置是 2*index+1 右侧子节点的位置是 2*index+2 父节点位置是(index-1)/2 1.2 应用堆能高效、快阅读全文

posted @ 2022-01-26 17:44 pleaseAnswer 阅读(128) 评论(0) 推荐(0)

⑨ 数据结构之“图”

摘要：一、理论 1. 图简介图是网络结构的抽象模型，是一组由边连接的节点图可以表示任何二元关系 js中没有图，但可以用Object和Array构建图图的表示法：邻接矩阵、邻接表、关联矩阵... 2. 图的表示法 2.1 邻接矩阵 2.2 邻接表 const graph = { 0: [1, 阅读全文

posted @ 2022-01-26 14:37 pleaseAnswer 阅读(69) 评论(0) 推荐(0)

⑧ 数据结构之“树”

摘要：一、理论 1. 树简介树是一种分层数据的抽象模型常见树：DOM树、级联选择、树形控件... js中没有树，但可以用Object和Array构建树树的常用操作：深度/广度优先遍历、先中后序遍历 2. 深度/广度优先遍历 const tree = { val: 'a', children: [ 阅读全文

posted @ 2022-01-20 15:17 pleaseAnswer 阅读(82) 评论(0) 推荐(0)

⑦ 数据结构之“字典”

摘要：一、理论 1. 字典简介与集合类似，字典也是一种存储唯一值的数据结构，是以键值对的形式存储的 es6中有字典Map 1.1 增 const m = new Map() m.set('a', 'aa') m.set('b', 'bb') 1.2 删 m.delete('b') m.clear( 阅读全文

posted @ 2022-01-20 15:14 pleaseAnswer 阅读(213) 评论(0) 推荐(0)

随笔分类 - js 系列