前端充电宝_社区达人页

2022年05月

• 05.17 23:43:30
  发表了文章 2022-05-17 23:43:30

  20+个超级实用的 JavaScript 开发技巧（下）

  今天来分享几个JavaScript开发技巧，希望对你有所帮助~

  
• 05.17 23:43:07
  发表了文章 2022-05-17 23:43:07

  20+个超级实用的 JavaScript 开发技巧（上）

  今天来分享几个JavaScript开发技巧，希望对你有所帮助~
• 05.17 23:39:39
  发表了文章 2022-05-17 23:39:39

  一文读懂 CSS 单位

  说起CSS单位，我们最熟悉的可能就是像素单位（px），它是一个绝对单位，也就是说一个10px的文字，放在哪里都是一样大的。单位可以影响颜色、距离、尺寸等一系列的属性。CSS中单位的形式有很多种，下面就分别来看看这些单位。

  
• 05.17 23:30:27
  发表了文章 2022-05-17 23:30:27

  60+ 实用 React 工具库，助力你高效开发！（下）

  最近看到一些实用的React工具库，总结了一下分享给大家，避免重复造轮子。希望对你有所帮助~
• 05.17 23:30:21
  发表了文章 2022-05-17 23:30:21

  60+ 实用 React 工具库，助力你高效开发！（上）

  最近看到一些实用的React工具库，总结了一下分享给大家，避免重复造轮子。希望对你有所帮助~
• 05.17 23:26:45
  发表了文章 2022-05-17 23:26:45

  使用 React Hooks 时要避免的6个错误

  今天来看看在使用React hooks时的一些坑，以及如何正确的使用避免这些坑。

  
• 05.17 23:24:39
  发表了文章 2022-05-17 23:24:39

  12 个 npm 使用技巧，提升你的开发效率！（下）

  今天总结了 npm 常用的一些命令分享给大家，希望对你有所帮助！

  
• 05.17 23:23:45
  发表了文章 2022-05-17 23:23:45

  12 个 npm 使用技巧，提升你的开发效率！（上）

  今天总结了 npm 常用的一些命令分享给大家，希望对你有所帮助！

  
• 05.17 23:20:29
  发表了文章 2022-05-17 23:20:29

  33个非常实用的JavaScript一行代码，建议收藏！（下）

  最近在国外技术社区看到了一些关于一行代码的文章，感觉很有意思，就整理了一下来分享给大家，希望对你有所帮助~ 这些方法使用到了一些API，简化了操作，但是有些方法写一行属实不太优雅，所以这里主要还是学习API的使用技巧！
• 05.17 23:20:15
  发表了文章 2022-05-17 23:20:15

  33个非常实用的JavaScript一行代码，建议收藏！（上）

  最近在国外技术社区看到了一些关于一行代码的文章，感觉很有意思，就整理了一下来分享给大家，希望对你有所帮助~ 这些方法使用到了一些API，简化了操作，但是有些方法写一行属实不太优雅，所以这里主要还是学习API的使用技巧！
• 05.17 23:10:23
  发表了文章 2022-05-17 23:10:23

  你需要知道的 19 个 console 实用调试技巧（下）

  众所周知，浏览器的开发者工具为我们提供了强大的调试系统，可以用来查看DOM树结构、CSS样式调试、动画调试、JavaScript代码断点调试等。今天我们就来看看console调试的那些实用的调试技巧。​

  
• 05.17 23:08:35
  发表了文章 2022-05-17 23:08:35

  你需要知道的 19 个 console 实用调试技巧（上）

  众所周知，浏览器的开发者工具为我们提供了强大的调试系统，可以用来查看DOM树结构、CSS样式调试、动画调试、JavaScript代码断点调试等。今天我们就来看看console调试的那些实用的调试技巧。​

  
• 05.17 23:05:31
  发表了文章 2022-05-17 23:05:31

  关于前端大管家 package.json，你知道多少？（下）

  今天来看看前端的大管家package.json文件相关的配置，充分了解这些配置有助于我们提高开发的效率，规范我们的项目。文章内容较多，建议先收藏在学习！ 在每个前端项目中，都有package.json文件，它是项目的配置文件，常见的配置有配置项目启动、打包命令，声明依赖包等。package.json文件是一个JSON对象，该对象的每一个成员就是当前项目的一项设置。package.json作为前端的大管家，到底有哪些配置和我们的日常开发密切相关？下面就来仔细剖析一下这个文件。
