陈俊刚_社区达人页

2024年01月

• 01.04 11:41:59
  发表了文章 2024-01-04 11:41:59

  new原理解析

  本文深入解析了JavaScript中的new关键字，介绍了其作用、原理，并提供了一些代码示例来帮助读者更好地理解。通过对new关键字的详细解析，我们可以更好地理解JavaScript中对象实例的创建过程，从而更加灵活地运用new关键字来构建复杂的应用程序。
• 01.04 11:40:16
  发表了文章 2024-01-04 11:40:16

  【JavaScript】属性描述符

  这些描述符可以通过 Object.defineProperty() 方法来定义或修改对象的属性特性。通过使用这些描述符，我们可以灵活地控制和定义对象的属性行为，例如限制某些属性只读、隐藏某些不需要枚举的属性等。 总的来说，对象的属性描述符提供了对对象属性行为进行详细控制和定义的能力，包括可配置性、可枚举性、可写性、获取和设置方法等。这使得我们能够更好地管理和操作对象中的各个属性。
• 01.04 11:36:45
  发表了文章 2024-01-04 11:36:45

  Promise的链式调用

  Promise的链式调用是指在一个Promise对象上连续调用多个then方法的过程。通过链式调用，可以将多个异步操作按照顺序执行，并且可以在每个操作完成后处理返回的结果。
• 01.04 11:35:27
  发表了文章 2024-01-04 11:35:27

  ES6之生成器(Generator)

  生成器（Generator）是ES6引入的一种特殊的函数，它可以通过yield关键字来暂停函数的执行，并返回一个包含value和done属性的对象。生成器的概念、作用和原理如下所述：
• 01.04 11:34:03
  发表了文章 2024-01-04 11:34:03

  ES6之迭代器(Iterator)

  ES6引入了迭代器的概念，这个特性为JavaScript带来了更强大的迭代和异步编程能力。本文将深入探讨ES6的迭代器，介绍其概念、用法以及在实际开发中的应用。 迭代器（Iterator）是ES6引入的一种新的数据结构，它提供了一种统一的遍历机制，可以用来遍历各种不同类型的数据。迭代器的概念、作用和遍历原理如下所述：
• 01.04 11:31:30
  发表了文章 2024-01-04 11:31:30

  ES6之原始数据类型Symbol

  ES6 引入了一种新的原始数据类型Symbol，表示独一无二的值。它属于 JavaScript 语言的原生数据类型之一，其他数据类型是：undefined、null、布尔值（Boolean）、字符串（String）、数值（Number）、大整数（BigInt）、对象（Object）。Symbol的作用是创建一个不可变且唯一的标识符，可以用作对象属性的键。它可以用来解决属性名冲突的问题，避免命名冲突。
• 01.04 11:23:47
  发表了文章 2024-01-04 11:23:47

  【JavaScript】垃圾回收与内存泄漏

  JavaScript的*垃圾回收机制*是一种自动化的内存管理机制，用于检测和回收不再使用的内存资源，以便重新分配给其他需要的部分。JavaScript中的垃圾回收器负责跟踪和管理内存的分配和释放，使开发人员无需手动管理内存。 *内存泄漏*指的是程序中分配的内存空间无法被释放和回收，并且随着时间推移导致可用内存逐渐减少。
• 01.04 11:21:25
  发表了文章 2024-01-04 11:21:25

  【JavaScript】浮点数精度问题

  浮点数精度问题是指在计算机中使用二进制表示浮点数时，由于二进制无法精确表示某些十进制小数，导致计算结果可能存在舍入误差或不精确的情况。 这个问题主要源于浮点数的存储方式。在计算机中，浮点数通常使用IEEE 754标准来表示。该标准将浮点数分为符号位、指数位和尾数位，使用科学计数法来表示一个浮点数。
• 01.04 11:19:44
  发表了文章 2024-01-04 11:19:44

  【JavaScript】复制文本到剪切板

  Clipboard API是现代浏览器提供的一组JavaScript接口，用于访问和操作用户剪贴板中的内容。它提供了异步读取和写入剪贴板的功能，可以处理多种类型的数据，如文本、图像等。通过使用navigator.clipboard对象，开发者可以调用相关方法来读取和写入剪贴板中的内容。
