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

16 个实用 JavaScript 代码片段：DOM、Cookie、数组、对象#yyds干货盘点#

在 JavaScript 的世界里，简洁的代码 == 更好，本文将通过项目开发设计的知识点整理一些可能涉及的 16 个JavaScript代码片段。

javascript

json

DOM

Cookies

原创 2021-12-23 18:21:02 270 阅读 yyds干货盘点

JavaScript 数组方法 .map() 的 5 个使用场景#yyds干货盘点#

.map() 函数是 JavaScript 数组结构中很实用的一个方法之一，其通过调用回调函数创建一个新数组。该函数访问调用数组中的每个元素。可以将 map() 方法视为经过一个循环并在回调函数中编写语句（格式化、数据处理）以构造一个新数组。

数组

回调函数

对象数组

map

原创精选 2021-12-19 13:05:39 986 阅读 yyds干货盘点

JavaScript 解构赋值 5 个常见场景和实例#yyds干货盘点#

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

数组

赋值

ECMAscript

解构赋值

原创 2021-12-13 20:17:06 266 阅读 yyds干货盘点

【Three.js】WEB3D项目开发中实用工具推荐#yyds干货盘点#

上一篇谈到元宇宙设想了一个由虚拟世界和3D技术广泛应用重塑的未来。Three.js 是一个非常令人印象深刻的 JavaScript 3D 库，它也使用 WebGL（或 2d Canvas）进行渲染。本文主要是介绍一些使用 Three.js 时的辅助工具，没有必要全部使用，但它们有时对项目开发非常有用。

github

3d

three.js

stats.js

原创 2021-12-12 21:20:34 1118 阅读 yyds干货盘点

#yyds干货盘点# JS中对象处理之Object.freeze 与 Object.seal

数据不变性在编程语言中一直非常重要，在 JavaScript 中也是如此。在这里，有两种 JavaScript 方法可以部分保证不变性：Object.freeze 和 Object.seal。本文来总结一下这两个方法都可以用来做什么？都有什么区别？存在什么不足之处

javascript

object

freeze

seal

原创 2021-12-11 21:53:21 297 阅读 yyds干货盘点

如何使用 JavaScript 扁平化/非扁平化嵌套 JSON 对象？#yyds干货盘点#

前端开发中，特别有接触过树形结构组件的项目中，这些组件很多都需要对JSON对象进行扁平化，而获取属性数据又需要对数据进行反操作。本文以代码的形式来展示如何使用 JavaScript 扁平化/非扁平化嵌套的 JSON 对象。

扁平化

json

JavaScript

原创 2021-12-10 20:58:14 1651 阅读 yyds干货盘点

用得上的JavaScript 代码片段和技巧 #yyds干货盘点#

一方面加深对 Javascript 语法的理解，一方面对代码进行归档。本文总结一些项目开发中用得上的使用方法及代码整洁的技巧。

localStorage

JSON

csv

Array

原创 2021-12-09 21:40:53 324 阅读 yyds干货盘点

前端开发中使用纯函数提纯非纯函数#yyds干货盘点#

理解纯函数和非纯函数是向更清晰、更基于角色和可测试的代码的简单过渡。在这篇文章中，将通过查看一个简单的体重指数（BMI）计算器来探索纯函数和非纯函数，该计算器通过一些简单的身高和体重输入因素来估算“健康体重”。

html

纯函数

非纯函数

原创 2021-12-08 14:37:04 158 阅读 yyds干货盘点

面向 JavaScript 开发人员的 5 大物联网库#yyds干货盘点#

作为一个前端工程师（JavaScript工程师），似乎觉得这一切有点模式，其实不然，现代 JavaScript 的可以使用的场景越来越多，包括物联网，在本文中，将介绍可以在 JavaScript 代码中用于连接设备的 5 个脚本库。

物联网

javascript

元宇宙

原创 2021-12-07 22:43:59 328 阅读 yyds干货盘点

了解学习 JSX 的工作方式#yyds干货盘点#