• 05.17 23:04:48
  发表了文章 2022-05-17 23:04:48

  关于前端大管家 package.json，你知道多少？（中）

  今天来看看前端的大管家package.json文件相关的配置，充分了解这些配置有助于我们提高开发的效率，规范我们的项目。文章内容较多，建议先收藏在学习！ 在每个前端项目中，都有package.json文件，它是项目的配置文件，常见的配置有配置项目启动、打包命令，声明依赖包等。package.json文件是一个JSON对象，该对象的每一个成员就是当前项目的一项设置。package.json作为前端的大管家，到底有哪些配置和我们的日常开发密切相关？下面就来仔细剖析一下这个文件。
• 05.17 23:04:28
  发表了文章 2022-05-17 23:04:28

  关于前端大管家 package.json，你知道多少？（上）

  今天来看看前端的大管家package.json文件相关的配置，充分了解这些配置有助于我们提高开发的效率，规范我们的项目。文章内容较多，建议先收藏在学习！ 在每个前端项目中，都有package.json文件，它是项目的配置文件，常见的配置有配置项目启动、打包命令，声明依赖包等。package.json文件是一个JSON对象，该对象的每一个成员就是当前项目的一项设置。package.json作为前端的大管家，到底有哪些配置和我们的日常开发密切相关？下面就来仔细剖析一下这个文件。

  
• 05.17 22:55:57
  发表了文章 2022-05-17 22:55:57

  如何优雅地在 React 中使用TypeScript，看这一篇就够了！（4）

  毕业已有3月有余，工作用的技术栈主要是React hooks + TypeScript。其实在单独使用 TypeScript 时没有太多的坑，不过和React结合之后就会复杂很多。本文就来聊一聊TypeScript与React一起使用时经常遇到的一些类型定义的问题。阅读本文前，希望你能有一定的React和TypeScript基础

  
• 05.17 22:54:09
  发表了文章 2022-05-17 22:54:09

  如何优雅地在 React 中使用TypeScript，看这一篇就够了！（3）

  毕业已有3月有余，工作用的技术栈主要是React hooks + TypeScript。其实在单独使用 TypeScript 时没有太多的坑，不过和React结合之后就会复杂很多。本文就来聊一聊TypeScript与React一起使用时经常遇到的一些类型定义的问题。阅读本文前，希望你能有一定的React和TypeScript基础

  
• 05.17 22:52:41
  发表了文章 2022-05-17 22:52:41

  如何优雅地在 React 中使用TypeScript，看这一篇就够了！（2）

  毕业已有3月有余，工作用的技术栈主要是React hooks + TypeScript。其实在单独使用 TypeScript 时没有太多的坑，不过和React结合之后就会复杂很多。本文就来聊一聊TypeScript与React一起使用时经常遇到的一些类型定义的问题。阅读本文前，希望你能有一定的React和TypeScript基础

  
• 05.17 22:51:11
  发表了文章 2022-05-17 22:51:11

  如何优雅地在 React 中使用TypeScript，看这一篇就够了！（1）

  毕业已有3月有余，工作用的技术栈主要是React hooks + TypeScript。其实在单独使用 TypeScript 时没有太多的坑，不过和React结合之后就会复杂很多。本文就来聊一聊TypeScript与React一起使用时经常遇到的一些类型定义的问题。阅读本文前，希望你能有一定的React和TypeScript基础

  
• 05.17 22:47:21
  发表了文章 2022-05-17 22:47:21

  画了20张图，详解浏览器渲染引擎工作原理（下）

  今天我们来学习一下浏览器渲染引擎的工作原理，文章内容较多，建议先收藏再学习！ 先来看看Chrome浏览器的架构图：

  
• 05.17 22:47:16
  发表了文章 2022-05-17 22:47:16

  画了20张图，详解浏览器渲染引擎工作原理（中）

  今天我们来学习一下浏览器渲染引擎的工作原理，文章内容较多，建议先收藏再学习！ 先来看看Chrome浏览器的架构图：

  
• 05.17 22:47:12
  发表了文章 2022-05-17 22:47:12

  画了20张图，详解浏览器渲染引擎工作原理（上）

  今天我们来学习一下浏览器渲染引擎的工作原理，文章内容较多，建议先收藏再学习！ 先来看看Chrome浏览器的架构图：

  