• 01.04 11:17:43
  发表了文章 2024-01-04 11:17:43

  【JavaScript】Set、Map、WeakSet、WeakMap

  Set、Map、WeakSet和WeakMap是ES6引入的新的数据结构，它们在处理数据时具有不同的特性和用途。本文将详细介绍它们的用法、特性、区别、优缺点以及使用场景和注意事项，并给出相应的代码示例
• 01.04 11:16:17
  发表了文章 2024-01-04 11:16:17

  【JavaScript】异步解决方案的发展历程

  JavaScript是一种广泛使用的编程语言，用于开发Web应用程序。在Web开发中，异步编程是一种重要的技术，它允许在执行长时间运行的操作时不阻塞用户界面。随着JavaScript的发展，异步编程解决方案也在不断演进。本文将探讨JavaScript异步解决方案的发展历程、优缺点以及代码示例。
• 01.04 11:14:03
  发表了文章 2024-01-04 11:14:03

  Vue 事件修饰符详解

  Vue事件修饰符是Vue.js框架提供的一种功能，用于在处理DOM事件时提供更多的控制和便利性。它们可以用来改变事件的行为，例如阻止默认行为、阻止事件冒泡、只触发一次等。本文将介绍Vue事件修饰符的作用、使用方式以及使用示例，并对其在各种场景下的应用进行总结。
• 01.04 11:12:23
  发表了文章 2024-01-04 11:12:23

  Vue class和style绑定

  Vue中的class和style绑定是一种非常有用的功能，它允许我们根据组件的状态动态地添加或删除CSS类，或者根据状态更改元素的样式。
• 01.04 11:09:08
  发表了文章 2024-01-04 11:09:08

  Vue watch详解

  当我们在Vue.js中使用watch选项来监听属性时，Vue.js会在内部使用了一个叫做Watcher的类来实现。Watcher类是Vue.js响应式系统的核心之一，它负责建立依赖关系并在依赖发生变化时执行回调函数。 具体来说，当我们使用watch选项定义一个属性的监听器时，Vue.js会创建一个Watcher实例，并将该实例与当前组件实例、属性名以及回调函数进行关联。Watcher实例会负责追踪所监听的属性，并在属性发生变化时触发回调函数。
• 01.04 11:07:08
  发表了文章 2024-01-04 11:07:08

  Vue computed详解

  computed是Vue中一个计算属性，它可以根据依赖的数据动态计算出一个新的值，并将其缓存起来。computed属性是基于它们的依赖进行缓存的，只有当依赖发生变化时，才会重新计算。 computed属性具有以下特性： • 缓存：computed属性会缓存计算结果，在依赖不变时直接返回缓存值，提高性能。 • 响应式：当依赖发生变化时，computed属性会自动重新计算并更新。 • 依赖追踪：Vue会自动追踪computed属性所依赖的数据，并在其发生变化时触发重新计算。
• 01.04 11:04:47
  发表了文章 2024-01-04 11:04:47

  【Vue】自动导入组件

  当我们在Vue项目中使用第三方库或组件时，通常需要手动导入它们并在需要的地方进行注册。这可能会变得繁琐和冗长，特别是当我们使用大量的第三方库或组件时。为了简化这个过程，我们可以使用unplugin-auto-import和unplugin-vue-components插件。
• 01.04 11:00:25
  发表了文章 2024-01-04 11:00:25

  Vue3 的效率提升主要表现在哪些方面？

  Vue3带来了许多性能优化和效率提升的特性。本文将重点讨论Vue3在静态提升、预字符串化、缓存事件处理函数、Block Tree和PatchFlag方面的改进。我们将通过对比Vue2和Vue3的编译结果来说明这些方面的效率提升。
