随笔分类 - javascript
摘要:发展历史 简要的提及一下,异步流程控制的发展历史大概是 callback hell => Promise => Generator => async/await ES6 中 Promise 是通过 .then().then().catch() 的方式来解决 callback 多层嵌套的问题。但 Pr
阅读全文
摘要:水平扩展 Node.js 应用程序 水平扩展是复制应用程序实例以管理大量传入连接。 此操作可以在单个多内核机器上执行,也可以在不同机器上执行。垂直扩展是提高单机性能,它不涉及代码方面的特定工作。在同一台机器上的多进程提高应用程序吞吐量的一种常用方法是为机器的每个内核生成一个进程。 通过这种方式,No
阅读全文
摘要:困在笼子里的Web Worker 在使用Web Worker前我们要了解它的能力边界,让我们避免无谓的撞壁: 同源限制 1.1. 以http(s)://协议加载给WebWorker线程运行的脚本时,其URL必须和UI线程所属页面的URL同源;1.2. 不能加载客户端本地脚本给WebWorker线程运
阅读全文
摘要:最近在使用d3 zoom得时候 遇到一个小坑 直接对元素添加 zoom事件 会有很大得抖动,查文档 看代码之后发现是 由于元素在不断变化, 所以计算基础值也不不断变化,所以会导致计算出来得值 忽大忽小 从而造成抖动 解决办法 :在他父元素上添加事件 然后在子元素上添加style 方法 具体代码 _a
阅读全文
摘要:1.回调函数 我们编写一个问候的函数,首先创建一个函数greet(name),该函数返回欢迎消息: function greet(name) { return `Hello, ${name}!`; } greet('fly63'); // => 'Hello, fly63!' 如果要向一些人问候怎么
阅读全文
摘要:animejs 是现如今非常不错的一个 js 动画库。我们将其与 react Hooks 融合,使它更方便的在 react 中使用。 最终效果: const Animate: React.FC = () => { const { animateTargetRef, animationRef } =
阅读全文
摘要:简介 早期的 Web 网站主要由 html 和 css 组成。如果有任何 JavaScript 的代码需要在页面中执行,通常是以小的代码片段的形式来提供功能和交互性。结果就是通常 JavaScript 的代码都会被编写在一个文件中,然后通过 script 标签加载到页面中。开发人员可以将 JavaS
阅读全文
摘要:js 是种弱类型语言,对变量的类型没有限制。例如,如果我们使用字符串类型创建了一个变量,后面又可以为同一变量分配一个数字: let message = 'Hello'; // 分配一个字符串 message = 14; // 分配一个数字 这种动态性为我们提供了灵活性并简化了变量声明。 不好方面,我
阅读全文
摘要:当你的用户需要一些额外的上下文来放置图标,或者当他们需要一些保证来点击按钮,或者可能是一个复活节彩蛋的标题来搭配一个图片时,工具提示是一个很好的方法来增强用户界面。现在让我们来制作一些动画工具提示,只使用html和css。 演示 以下是我们的工作目标: 主要目标是拥有一种添加工具提示的简单方法,因此
阅读全文
摘要:在css中有很多好看的样式都可以实现,css设置出来的样式让整个网页看起来也会非常美观,今天的这篇文章就给大家来介绍一下在css中怎么设置文字的透明度,让你的文字在网页中看起来是透明的。 CSS设置透明度可用如下两类方法实现: 1、使用rgba2、使用opacity 使用rgba设置文字不透明度的方
阅读全文
摘要:推入任务队列后的时间不准确 定时器代码: setInterval(fn(), N); 上面这句代码的意思其实是fn()将会在 N 秒之后被推入任务队列。 所以,在 setInterval 被推入任务队列时,如果在它前面有很多任务或者某个任务等待时间较长比如网络请求等,那么这个定时器的执行时间和我们预
阅读全文
摘要:1. 文件转 Base64 在大规模使用 FileSystem接口之前,前端读取文件主要靠 input[type='file'] 元素。开发者通常会随手创建一个 FileReader 实例来读取文件,用完之后随即抛弃之,不得不说真是无情。实际上这个实例是可以复用起来的: /** * @method
阅读全文
摘要:实参和形参 在解释默认函数参数之前,重要的是要知道参数的默认值是什么。所以我们先回顾函数中实参和形参之间的区别。 在下面的代码中,我们创建一个函数,该函数返回一个给定数的立方: function cube(x) { return x * x * x } 此示例中的x变量是一个参数-传递给函数的命名变
阅读全文
摘要:拖拽属于前端常见的功能,很多效果都会用到js的拖拽功能。滑动条的核心功能也就是使用js拖拽滑块来修改位置。一个完整的滑动条包括 滑动条、滑动痕迹、滑块、文本 等元素,先把html代码写出来,如下所示: <div class="bar_wrap" id="wrap"><!--外包裹元素--> <div
阅读全文
摘要:手写Promise实现过程 1、实现Promise的核心功能 2、判断下当执行器里面时异步代码时的回调函数调用情况 3、then方法多次调用的情况 4、then方法的链式调用,以及如何把then方法的返回值传递到下一个then方法中,再判断返回值是普通值还是peomise对象进而进一步处理 5、判断
阅读全文
摘要:前言 在浏览一些图片网站的时候,经常会看到很多的漂亮的星空图,比如,下面的图片。其实这种星星图片的效果,也可以通过html+css样式和js的方式来实现。今天教大家如何实现星星图的效果。 实现的目标 每次刷新产生随机的星星个数。显示画布上。 项目实现 1. 创建canvas画布 <body> <ca
阅读全文
摘要:一、构造函数 构造函数模式的目的就是为了创建一个自定义类,并且创建这个类的实例。构造函数模式中拥有了类和实例的概念,并且实例和实例之间是相互独立的,即实例识别。 构造函数就是一个普通的函数,创建方式和普通函数没有区别,不同的是构造函数习惯上首字母大写。另外就是调用方式的不同,普通函数是直接调用,而构
阅读全文
摘要:关于nvm 我们可在同时进行多个项目时,可能会出现不同项目所使用的node版本是不一样的情况,或者需要使用其他版本node进行测试。在面临这种情况时,我们就可以使用nvm解决管理多个node版本的问题,它可以方便的在同一台设备上进行多个node版本之间切换,注意:如果您之前单独安装了node,建议先
阅读全文
摘要:开始引入类型 花了 10 个小时使用 console.log 排查问题后,你终于修复了 Cannot read property 'x' of undefined 问题,出现这个问题的原因是调用了可能为 undefined 的某个方法,给了你一个「惊喜」!你暗暗发誓,一定要把整个项目迁移到 Type
阅读全文
摘要:由于字符串、对象和数组没有固定大小,所有当他们的大小已知时,才能对他们进行动态的存储分配。JavaScript程序每次创建字符串、数组或对象时,解释器都必须分配内存来存储那个实体。只要像这样动态地分配了内存,最终都要释放这些内存以便他们能够被再用,否则,JavaScript的解释器将会消耗完系统中所
阅读全文