标题 2
这里是内容。
标题 3
这里是内容。
more
注释之前的内容被视为文章摘要。
在现代网络生态系统中,用户帐户和密码是用户身份验证的关键元素。为了提供更好的用户体验和安全性,浏览器提供了许多 API 以便开发者更好地管理用户凭据。其中,Chrome 提供了 PasswordCredential 对象,为用户的密码管理和自动填充提供了便利。
PasswordCredential
是一个 Web Credential Management API
的一部分,它允许开发者在不牺牲安全性的前提下管理用户的密码。这个 API
可以通过以下方式创建:
ES6(ECMAScript 2015)引入了一种新的基本数据类型——Symbol。Symbol 类型的引入使得开发者能够创建一种独一无二的值,这在某些场景下非常有用。
Symbol 是一种原始数据类型,它的值是唯一且不可变的。通过 Symbol() 函数创建一个新的 Symbol,每次调用都会返回一个不同的值。
const mySymbol = Symbol();
const anotherSymbol = Symbol();
console.log(mySymbol === anotherSymbol); // false
微前端是一种类似于徽服务的架构,它将微服务的理念应用于浏览器端,即将单页面前端应用由单一的单体应用转变为把多个小型前端应用聚合为一的应用
各个前端应用还可以独立开发、独立部署。同时,它们也可以进行并行开发,这些组件可以通过 NPM、Git TagGit 或者 Submodule 来管理
在逛github
的时候,发现一个很有意思的utils
userhjp/datav-react
const formatNumber = function (num) {
const reg = /(?=(\B)(\d{3})+$)/g;
return num.toString().replace(reg, ',');
};
multiple
用户可以选择多个文件,然后文件列表会显示出来。需要注意的是,文件的选择是通过<input type="file" multiple>
标签来实现的,其中multiple
属性允许选择多个文件。
odirectory
允许用户上传整个文件夹,而不仅仅是单个文件。使用<input type="file" webkitdirectory mozdirectory odirectory>
标签来启用文件夹上传功能。在处理时,代码会检查文件是否为文件夹,然后递归读取文件夹中的文件列表。
Redux 是一个用于 JavaScript 应用程序的状态管理库,它帮助我们有效地管理应用程序的状态,并使组件之间的数据传递更加简单和可控。Redux 使用单一的数据存储(store)来保存整个应用程序的状态,并通过 Reducers 和 Actions 来处理状态的变化。
Redux 的单一数据流是指整个应用程序中的数据状态(state)存储在一个单一的 JavaScript 对象中,通常称为"Store"。这个 Store 是唯一的,并且整个应用程序共享它。所有的数据改变都通过派发(dispatch)"Action"来完成,Action 是一个包含描述改变的信息的简单对象。然后,这些 Action 会被传递给 Reducer 函数,Reducer 会根据 Action 的类型来更新 Store 中的数据状态。组件可以订阅(subscribe)Store 的状态变化,以便在状态改变时重新渲染自己。
控制反转(IOC)和依赖注入(DI)是面向对象编程中的重要设计原则,用于降低代码间的耦合度,并提高可维护性和可测试性。本文将介绍 IOC 和 DI 的概念、解决的问题、实现思路以及在 Nest 框架中的具体实现。
IOC(Inversion of Control,控制反转)是一种设计原则,通过将对象的创建和管理交给一个容器来实现。在非 IOC 模式下,对象之间的依赖关系由调用者来控制和管理。而在 IOC 模式下,对象的创建和依赖关系的管理都由容器来完成,从而实现了对象之间的解耦。
在非 IOC 模式下,如果一个类 B 需要使用类 A 的实例,通常会在 B 中创建 A 的实例对象。而如果类 C 又依赖于类 B,这种控制权的嵌套会持续下去,导致依赖关系变得复杂。例如,在一个典型的三层架构中,Controller 依赖于 Service 来实现业务逻辑,Service 依赖于 Repository 来进行数据库操作,Repository 又依赖于 DataSource 来建立数据库连接,而 DataSource 需要从 Config 对象中获取用户名密码等信息。
PostgreSQL 的语法知识和常见查询操作
psql -U username -d database_name
说到可视化,大家可能会想到表格、饼图、柱状图、三维大屏图、建筑图等等,或者会想到 excel、matlab、echarts 等工具,但可视化真的仅限于此吗?本章将从前端工程师的角度,结合《数据可视化》,对可视化的基础、架构以及选型做一次探讨。
可视化的定义
可视化的作用
Transition 是 react18 引入的新概念,用来区分紧急和非紧急的更新。
react 官方的 demo 如下:
import {startTransition} from 'react';
// Urgent: Show what was typed
setInputValue(input);
// Mark any state updates inside as transitions
startTransition(() => {
// Transition: Show the results
setSearchQuery(input);
});
React Query 是一个基于 React 的轻量级数据获取和状态管理库,其主要关注点在于客户端如何更好地管理服务器端状态。与传统的状态管理库(如 Redux 和 MobX)相比,它专注于处理服务器状态,简化了与后端数据交互的逻辑。
React Query 通过提供 useQuery、useMutation 等 hooks,使得开发者能够轻松地获取、更新、删除服务器端数据。此外,它还内置了数据缓存、自动更新、重试等功能,进一步优化了客户端与服务器端状态同步的体验。
因此,React Query 的核心价值在于帮助开发者更优雅地管理客户端与服务器端状态的交互,提升前端开发效率。
数据库 | 驱动/模块 | 连接方式 | 优缺点 |
---|---|---|---|
MariaDB | mariadb | 使用 mariadb.createConnection() 创建连接,或者使用 mariadb.createPool() 创建连接池 |
MariaDB 是 MySQL 的一个分支,与 MySQL 兼容。驱动程序相对较新,但已受到广泛认可和广泛使用。 |
MongoDB | mongodb | 使用 mongodb.MongoClient.connect() 创建连接 |
MongoDB 是一个面向文档的 NoSQL 数据库,具有可伸缩性、灵活性和高速读写等特点。MongoDB Node.js 驱动程序是官方支持的,并且易于使用。 |
PostgreSQL | pg | 使用 new pg.Client() 创建连接 |
PostgreSQL 是一个功能强大的关系型数据库,具有高度的稳定性和可靠性。pg 驱动程序是 Node.js 中最流行的 PostgreSQL 驱动程序之一。 |
Oracle | oracledb | 使用 oracledb.getConnection() 创建连接 |
Oracle 是一个功能强大的关系型数据库,主要用于企业级应用程序。oracledb 驱动程序是官方支持的,并且具有很好的性能和可靠性。 |
Microsoft SQL Server | mssql | 使用 new mssql.ConnectionPool() 创建连接池 |
Microsoft SQL Server 是一个功能强大的关系型数据库,主要用于企业级应用程序。mssql 驱动程序是 Node.js 中最流行的 Microsoft SQL Server 驱动程序之一。 |
Redis | ioredis | 使用 new Redis() 创建连接 |
Redis 是一个内存数据结构存储系统,适用于需要快速读写和高并发的应用程序。ioredis 是一个支持 Redis 集群和复制功能的 Redis 驱动程序。 |
SQLite | better-sqlite3 | 使用 better-sqlite3() 创建连接 |
SQLite 是一个非常轻量级的嵌入式数据库,适用于小型项目。better-sqlite3 是官方 SQLite3 驱动程序的代替品,速度更快且易于使用。 |
Couchbase | couchbase | 使用 new couchbase.Cluster() 创建连接 |
Couchbase 是一个面向文档的 NoSQL 数据库,适用于需要快速读写和高并发的应用程序。couchbase 驱动程序是官方支持的,并且具有很好的性能和可靠性。 |
Cassandra | cassandra-driver | 使用 new cassandra.Client() 创建连接 |
Cassandra 是一个分布式的 NoSQL 数据库,适用于大规模数据存储和处理。cassandra-driver 是官方支持的驱动程序,并具有很好的性能和可靠性。 |
Neo4j | neo4j-driver | 使用 neo4j.driver() 创建连接 |
Neo4j 是一个图形数据库,适用于需要处理高度连接数据的应用程序。neo4j-driver 是官方支持的 Node.js 驱动程序,并且易于使用。 |
ArangoDB | arangojs | 使用 new arangojs.Database() 创建连接 |
ArangoDB 是一个多模型数据库(支持文档、图形和键值数据),适用于需要存储多种类型数据的应用程序。ArangoJS 是一个用于 Node.js 的 ArangoDB 驱动程序。 |
RethinkDB | rethinkdbdash | 使用 rethinkdbdash() 创建连接 |
RethinkDB 是一个面向文档的 NoSQL 数据库,具有实时更新和可伸缩性等功能。它可以使用 RethinkDB 驱动程序或 rethinkdbdash。 |
当我们使用移动应用时,我们通常会通过点击链接或按钮来跳转到其他页面或应用。在 iOS
和 Android
系统中,这些链接或按钮是通过 URL Scheme
实现的。
URL Scheme
是一种在移动设备上通过链接或按钮调用应用程序的机制。它允许开发者在应用程序内部注册特殊的 URL
,当用户点击带有该 URL
的链接或按钮时,系统会自动打开相应的应用程序,并执行相应的操作。
从前端角度来看,当我们在网页中包含了带有 URL Scheme 的链接或按钮时,我们可以使用以下代码来触发它们:
VuePress 主要从 Markdown 文件生成页面。因此,你可以使用它轻松生成文档或博客站点。
你应该创建和编写 Markdown 文件,以便 VuePress 可以根据文件结构将它们转换为不同的页面。