JSX，即 JavaScript XML，JavaScript 的语法扩展，允许在 JavaScript 文件中编写 HTML （这是个人内心抗拒的原因）。不必通过 JavaScript 对象创建、修改或者拼接 HTML ，可以使用类似 XML 的语法创建元素，编译运行时生成相应的 DOM 元素。

html

javascript

react

jsx

原创 2021-12-06 22:18:55 532 阅读 yyds干货盘点

JavaScript 中优雅处理对象的 6 个方法

和其他编程语言一样，JavaScript 有自己的数据类型，如数字、字符串、数组、对象等。而对象在JavaScript中是一种非常重要的数据类型，它们有很多有用的方法，在平常项目开发中可以使用这些方法容易地处理对象。

数组

javascript

freeze

assign

object

原创 2021-11-30 14:42:32 221 阅读

项目开发中 9 个实用的 JavaScript 函数

在项目开发过程中，会发现有一些代码反复需要，这些大部分是有第三方的脚本库来解决，有时不想为了一个功能安装一整个库，因此建议平时开发过程中将常用的函数封装成一个公共库。本文将带总结一下项目开发过程中可以用得到的函数。

json

字符串

javascript

类

object

原创 2021-11-30 14:40:22 130 阅读

Node.js 日志之winston使用指南

Winston 是强大、灵活的Node.js 开源日志库之一，理论上， Winston 是一个可以记录所有信息的记录器。这是一个高度直观的工具，易于定制。

日志文件

日志记录

winston

logger

原创 2021-11-30 14:35:48 913 阅读

JavaScript 中的文档对象模型 DOM

DOM，即文档对象模型，前端开发工程师必学的基础知识，趁着假期，顺便复习一下。在本文将介绍如何在 HTML 文档中选择元素、如何创建元素、如何更改内联 CSS 样式以及如何监听事件。

html

树结构

javascript

对象模型

选择器

原创 2021-11-30 14:25:08 166 阅读

细说包管理器 yarn 和 npm

每当 yarn 或 npm 需要安装包时，它们都会执行一系列任务。在 npm 中，这些任务是按包顺序逐个执行安装的，这意味着它会等待一个包完全安装，然后再继续下一个。

包管理器

安装包

json

yarn

原创 2021-11-30 14:19:42 215 阅读

谈JavaScript中纯函数与非纯函数#yyds干货盘点#

纯函数是函数式编程的基础，之前在优雅编码的文章中提到过，多写纯函数，本文来简单介绍一下纯函数和非纯函数的概念和区别。

javascript

前端开发

作用域

纯函数

原创 2021-11-28 21:37:51 288 阅读 yyds干货盘点

深入学习 CSS 中的伪元素 ::before 和 ::after#yyds干货盘点#

可用的 CSS 伪元素不是很多，但是，作为前端工程师熟悉它们很重要，每一个都有特定的用途，它们可以极大地改进项目 UI 。以下是常用的 CSS 伪元素：::after、::before、::first-letter、::first-line、::marker、::selection

伪元素

css

html

5e

样式表

原创 2021-11-27 11:03:27 282 阅读 yyds干货盘点

NodeJs 全栈创建多文件断点续传#yyds干货盘点#

文件上传，算是项目开发中比较常见的需求，本文将展示如何构建一个多文件断点续传组件，可以同时处理多个文件，并可以在出现异常或者网络中断的情况下恢复上传，可以手动暂停和恢复文件的上传。

json

文件上传

多文件

JavaScript

原创 2021-11-26 12:24:35 238 阅读 yyds干货盘点

JavaScript 中 Math.random() 生成随机数据#yyds干货盘点#

Math.random() 将生成一个介于0（包括）和 1（不包括）之间的伪随机浮点数（带有小数的数），随机数并不意味着总是得到一个唯一的数字，它会在一段时间后产生相同的数字。

字符串

十六进制

随机颜色

Math

random

原创 2021-11-25 19:54:46 1119 阅读 yyds干货盘点

JavaScript 数组展平方法： flat() 和 flatMap()#yyds干货盘点#

