随笔分类 -  javascript

摘要:依赖安装 yarn add three yarn add @types/three yarn add d3-geo three库安装后在node_modules下其还包含核心three/src和插件three/example/jsm的源码,在开发调试时可以直接查阅。使用Three.js过程中会涉及到 阅读全文
posted @ 2024-12-24 23:42 爱喝可乐的咖啡 阅读(1709) 评论(2) 推荐(7) 编辑
摘要:原生的渐变方法 在SVG中提供的原生渐变方法有两种,分别为线性渐变linearGradient和径向渐变radialGradient。我们以一个稍微复杂的路径来作为模板,为其添加两种渐变效果: <svg width="800" height="300"> <defs> <linearGradient 阅读全文
posted @ 2024-02-17 00:10 爱喝可乐的咖啡 阅读(1522) 评论(0) 推荐(4) 编辑
摘要:接口定义 能够对于文字、段落乃至任何元素的精准定位 并做出增删改查,都是在开发一款富文本编辑器时一项最基本也是最重要的功能之一。让我们先来看看Slate中对于如何在文档树中定位元素是怎么定义的[源码]: /** * The `Location` interface is a union of the 阅读全文
posted @ 2023-10-02 23:49 爱喝可乐的咖啡 阅读(503) 评论(0) 推荐(1) 编辑
摘要:源码架构 首先来看下最核心的slate包下的目录: 可以看到,作为一个开源富文本库,其源码是相当之少。在第一篇文章中说过,Slate没有任何开箱即用的功能,只提供给开发者用于构建富文本所需的最基本的一套schema及操作API。因此源码的体量自然就要少许多。 我们来预览上图中各个目录下文件所负责的功 阅读全文
posted @ 2023-02-27 10:20 爱喝可乐的咖啡 阅读(515) 评论(0) 推荐(2) 编辑
摘要:笔者从大学时期就开始接触的前端,在刚去实习的时候就被导师安排去做内网的一个小富文本工具。之后从毕业后干的第一份工作游戏客户端,到现在做着可视化相关的前端工作,都有在做富文本相关的内容。可以说是和**富文本编辑器(Rich Text Editor)**有着不解之缘。 WYSIWYG 如无特别指出,该系 阅读全文
posted @ 2023-02-23 20:17 爱喝可乐的咖啡 阅读(499) 评论(1) 推荐(1) 编辑
摘要:Javascript的一些基础概念 JavaScript执行引擎在宿主环境中是单线程的,这意味着在同一时间内只能执行一个任务。在Javascript运行期间,引擎会创建和维护相应的堆(heap)和栈(stack)这两个数据结构;堆是存放数据变量的地方(这里很多前端er有个误区,认为js的引用类型存放 阅读全文
posted @ 2022-06-17 18:20 爱喝可乐的咖啡 阅读(297) 评论(1) 推荐(1) 编辑
摘要:本文不是关于Slate.js使用入门的文章,如果还不了解该框架,建议先阅读下官方的文档:Slate官网文档 关于Slate的一些特性 不同于其他编辑器类的库,Slate并不提供譬如粗体、斜体、字体色等开箱即用的功能 Slate只是提供了一套自己定义的核心数据模型,以此一些操作数据和选区相关的API 阅读全文
posted @ 2021-07-08 20:08 爱喝可乐的咖啡 阅读(3788) 评论(0) 推荐(3) 编辑
摘要:最近撸React的代码时踩了个关于事件处理的坑,场景如下:在监听某个元素上会频繁触发的事件时,我们往往会对该事件的回调函数进行防抖的处理;防抖的包装函数大致长这样: debounce = (fn, delay) => { let timer: any = null; return function( 阅读全文
posted @ 2020-09-12 18:21 爱喝可乐的咖啡 阅读(393) 评论(0) 推荐(1) 编辑
摘要:函数与闭包 函数创建 创建函数有两种方式,第一种是函数声明。函数声明有一个很重要的特征就是函数声明提升(function declaration hoisting),意思是在执行代脚本前会先读取所有的函数声明。这意味着可以把函数声明放在调用它的语句后面: 第二种方式是函数表达式: 既然是叫表达式,那 阅读全文
posted @ 2020-03-01 13:21 爱喝可乐的咖啡 阅读(181) 评论(0) 推荐(0) 编辑
摘要:继承与原型链 原型链 在原型那一节中,讲到了用于搜索对象属性的原型搜索机制;而原型链,本质上 就是对原型搜索机制的扩充: 回想下之前的内容,我们要读取一个Person的实例p属性,会先搜索实例p;如果没有的话 就去它指向的原型上找,即Person.prototype。 如果,我们把原型指向另一种类型 阅读全文
posted @ 2020-02-29 18:41 爱喝可乐的咖啡 阅读(202) 评论(0) 推荐(0) 编辑
摘要:构造函数与原型 构造函数模式 最简单的构造函数: function Person(name, age, job) { this.name = name; this.age = age; this.job = job; this.sayName = function() { console.log(t 阅读全文
posted @ 2020-02-28 22:40 爱喝可乐的咖啡 阅读(152) 评论(0) 推荐(0) 编辑
摘要:关于浏览器渲染 先来看一张webkit引擎的大致渲染流程: 页面渲染可分为下面几个步骤: 1. 处理HTML标记并构建DOM树 2. 处理CSS标记并构件CSSOM树 3. 将DOM与CSSOM树合并成一个渲染树 4. 根据渲染树来布局,计算每个节点的确切大小和位置 5. 将各节点绘制到屏幕上 关于 阅读全文
posted @ 2019-01-10 17:48 爱喝可乐的咖啡 阅读(296) 评论(1) 推荐(1) 编辑
摘要:JavaScript解释器在浏览器中是单线程的,这意味着浏览器在同一时间内只执行一个事件,对于其他的事件我们把它们排队在一个称为 执行栈(调用栈) 的地方。下表是一个单线程栈的抽象视图: 我们已经知道,当浏览器第一次加载你的script,它默认的进了全局执行环境。如果在你的全局代码中你调用了一个函数 阅读全文
posted @ 2018-12-27 10:34 爱喝可乐的咖啡 阅读(521) 评论(0) 推荐(0) 编辑
摘要:Handlebars.js下载地址:http://handlebarsjs.com/ 最近自己在建一个站,采用完全的前后端分离的方式,现在正在做前端的部分。其中有项功能是需要ajax调用后端接口,返回json数据后要动态的插入数据。但是一开始我自己是用最"传统"的通过js拼接html字符串,然后再用 阅读全文
posted @ 2017-07-30 17:38 爱喝可乐的咖啡 阅读(5285) 评论(1) 推荐(0) 编辑

点击右上角即可分享
微信分享提示