天行无忌的博客_前端开发

初学React useEffect Hook

React Hooks 是从功能组件访问 React 的状态和生命周期方法的最佳方式。 useEffect Hook 是一个在渲染之后和每次文档更新时运行的函数（效果）。在本文中，将讨论一些技巧以更好地使用 useEffect Hook。

数组

生命周期

react

useEffect

原创 2023-03-21 17:48:25 136 阅读

关于 JavaScript 中的 forEach 循环你不知道的 8 件事

在深入学习 JavaScript 之后，很快就能意识到两者之间存在差异。本文就来介绍一下关于 forEach 循环不知道的 8 个知识点：不支持处理异步函数、无法捕获异步函数中的错误、除了抛出异常之外，没有办法中止或跳出 forEach() 循环、forEach 删除自己的元素，索引无法重置、this 指向问题

作用域

数组

回调函数

forEach

原创 2023-03-16 22:40:20 329 阅读

useState 解决文本框无法输入的问题

有时，会遇到无法在 React 输入文本字段中键入内容的问题。在本文中，将研究如何解决无法在 React 输入文本字段中键入内容的问题，即通过使用钩子函数 useState。

函数式

React

useState

原创 2023-03-15 15:14:06 258 阅读

JavaScript 中深拷贝方法structuredClone

对于深拷贝，最容易也应该是常见的方法是使用 JSON.parse() + JSON.stringify() ，还有一个借助第三方脚本库 lodash ，其中方法 cloneDeep 可以实现深拷贝。现在可以使用原生的 structuredClone() 方法。

深拷贝

浅拷贝

JSON

原创 2023-03-10 23:36:45 425 阅读

JavaScript 对象管家 Proxy

JavaScript 在 ES6 中，引入了一个新的对象类型 Proxy，它可以用来代理另一个对象，并可以在代理过程中拦截、覆盖和定制对象的操作。Proxy 对象封装另一个对象并充当中间人，其提供了一个捕捉器函数

缓存

proxy

对象操作

js封装

原创精选 2023-03-09 12:53:27 293 阅读

3 个加强理解TypeScript 的面试问题

TypeScript 作为 JavaScript 的超集，让 JavaScript 越来越像一门“正经的”语言。和纯粹的 JavaScript 语言相比，TypeScript 提供静态的类型检查，提供类的语法糖（这一点是继承了 ES6 的实现），让程序更加规范和紧凑，为使用 JavaScript 开发大型项目提供了必要的条件。本文介绍 3 个加强理解的面试问题。

面试问题

递归

运行时

原创 2023-03-08 09:46:58 278 阅读

简介TS 的 class 构造函数 constructor 方法

在 TypeScript 的类中，constructor 方法是类的构造函数，用于初始化对象的属性和方法。虽然在 TypeScript 类中定义 constructor 方法不是必须的，但是通常建议在类中使用 constructor 方法，因为它有以下几个优点

构造函数

继承

依赖注入

原创精选 2023-03-07 13:55:19 2460 阅读

在 JavaScript 如何下载文件

在 Web 开发中，文件下载功能是一个非常常见的功能。在本文中，将介绍在 JavaScript 中如何实现下载文件。

下载文件

HTTP

blob

原创 2023-02-11 14:18:00 383 阅读

JavaScript 中获取数组最后一个元素3种方法及性能

当需要从 JavaScript 中的数组中获取最后一个元素时，有多种选择，本文将提供 3 种可用方法：利用数组长度属性、数组方法slice、数组方法pop。

数组

性能比较

赋值

原创精选 2023-02-05 22:55:15 702 阅读 1评论

读 2022 年 JavaScript 趋势报告

2023 年 1 月 12 日，《JavaScript 2022趋势调查报告》发布了。收集了 39,472 份调查报告，几乎是去年的两倍，涵盖了浏览器、开发者对 JavaScript 特性、代码库、技术、工具、资源等的内容。下面来一起看看这份报告，并加深对 JavaScript 的认识，在新的一年里提升一个档次。

Svelte

构建工具

前端开发

原创 2023-02-02 14:17:38 195 阅读

在 JavaScript 中编写Go式错误处理的async/await

ES7 引入 async/await 允许开发人员编写看起来像同步的异步 JavaScript 代码。在当前的 JavaScript 版本中，还可以使用 Promises，这些功能都是为了简化异步流程并避免回调地狱。

程序异常

async/await

原创推荐 2023-02-01 13:39:07 661 阅读

requestVideoFrameCallback() 简单实例