• 05.17 22:40:02
  发表了文章 2022-05-17 22:40:02

  实现九宫格布局，你能想到多少种方法？

  最近看到一个面试题：实现一个九宫格布局，用尽可能多的方式去实现？ 搜了一下牛客面经，腾讯、字节、百度、网易、京东等的面经中都出现过这道题目。所以今天就来实现一下，看有多少种实现方式（下面实现的九宫格布局是自适应页面大小的）

  
• 05.17 22:38:42
  发表了文章 2022-05-17 22:38:42

  国庆节到了，实现一个生成国庆风头像小工具，详解实现过程！

  明天就是国庆节了，最近看到好多好友换了国庆风的头像，感觉这个挺有意思，就找到了类似的源码研究了一番，并进行了改造（并非原创，只是进行了改造，只要想分享一下实现思路）。下面就来看看如何实现一键生成国庆风头像小工具。​

  
• 05.17 22:35:24
  发表了文章 2022-05-17 22:35:24

  你需要知道的30个ES6—ES12开发技巧！（4）

  又是一顿爆肝，又是一篇万字长文，重新梳理了一下ES6——ES12的常用新特性，很多特性在开发中还是很实用的，希望对你有一点点帮助！文章内容较多，建议先收藏在学习呢！ ECMAScript 是一种由 Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言，这种语言被称为 JavaScript 。简单来说，ECMAScript 是 JavaScript 的标准与规范，JavaScript 是 ECMAScript 标准的实现和扩展。
• 05.17 22:33:27
  发表了文章 2022-05-17 22:33:27

  你需要知道的30个ES6—ES12开发技巧！（3）

  又是一顿爆肝，又是一篇万字长文，重新梳理了一下ES6——ES12的常用新特性，很多特性在开发中还是很实用的，希望对你有一点点帮助！文章内容较多，建议先收藏在学习呢！ ECMAScript 是一种由 Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言，这种语言被称为 JavaScript 。简单来说，ECMAScript 是 JavaScript 的标准与规范，JavaScript 是 ECMAScript 标准的实现和扩展。

  
• 05.17 22:31:46
  发表了文章 2022-05-17 22:31:46

  你需要知道的30个ES6—ES12开发技巧！（2）

  又是一顿爆肝，又是一篇万字长文，重新梳理了一下ES6——ES12的常用新特性，很多特性在开发中还是很实用的，希望对你有一点点帮助！文章内容较多，建议先收藏在学习呢！ ECMAScript 是一种由 Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言，这种语言被称为 JavaScript 。简单来说，ECMAScript 是 JavaScript 的标准与规范，JavaScript 是 ECMAScript 标准的实现和扩展。
• 05.17 22:30:13
  发表了文章 2022-05-17 22:30:13

  你需要知道的30个ES6—ES12开发技巧！（1）

  又是一顿爆肝，又是一篇万字长文，重新梳理了一下ES6——ES12的常用新特性，很多特性在开发中还是很实用的，希望对你有一点点帮助！文章内容较多，建议先收藏在学习呢！ ECMAScript 是一种由 Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言，这种语言被称为 JavaScript 。简单来说，ECMAScript 是 JavaScript 的标准与规范，JavaScript 是 ECMAScript 标准的实现和扩展。

  
• 05.17 22:27:08
  发表了文章 2022-05-17 22:27:08

  JavaScript 28个常用字符串方法及使用技巧（下）

  今天再来看一些JavaScript基础知识，基础太重要了。还清楚的记得，今年春招的时候，某大厂面试官狠狠的嘲讽我 JavaScript 的API都记不住太尴尬了，主要还是用的太少了，所以平时还是要多用多积累。今天我们就来看看JavaScript中有哪些常用的字符串方法！
• 05.17 22:26:20
  发表了文章 2022-05-17 22:26:20

  JavaScript 28个常用字符串方法及使用技巧（上）

  今天再来看一些JavaScript基础知识，基础太重要了。还清楚的记得，今年春招的时候，某大厂面试官狠狠的嘲讽我 JavaScript 的API都记不住太尴尬了，主要还是用的太少了，所以平时还是要多用多积累。今天我们就来看看JavaScript中有哪些常用的字符串方法！

  
• 05.17 20:12:27
  发表了文章 2022-05-17 20:12:27

  关于 JavaScript 数据类型，有哪些你不知道的细节？（下）

  大家好，今天我们再来看点基础知识，看看JavaScript数据类型中的一些细节。 数据类型是计算机语言的基础知识，数据类型广泛用于变量、函数参数、表达式、函数返回值等场合。JavaScript 规定了八种数据类型：未定义（Undefined）、空（Null）、数字（Number）、字符串（String）、布尔值（Boolean）、符号（Symbol）、任意大整数（BigInt）、对象（Object）。