• 01.04 10:53:34
  发表了文章 2024-01-04 10:53:34

  深入了解rollup（五）插件输出生成钩子

  输出生成钩子可以提供有关生成的产物的信息并在构建完成后修改构建。它们的工作方式和类型与 构建钩子 相同，但是对于每个调用 bundle.generate(outputOptions) 或 bundle.write(outputOptions)，它们都会单独调用。仅使用输出生成钩子的插件也可以通过输出选项传递，并且因此仅针对某些输出运行。
• 01.04 10:50:48
  发表了文章 2024-01-04 10:50:48

  深入了解rollup（四）插件开发示例

  Rollup是一个JavaScript模块打包器，它可以将多个模块打包成一个单独的文件，以便在浏览器中使用。与其他打包工具相比，Rollup的主要优势在于它可以生成更小、更快的代码。在本文中，我们将深入了解Rollup的插件开发。
• 01.04 10:48:20
  发表了文章 2024-01-04 10:48:20

  深入了解rollup（三）插件机制

  Rollup 插件是一个对象，具有属性]、构建钩子 和 输出生成钩子 中的一个或多个，并遵循我们的约定。插件应作为一个导出一个函数的包进行发布，该函数可以使用插件特定的选项进行调用并返回此类对象。 插件允许你通过例如在打包之前进行转译代码或在node_modules文件夹中查找第三方模块来自定义 Rollup 的行为。
• 01.03 22:38:58
  发表了文章 2024-01-03 22:38:58

  深入了解rollup（二）常用配置

  Rollup是一个JavaScript模块打包器，它可以将多个模块打包成一个单独的文件，以便在浏览器中使用。与其他打包工具相比，Rollup的主要优势在于它可以生成更小、更快的代码。在本文中，我们将深入了解Rollup的常用配置的使用方法。
• 01.03 22:34:20
  发表了文章 2024-01-03 22:34:20

  深入了解rollup（一）快速开始

  Rollup 是一个用于 JavaScript 的模块打包工具，它将小的代码片段编译成更大、更复杂的代码，例如库或应用程序。它使用 JavaScript 的 ES6 版本中包含的新标准化代码模块格式，而不是以前的 CommonJS 和 AMD 等特殊解决方案。ES 模块允许你自由无缝地组合你最喜欢的库中最有用的个别函数。这在未来将在所有场景原生支持，但 Rollup 让你今天就可以开始这样做。
• 01.03 22:29:00
  发表了文章 2024-01-03 22:29:00

  极速 JavaScript 打包器：esbuild

  esbuild是一个快速、可扩展的JavaScript打包器和压缩器，它的目标是成为最快的打包器。它使用Go编写，可以在几乎瞬间内完成大多数项目的构建。在本文中，我们将深入了解esbuild，并探讨其如何实现如此出色的性能。
• 01.03 22:22:42
  发表了文章 2024-01-03 22:22:42

  TypeScript进阶（四）声明文件

  TypeScript 是一种由微软开发的开源编程语言，它是 JavaScript 的超集，为 JavaScript 添加了静态类型检查和其他一些特性。TypeScript 的声明文件是一种特殊的文件，用于描述 JavaScript 库、框架或模块的类型信息。通过声明文件，我们可以在 TypeScript 中使用第三方 JavaScript 库，并获得类型检查和智能提示的好处。 本文将深入探讨 TypeScript 声明文件的相关概念、语法和实践，帮助读者更好地理解和使用声明文件。
• 01.03 22:20:47
  发表了文章 2024-01-03 22:20:47

  TypeScript进阶（三）类型演算与高级内置类型

  TypeScript 是一种静态类型检查的 JavaScript 超集，它通过类型注解和类型推断来提供更强大的类型系统。在 TypeScript 中，类型演算是一种重要的概念，它允许我们在编译时对类型进行操作和计算。本文将深入探讨 TypeScript 类型演算的原理和应用。
• 01.03 22:17:40
  发表了文章 2024-01-03 22:17:40

  TypeScript进阶（二）深入理解装饰器

  TypeScript 是一种由微软开发的开源编程语言，它是 JavaScript 的超集，为 JavaScript 添加了静态类型检查和其他一些特性。装饰器是 TypeScript 中一个非常强大的特性，它可以用来修改类、方法、属性等的行为。本文将深入探讨 TypeScript 装饰器的原理和用法。