在文章《浏览器视频帧操作方法 requestVideoFrameCallback() 简介》中介绍了基本的使用情况，本文来体验一下其使用过程，后续将增加一些酷炫的实例。点击开始播放视频、暂停视频以读取元数据。在画布上绘制视频帧与实际视频帧速率同步的画面。GITHUB中包含整个代码实例，主要代码如下：<template> <div id="app">

播放视频

requestVideoFrameCal

video

原创推荐 2022-10-26 09:42:39 440 阅读

浏览器视频帧操作方法 requestVideoFrameCallback() 简介

HTMLVideoElement.requestVideoFrameCallback() 是一个新的WEB API，2021 年 1 月 25 日提交的草案。requestVideoFrameCallback() 方法允许WEB开发者注册一个回调方法，回调方法在新视频帧发送到合成器时在渲染步骤中运行。

HTMLVideoElement

requestVideoFrameCal

原创精选 2022-10-25 09:51:20 820 阅读

生成二维码或条形码JavaScript脚本库

二维码或条形码在日常生活中现在应用已经非常普遍了，文章分享生成条形码和二维码的JavaScript库。条形码条形码是日常生活中比较常见的，主要用于商品。通俗的理解就是一串字符串的集合（含字母、数字及其它ASCII字符的集合应用），用来常用来标识一个货品的唯一性，当然还有更多更深入与广泛的应用，像超市的商品、衣服、微信、支付宝、小程序等到处都有条形码的广泛应用；安装依赖：npm install js

javascript

小程序

qrcode

原创 2022-10-24 10:42:48 356 阅读

JSON 和 JavaScript 介绍与区别

Web 开发依赖于 JavaScript，但什么是 JSON，以及 JSON 与 JavaScript 的区别是什么？了解 WEB 背后的技术对于寻求创新和充分利用可用资源的团队来说非常重要。

javascript

json

编程语言

原创 2022-10-23 15:23:42 253 阅读 1评论

使用 ServiceWorker 提高性能

service worker 是一种在独立的处理线程上执行后台任务的 worker，允许用户拦截网络请求并有条件地将其存储在称为 CacheStorage API 的特殊缓存中，此类缓存不同于本地浏览器缓存，因为它允许在用户脱机的情况下从缓存中提供数据，还可以提高页面的性能。

浏览器缓存

原创精选 2022-10-23 15:18:53 417 阅读 1评论

适合初学者的 10 个 JavaScript 代码整洁技巧

什么是整洁的代码呢？答案可能因人而异，个人提倡以函数式风格编写代码，如果做得正确的话，代码将更容易阅读、分解和测试。在开始函数式编程之前，学习一些小的技巧有助于编写整洁的代码。最好的方式是阅读开源项目，学习别人的方式。对于JavaScript，ES6 引入了许多新的特性，也使得写代码多一种更加优雅的方式。

数组

代码优化

JavaScript

ES6

原创 2022-10-21 10:06:19 114 阅读 2评论

JavaScript 设计模式之代理模式

代理模式，代理（proxy）是一个对象，它可以用来控制对另一个对象的访问。

代理模式

缓存

html

原创精选 2022-10-21 09:51:24 247 阅读 4评论

了解 Vue 生命周期钩子

和其他框架一样，Vue 有许多生命周期钩子，它们允许将代码附加到在创建或使用 Vue 应用程序时发生的特定事件，如，当组件加载时、当组件被添加到页面时或者当某些东西被删除时。Vue 有很多生命周期钩子，令人困惑的是每个钩子的含义或作用。在本指南中，将介绍每个生命周期挂钩的作用以及如何使用它们。

生命周期

VUE

组合式API

原创精选 2022-10-20 10:00:22 431 阅读 2评论

Vue 中 created 和 mounted 的区别

大多数人在谈论生命周期钩子时会感到困惑的一件事是 created 和 mounted之间的区别。有着相似的名称，觉得应该做同样的事情，但还是有一些细微的差别。

生命周期

VUE

created

mounted

原创 2022-10-20 09:57:18 616 阅读

Vue 组件如何在设置 Props

在 Vue 中构建组件通常需要定义一些属性，以使组件可以更好复用，在这种情况下会使用 props 来自定义数据来传递数据。接下来以一个简单的组件来介绍如何使用组件 props 。

VUE

VUE组件

组件属性

原创精选 2022-10-20 09:54:35 488 阅读 1点赞 1评论

15 个用于创建漂亮图表的 JavaScript 库

仪表板是前端开发中常见的一个功能需求，对于一个平台来说仪表盘是一个具有吸引力的功能，实时的动态数据变化可以很好的增强平台的整体设计。在本文中，将展示一些用于图形和图表的最佳 JavaScript 库，这些库将有助于为未来的项目创建精美且可自定义的图表。虽然大多数库都是免费和开源的，但其中一些库提供了带有附加功能的付费版本。