• 05.17 20:12:23
  发表了文章 2022-05-17 20:12:23

  关于 JavaScript 数据类型，有哪些你不知道的细节？（上）

  大家好，今天我们再来看点基础知识，看看JavaScript数据类型中的一些细节。 数据类型是计算机语言的基础知识，数据类型广泛用于变量、函数参数、表达式、函数返回值等场合。JavaScript 规定了八种数据类型：未定义（Undefined）、空（Null）、数字（Number）、字符串（String）、布尔值（Boolean）、符号（Symbol）、任意大整数（BigInt）、对象（Object）。

  
• 05.17 20:03:29
  发表了文章 2022-05-17 20:03:29

  24个 JavaScript 循环遍历方法，你都知道吗？（下）

  一、数组遍历方法 1. forEach() forEach 方法用于调用数组的每个元素，并将元素传递给回调函数。数组中的每个值都会调用回调函数。其语法如下：

  
• 05.17 20:03:19
  发表了文章 2022-05-17 20:03:19

  24个 JavaScript 循环遍历方法，你都知道吗？（上）

  一、数组遍历方法 1. forEach() forEach 方法用于调用数组的每个元素，并将元素传递给回调函数。数组中的每个值都会调用回调函数。其语法如下：
• 05.17 19:58:58
  发表了文章 2022-05-17 19:58:58

  浅谈 JavaScript 变量提升

  在 ECMAScript6 中，新增了 let 和 const 关键字用来声明变量。在前端面试中也常被问到 let、const和 var 的区别，这就涉及到了变量提升、暂时性死区等知识点。下面就来看看什么是变量提升和暂时性死区。

  
• 05.17 19:55:57
  发表了文章 2022-05-17 19:55:57

  雅虎35条军规，你知道几条？（下）

  在工作中，前端的性能优化是非常重要的，那我们该从何入手？可以遵循雅虎前端优化35条军规，虽然这些“军规”中一些的原则有些过时（比如CSS Sprite，不会真的还有人在用雪碧图吧，不会吧不会吧😲），但是仍然能为我们的前端优化指明方向。下面就来看看雅虎这35条军规
• 05.17 19:55:35
  发表了文章 2022-05-17 19:55:35

  雅虎35条军规，你知道几条？（上）

  在工作中，前端的性能优化是非常重要的，那我们该从何入手？可以遵循雅虎前端优化35条军规，虽然这些“军规”中一些的原则有些过时（比如CSS Sprite，不会真的还有人在用雪碧图吧，不会吧不会吧😲），但是仍然能为我们的前端优化指明方向。下面就来看看雅虎这35条军规
• 05.17 19:51:34
  发表了文章 2022-05-17 19:51:34

  不必硬背，彻底理解JavaScript中的this指向！（上）

  1. 执行上下文 提到 this，还得从执行上下文说起。在执行上下文中，包含了变量环境、词法环境、外部环境、this：

  
• 05.17 19:51:31
  发表了文章 2022-05-17 19:51:31

  不必硬背，彻底理解JavaScript中的this指向！（下）

  1. 执行上下文 提到 this，还得从执行上下文说起。在执行上下文中，包含了变量环境、词法环境、外部环境、this：

  
• 05.17 19:48:43
  发表了文章 2022-05-17 19:48:43

  彻底理解CSS Flexbox布局，看这一篇就够了！（下）

  一、Flexbox布局的概念 Flexbox布局也叫Flex布局，弹性盒子布局。它的目标是提供一个更有效地布局、对齐方式，并且能够使父元素在子元素的大小未知或动态变化情况下仍然能够分配好子元素之间的间隙。主要思想是使父元素能够调整子元素的宽度、高度、排列方式，从而更好的适应可用的布局空间。设定为flex布局的元素能够放大子元素使之尽可能填充可用空间，也可以收缩子元素使之不溢出。 ​

  
• 05.17 19:48:25
  发表了文章 2022-05-17 19:48:25

  彻底理解CSS Flexbox布局，看这一篇就够了！（上）

  一、Flexbox布局的概念 Flexbox布局也叫Flex布局，弹性盒子布局。它的目标是提供一个更有效地布局、对齐方式，并且能够使父元素在子元素的大小未知或动态变化情况下仍然能够分配好子元素之间的间隙。主要思想是使父元素能够调整子元素的宽度、高度、排列方式，从而更好的适应可用的布局空间。设定为flex布局的元素能够放大子元素使之尽可能填充可用空间，也可以收缩子元素使之不溢出。 ​

  