从 ES2019 中开始引入了一种扁平化数组的新方法，可以展平任何深度的数组，这个方法就是 flat() 。而说起 flat() 的方法，就不得不顺便说下 flatMap() 。

递归

数组操作

flat

flatMap

原创 2021-11-24 17:40:40 399 阅读 yyds干货盘点

【Three.js】随着元宇宙开启WEB3D之路#yyds干货盘点#

Three.js 是Ricardo Cabello（@mrdoob）在2010年开发的一个JavaScript库（如今它在Github上有许多贡献者）。这个令人难以置信的工具让用户可以在浏览器上处理 3D 图形，使用 WebGL 技术非常简单和直观的方式来实现。而 WebGL 技术已经非常普及和被浏览器广泛支持。

渲染器

3d

github

置顶原创 2021-11-23 22:26:35 875 阅读 yyds干货盘点

JavaScript 数组方法 splice() 的 3 个示例#yyds干货盘点#

splice() 方法可以从数组中排除旧值，然后将新值插入数组。使用 splice() 后，将获得两个数组，第一个是排除的数组，第二个是编辑过的新数组。需要注意的是，此方法会改变原数组。

数组

删除元素

数组元素

原创 2021-11-22 22:43:15 353 阅读 yyds干货盘点

先睹为快即将到来的HTML6#yyds干货盘点#

HTML6 爱好者相信即将到来的更新将允许浏览器调整图像大小以获得更好的观看体验。

html

javascript

身份验证

加载

数据

置顶原创 2021-11-21 12:28:57 530 阅读 yyds干货盘点

Vue3、Vuex4、Ant Design2 的实战项目开发管理系统

蜡笔（Crayon）管理模板，是一个学习性质的管理模板，借此机会学习一些最新的前端框架，也希望有一些志同道合的小伙伴加入，从中学习提高自己的技能。为什么叫蜡笔，蜡笔可以为画填上色彩，寓意点缀美好生活和职业生涯。蜡笔（Crayon）管理模板基于Vue3+、Vuex4+、Ant Design2，并准备好使用REST API作为数据通讯标准，以Vite作为构建工具。蜡笔（Crayon）项目地址：http

Crayon

vuex4

vite

置顶原创 2021-04-28 09:28:09 938 阅读

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

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

51CTO博客

DevPoint:WEB开发技术点

16 个实用 JavaScript 代码片段：DOM、Cookie、数组、对象#yyds干货盘点#

JavaScript 数组方法 .map() 的 5 个使用场景#yyds干货盘点#

JavaScript 解构赋值 5 个常见场景和实例#yyds干货盘点#

【Three.js】WEB3D项目开发中实用工具推荐#yyds干货盘点#

#yyds干货盘点# JS中对象处理之Object.freeze 与 Object.seal

如何使用 JavaScript 扁平化/非扁平化嵌套 JSON 对象？#yyds干货盘点#

用得上的JavaScript 代码片段和技巧 #yyds干货盘点#

前端开发中使用纯函数提纯非纯函数#yyds干货盘点#

面向 JavaScript 开发人员的 5 大物联网库#yyds干货盘点#

了解学习 JSX 的工作方式#yyds干货盘点#

JavaScript 中优雅处理对象的 6 个方法

项目开发中 9 个实用的 JavaScript 函数

Node.js 日志之winston使用指南

JavaScript 中的文档对象模型 DOM

细说包管理器 yarn 和 npm

谈JavaScript中纯函数与非纯函数#yyds干货盘点#

深入学习 CSS 中的伪元素 ::before 和 ::after#yyds干货盘点#

NodeJs 全栈创建多文件断点续传#yyds干货盘点#

JavaScript 中 Math.random() 生成随机数据#yyds干货盘点#

JavaScript 数组展平方法： flat() 和 flatMap()#yyds干货盘点#

【Three.js】随着元宇宙开启WEB3D之路#yyds干货盘点#

JavaScript 数组方法 splice() 的 3 个示例#yyds干货盘点#

先睹为快即将到来的HTML6#yyds干货盘点#

Vue3、Vuex4、Ant Design2 的实战项目开发管理系统

欢迎