javascript

图表库

d3

原创 2022-10-17 23:20:34 274 阅读

如何在 JavaScript 中让代码更加精简

解构赋值语法是一种 JavaScript 表达式，通过解构赋值, 可以将属性/值从对象/数组中取出，赋值给其他变量。这种语法是 ECMAscript 6 规范引入了一种新语法，可以更轻松地从数组和对象中获取值。

赋值

javascript

数据类型

对象解构

原创精选 2022-05-30 22:53:51 356 阅读

在 Node.js 中生成 UUID 的 3 种有效方法

通用唯一标识符 (UUID) 在项目开发中非常实用，在 Node.js 中有很多方法可以生成 UUID。其中之一是使用本机模块，而其他人则使用 NPM 包。在这篇文章中，将推荐几种在 Node.js 项目中生成 UUID 的方式，并简要了解何时以及为何使用它们。

node.js

标识符

uuid

原创 2022-05-13 23:13:33 10000+阅读 1收藏

再谈JavaScript 中的对象解构

解构赋值语法是一种 JavaScript 表达式，通过解构赋值, 可以将属性/值从对象/数组中取出，赋值给其他变量。这种语法是 ECMAscript 6 规范引入了一种新语法，可以更轻松地从数组和对象中获取值。

赋值

变量名

解构赋值

原创 2022-05-12 20:31:37 315 阅读

Orbiton JS：用于构建 UI 的 JavaScript 库

Orbiton JS 是一个用于创建 UI 的终极 JavaScript 库，是一个用于创建浏览器 UI 的轻量级极简 JavaScript 库，提供了一个易于使用的 API，用于创建快速、无痛的高性能应用程序。

javascript

Orbiton JS

jsx

原创 2022-03-27 17:23:36 214 阅读 yyds干货盘点

分享6个创意灵感的资源网站

关于设计及交互，主要是设计师或者交互设计师的岗位职责，但是个人觉得作为一名前端，需要对视觉有一定的追求，进而可以让自己对细节进行雕琢。因此对于前端工程师应该有自己的主题资源站，不是为了设计而是追求前端内容呈现上的灵感，积累交互设计的实现。

wordpress

网站设计

前端设计

原创 2022-03-24 22:52:52 1813 阅读 1点赞 yyds干货盘点

谈 JavaScript 函数表达式与函数声明

在 JavaScript 中创建函数有两种方法：函数表达式和函数声明。在本文中，将讨论何时使用函数表达式与函数声明，并解释它们之间的区别。

函数表达式

函数声明

匿名函数

原创 2022-03-23 21:59:26 818 阅读 yyds干货盘点

VUE构建数字时钟组件

VUE 前端开发目前算是数一数二的开发框架，个人认为上手容易，生态比较友好。本文就以代码为主，分享一个数字时钟组件。

数字时钟

vue

javascript

原创 2022-03-18 23:41:28 4868 阅读 1点赞 1收藏 yyds干货盘点

官方博客	全部文章	热门标签	班级博客
了解我们	网站地图	意见反馈

鸿蒙开发者社区	51CTO学堂
51CTO	软考资讯

51CTO博客

DevPoint:WEB开发技术点

初学React useEffect Hook

关于 JavaScript 中的 forEach 循环你不知道的 8 件事

useState 解决文本框无法输入的问题

JavaScript 中深拷贝方法structuredClone

JavaScript 对象管家 Proxy

3 个加强理解TypeScript 的面试问题

简介TS 的 class 构造函数 constructor 方法

在 JavaScript 如何下载文件

JavaScript 中获取数组最后一个元素3种方法及性能

读 2022 年 JavaScript 趋势报告

在 JavaScript 中编写Go式错误处理的async/await

requestVideoFrameCallback() 简单实例

浏览器视频帧操作方法 requestVideoFrameCallback() 简介

推荐 6 个实用的 Vue 组件库

生成二维码或条形码JavaScript脚本库

JSON 和 JavaScript 介绍与区别

使用 ServiceWorker 提高性能

适合初学者的 10 个 JavaScript 代码整洁技巧

JavaScript 设计模式之代理模式

了解 Vue 生命周期钩子

Vue 中 created 和 mounted 的区别

Vue 组件如何在设置 Props

15 个用于创建漂亮图表的 JavaScript 库

如何在 JavaScript 中让代码更加精简

在 Node.js 中生成 UUID 的 3 种有效方法

再谈JavaScript 中的对象解构

Orbiton JS：用于构建 UI 的 JavaScript 库

分享6个创意灵感的资源网站

谈 JavaScript 函数表达式与函数声明

VUE构建数字时钟组件

欢迎