• 01.03 22:14:35
  发表了文章 2024-01-03 22:14:35

  TypeScript进阶（一）深入理解类和接口

  TypeScript 是一种静态类型的 JavaScript 超集，它提供了类和接口的概念，使得我们能够更好地组织和管理代码。在本文中，我们将深入探讨 TypeScript 类和接口的各种特性，包括类的继承、抽象类、静态成员、接口、索引器以及 this 指向约束。
• 01.03 22:11:28
  发表了文章 2024-01-03 22:11:28

  TypeScript基础（五）泛型

  在编程中，我们经常会遇到需要处理不同类型数据的情况。为了提高代码的复用性和灵活性，TypeScript引入了泛型的概念。泛型可以让我们在定义函数、类或接口时，不预先指定具体的类型，而是在使用时再指定类型。本文将详细介绍TypeScript中泛型的使用方法和技巧。
• 01.03 22:08:49
  发表了文章 2024-01-03 22:08:49

  TypeScript基础（四）扩展类型 - 类

  TypeScript是一种静态类型的编程语言，它是JavaScript的超集，可以编译成纯JavaScript代码。TypeScript引入了类的概念，使得开发者可以使用面向对象的方式来编写代码。本文将介绍TypeScript的类、继承、访问修饰符和访问器的用法。
• 01.03 22:07:22
  发表了文章 2024-01-03 22:07:22

  TypeScript基础（三）扩展类型-接口和类型兼容性

  在TypeScript中，接口（Interface）用于定义对象的结构和类型。它是一种约定，用于描述对象应该具有哪些属性和方法。接口可以提高代码的可读性、可维护性和可重用性。 接口的定义使用关键字interface，后面跟着接口的名称和一对花括号。在花括号中，可以定义接口的属性、方法和其他成员。
• 01.03 22:04:28
  发表了文章 2024-01-03 22:04:28

  TypeScript基础（二）扩展类型-枚举及其位运算

  TypeScript中的枚举（Enum）是一种数据类型，用于定义一组具有命名值的常量。枚举可以帮助我们在代码中使用更具有可读性和可维护性的常量。 本文将介绍字面量类型的问题、类型别名的局限以及枚举的优缺点及示例详细说明枚举的用处,以及扩展知识枚举的位运算。
• 01.03 21:56:22
  发表了文章 2024-01-03 21:56:22

  TypeScript基础（一）基本类型与类型运算

  TypeScript是一种开源的编程语言，它是JavaScript的超集，意味着所有的JavaScript代码都可以在TypeScript中运行。TypeScript添加了静态类型检查和其他一些新特性，以提高代码的可读性、可维护性和可扩展性。
• 01.03 21:36:20
  发表了文章 2024-01-03 21:36:20

  跨标签页通信的8种方式（下）

  跨标签页通信是指在浏览器中的不同标签页之间进行数据传递和通信的过程。在传统的Web开发中，每个标签页都是相互独立的，无法直接共享数据。然而，有时候我们需要在不同的标签页之间进行数据共享或者实现一些协同操作，这就需要使用跨标签页通信来实现。
• 01.03 21:34:31
  发表了文章 2024-01-03 21:34:31

  跨标签页通信的8种方式（上）

  跨标签页通信是指在浏览器中的不同标签页之间进行数据传递和通信的过程。在传统的Web开发中，每个标签页都是相互独立的，无法直接共享数据。然而，有时候我们需要在不同的标签页之间进行数据共享或者实现一些协同操作，这就需要使用跨标签页通信来实现。
• 01.03 21:32:00
  发表了文章 2024-01-03 21:32:00

  【Vue原理解析】之响应式系统

  Vue2的响应式系统是核心之一，它使得Vue.js能够实现数据驱动的视图变化。其实现主要基于Object.defineProperty API，通过在数据对象上添加属性监听来实现数据变化时对视图进行更新。 vue3实现主要基于Proxy API和Reactive，Reactive函数负责将一个普通的JavaScript对象转换成响应式对象。它通过递归遍历对象的所有属性，并使用Proxy代理对象来实现对属性的拦截。