• 05.17 19:45:09
  发表了文章 2022-05-17 19:45:09

  如何实现一个深浅拷贝？（下）

  浅拷贝是指，一个新的对象对原始对象的属性值进行精确地拷贝，如果拷贝的是基本数据类型，拷贝的就是基本数据类型的值；如果拷贝的是引用数据类型，拷贝的就是内存地址。如果其中一个对象的引用内存地址发生改变，另一个对象也会发生变化。

  
• 05.17 19:44:49
  发表了文章 2022-05-17 19:44:49

  如何实现一个深浅拷贝？（上）

  浅拷贝是指，一个新的对象对原始对象的属性值进行精确地拷贝，如果拷贝的是基本数据类型，拷贝的就是基本数据类型的值；如果拷贝的是引用数据类型，拷贝的就是内存地址。如果其中一个对象的引用内存地址发生改变，另一个对象也会发生变化。
• 05.17 19:41:33
  发表了文章 2022-05-17 19:41:33

  TS进阶篇 | TS高级类型之字面量类型、联合类型、交叉类型（下）

  TypeScript中除了基本类型之外，还定义了很多高级类型，高级类型包括字面量类型、联合类型、交叉类型、索引类型、映射类型、条件类型、this类型等。因为内容太多，所以这篇文章先来介绍前三个类型，其余类型会在高级类型的下篇介绍。
• 05.17 19:41:29
  发表了文章 2022-05-17 19:41:29

  TS进阶篇 | TS高级类型之字面量类型、联合类型、交叉类型（上）

  TypeScript中除了基本类型之外，还定义了很多高级类型，高级类型包括字面量类型、联合类型、交叉类型、索引类型、映射类型、条件类型、this类型等。因为内容太多，所以这篇文章先来介绍前三个类型，其余类型会在高级类型的下篇介绍。

  
• 05.17 19:38:41
  发表了文章 2022-05-17 19:38:41

  前端性能优化系列 | 加载优化（下）

  1. 资源加载优先级 在浏览器发起网络请求时，并非每个字节都具有相同的优先级，所以，浏览器通常会对所要加载的内容进行推测，将相对重要的信息先呈现给用户。比如浏览器一般会先加载CSS，再去加载JavaScript脚本和图像文件。当然，浏览器的判断并不一定都是准确的，下面就来看看如何影响浏览器对资源加载的优先级。

  
• 05.17 19:38:28
  发表了文章 2022-05-17 19:38:28

  前端性能优化系列 | 加载优化（上）

  1. 资源加载优先级 在浏览器发起网络请求时，并非每个字节都具有相同的优先级，所以，浏览器通常会对所要加载的内容进行推测，将相对重要的信息先呈现给用户。比如浏览器一般会先加载CSS，再去加载JavaScript脚本和图像文件。当然，浏览器的判断并不一定都是准确的，下面就来看看如何影响浏览器对资源加载的优先级。

  
• 05.17 19:34:59
  发表了文章 2022-05-17 19:34:59

  TS入门篇 | 详解 TypeScript 类类型（下）

  传统的面向对象语言都是基于类的，而JavaScript是基于原型的。在ES6中拥有了class关键字，虽然它的本质依旧是构造函数，但是能够让开发者更舒服的使用class了。 TypeScript 作为 JavaScript 的超集，自然也是支持 class 全部特性的，并且还可以对类的属性、方法等进行静态类型检测。下面就来看看 TypeScript 中的类类型。
• 05.17 19:34:05
  发表了文章 2022-05-17 19:34:05

  TS入门篇 | 详解 TypeScript 类类型（上）

  传统的面向对象语言都是基于类的，而JavaScript是基于原型的。在ES6中拥有了class关键字，虽然它的本质依旧是构造函数，但是能够让开发者更舒服的使用class了。 TypeScript 作为 JavaScript 的超集，自然也是支持 class 全部特性的，并且还可以对类的属性、方法等进行静态类型检测。下面就来看看 TypeScript 中的类类型。
• 05.17 15:20:22
  发表了文章 2022-05-17 15:20:22

  TS入门篇 | 详解 TypeScript 接口类型（下）

  在JavaScript中，我们似乎很少听说接口这个概念，这是TypeScript中很常用的一个特性，它让 TypeScript 具备了 JavaScript 所缺少的、描述较为复杂数据结构的能力。下面就来看看什么是接口类型