• 01.03 21:28:33
  发表了文章 2024-01-03 21:28:33

  【Vue原理解析】之异步与优化

  Vue使用异步更新机制来提高渲染性能。当数据发生变化时，Vue并不立即重新渲染整个组件树，而是将更新操作推入一个队列中，并在下一个事件循环中执行。这样可以将多个数据变化合并为一个更新操作，减少不必要的重复渲染。
• 01.03 21:26:51
  发表了文章 2024-01-03 21:26:51

  【Vue原理解析】之插件系统

  Vue是一款流行的JavaScript框架，它提供了一个强大的插件系统，使开发者能够轻松扩展Vue的能力与功能。在Vue中，插件是一种可复用的功能模块，可以扩展或修改全局功能。它可以添加全局方法、指令、过滤器、混入等，并在每个Vue实例中都可用。通过使用插件，我们可以轻松地添加第三方库、自定义指令或过滤器等功能到我们的应用程序中。
• 01.03 21:25:19
  发表了文章 2024-01-03 21:25:19

  【Vue原理解析】之组件系统

  Vue是一款流行的JavaScript框架，它提供了一个强大的组件系统，使开发者能够轻松构建可复用和可维护的应用程序。本文将介绍Vue组件系统的原理，并结合实际示例和相关源码解析，帮助读者更好地理解和应用Vue组件。 在Vue中，组件是将页面拆分成独立、可复用部分的方式。每个组件都有自己的模板、数据、方法和生命周期钩子函数。通过将页面拆分成多个组件，我们可以更好地管理代码，并提高代码的可维护性和复用性。
• 01.03 21:23:06
  发表了文章 2024-01-03 21:23:06

  【Vue原理解析】之虚拟DOM

  Vue.js是一款流行的JavaScript框架，它采用了虚拟DOM（Virtual DOM）的概念来提高性能和开发效率。虚拟DOM是Vue.js的核心之一，它通过在内存中构建一个轻量级的DOM树来代替直接操作真实的DOM，从而减少了对真实DOM的操作次数，提高了页面渲染效率。本文将深入探讨Vue.js中虚拟DOM的作用、核心源码分析。
• 01.03 21:08:31
  发表了文章 2024-01-03 21:08:31

  【Vue原理解析】之模版编译

  Vue.js是一款流行的JavaScript框架，它采用了基于组件的开发模式，使得前端开发更加简单和高效。而Vue的核心功能之一就是模版解析，它负责将Vue组件中的模版代码转化为可执行的JavaScript代码。本文将深入探讨Vue模版解析的作用、核心源码分析以及总结。
• 01.03 18:02:02
  发表了文章 2024-01-03 18:02:02

  【设计模式】之建造者模式

  建造者模式是一种创建型设计模式，它将复杂对象的构建过程与其表示分离，使得同样的构造过程可以创建不同的表示。在前端开发中，可以使用建造者模式来构建复杂的表单、UI组件等。该模式的优点是使代码更加可读、可维护，并且允许根据需要自由组合构建步骤和配置选项。然而，使用建造者模式会增加代码量，并且在对象较少或者构建过程简单时可能显得繁琐。

  
• 01.03 18:00:49
  发表了文章 2024-01-03 18:00:49

  【设计模式】之抽象工厂模式

  抽象工厂模式是一种创建型设计模式，适用于需要创建一系列相关或相互依赖对象的场景。在前端开发中，抽象工厂模式可以帮助我们更好地组织和管理代码，提高代码的可维护性和可扩展性。它通过封装对象的创建过程，使得客户端代码与具体类解耦，并且可以通过切换具体工厂类来改变整个系统的行为。然而，它也增加了系统的复杂度，并且当产品族较多时会导致大量的具体工厂类。因此，在使用抽象工厂模式时需要权衡利弊，并根据实际情况进行选择。

  
• 01.03 17:59:44
  发表了文章 2024-01-03 17:59:44

  【设计模式】之调停者模式

  调停者模式是一种有助于降低对象之间耦合度的设计模式。它通过引入一个调停者对象来集中处理一组对象之间的交互，使得代码更易于维护和扩展。在前端开发中，调停者模式可以应用于表单验证、消息订阅与发布、组件间通信等场景。尽管调停者模式可能会增加系统的复杂性，并且调停者对象可能变得庞大和复杂，但它仍然是一种有价值的设计模式，可以提高代码的可读性和可维护性。

  
• 01.03 17:58:14
  发表了文章 2024-01-03 17:58:14

  【设计模式】之享元模式

  享元模式是一种优化大量相似对象创建和管理的设计模式，在前端开发中可以用于优化图片懒加载、表单验证等场景。它通过共享相似对象来减少内存使用和提高性能，同时也简化了代码逻辑。然而，它也增加了系统的复杂性，并且需要注意共享状态的安全性。在实际应用中，我们需要根据具体场景权衡使用享元模式带来的优缺点。
• 01.03 17:56:59
  发表了文章 2024-01-03 17:56:59

  【设计模式】之桥接模式

  桥接模式是一种非常有用的设计模式，它可以帮助我们更好地组织和管理代码。在前端开发中，我们可以将桥接模式应用于UI组件库、数据请求等场景中。通过将抽象与实现分离，我们可以灵活地组合不同的抽象和实现，并且可以独立地对它们进行修改和扩展。尽管桥接模式增加了系统的复杂性，但它提供了更高的灵活性和可扩展性，值得在适当的场景中使用。
• 01.03 17:55:50
  发表了文章 2024-01-03 17:55:50

  【设计模式】之模版方法模式

  模板模式是一种非常有用的设计模式，在前端开发中经常用于定义和扩展算法流程。它通过定义一个算法骨架，并将一些具体步骤的实现延迟到子类中，实现了优雅地管理和执行操作。通过使用模板模式，我们可以提高代码的可维护性和可扩展性。然而，在应用模板模式时需要权衡其带来的优缺点，并根据具体情况进行选择。
• 01.03 17:54:37
  发表了文章 2024-01-03 17:54:37

  【设计模式】之命令模式

  命令模式是一种非常有用的设计模式，在前端开发中经常用于管理和执行操作。它通过将操作封装成对象，并将其作为参数传递、存储或记录，实现了优雅地管理和执行操作。通过使用命令模式，我们可以提高代码的可维护性和可扩展性。然而，在应用命令模式时需要权衡其带来的优缺点，并根据具体情况进行选择。
• 01.03 17:51:51
  发表了文章 2024-01-03 17:51:51

  【设计模式】之状态模式

  状态模式是一种非常有用的设计模式，在前端开发中经常用于管理应用状态和处理复杂的流程。它通过将对象行为和属性与特定条件下的处理逻辑分离开来，提高了代码的可维护性和可扩展性。通过使用状态模式，我们可以优雅地管理应用状态，并根据不同的条件来改变对象行为。然而，在应用状态模式时需要权衡其带来的优缺点，并根据具体情况进行选择。
• 01.03 17:50:27
  发表了文章 2024-01-03 17:50:27

  【设计模式】之外观模式

  外观模式是一种简化复杂系统接口的设计模式，在前端开发中有着广泛的应用。它可以帮助我们封装复杂的子系统，并提供一个简单易用的接口给客户端。通过使用外观模式，我们可以提高代码的可维护性、可读性和扩展性。但是需要注意避免过度使用外观模式，以免造成不必要的性能问题。
• 01.03 17:49:02
  发表了文章 2024-01-03 17:49:02

  【设计模式】之解释器模式

  解释器模式是一种用于解释特定语言或规则的表达式的行为设计模式。在前端开发中，解释器模式可以用于处理复杂的逻辑或规则，并将其转化为可执行的代码。它具有灵活性和可扩展性的优点，但也存在复杂性和性能问题的缺点。通过合理地应用解释器模式，可以提高代码的可读性和可维护性，实现更灵活和可扩展的功能。