TypeScript 特性

静态类型检查:TypeScript 在编译时就会检查代码的类型是否匹配,能够发现很多潜在的错误。即使是简单的错误(例如拼写错误或类型不一致),也可以在编写代码时被捕获到。

类型推断:TypeScript 能够自动推断变量的类型。比如当你声明一个变量并赋值时,TypeScript 会根据赋值来推断这个变量的类型,不需要每次都显式声明类型。

接口和类型定义:TypeScript 提供了 interface 和 type 关键字,允许你定义复杂的数据结构。这对于项目中不同部分的代码协作和数据交互来说非常重要。

类和模块支持:TypeScript 支持面向对象编程中的类(class)概念,增加了构造函数、继承、访问控制修饰符(如 public、private、protected),并且支持 ES 模块化规范。

工具和编辑器支持:TypeScript 拥有良好的编辑器支持,特别是与 Visual Studio Code 集成时,能提供智能提示、自动补全、重构等工具,使开发过程更高效。

兼容 JavaScript:TypeScript 是 JavaScript 的超集,这意味着所有合法的 JavaScript 代码都是合法的 TypeScript 代码。这使得 JavaScript 项目可以逐步迁移到 TypeScript,而无需完全重写。

龙生   01 Jan 2025
View Details

TypeScript 安装

使用国内镜像:
npm config set registry https://registry.npmmirror.com

安装 typescript:
npm install -g typescript

安装完成后我们可以使用 tsc 命令来执行 TypeScript 的相关代码,以下是查看版本号:
$ tsc -v

龙生   31 Dec 2024
View Details

TypeScript 教程

TypeScript 是 JavaScript 的一个超集,支持 ECMAScript 6 标准(ES6 教程)。
TypeScript 由微软开发的自由和开源的编程语言,在 JavaScript 的基础上增加了静态类型检查的超集。
TypeScript 设计目标是开发大型应用,它可以编译成纯 JavaScript,编译出来的 JavaScript 可以运行在任何浏览器上。

龙生   31 Dec 2024
View Details

React Hooks

React Hooks 是一种函数式组件的增强机制,它允许你在不编写类组件的情况下使用 React 的特性。主要的 Hooks 包括 useState, useEffect, useContext, useReducer, useCallback, useMemo, useRef, 和 useImperativeHandle 等。这些 Hooks 提供了访问 React 特性的方式,使得你可以更好地组织和重用你的代码。

龙生   30 Dec 2024
View Details

React Tailwind CSS

在 React 项目中使用 Tailwind CSS 是一个很流行的选择,因为它提供了一种实用工具优先的方法来编写 CSS,使得你可以直接在类名中应用样式,这种方法使得样式编写更加简洁和直观。

Tailwind CSS 教程:https://www.runoob.com/tailwindcss/tailwindcss-tutorial.html
Tailwind CSS 官网:https://tailwindcss.com/
Github 地址:https://github.com/tailwindlabs/tailwindcss

Tailwind CSS 是一个功能强大的 CSS 框架,它通过实用工具优先的方法使得样式编写更加简洁和模块化。与传统的基于类的 CSS 框架不同,Tailwind 提供了一组低级实用工具类,这些类可以直接在 HTML 元素上使用,以便快速、灵活地构建自定义设计。

龙生   30 Dec 2024
View Details

React Sass

Sass(Syntactically Awesome Stylesheets)是一种 CSS 预处理器。
Sass 允许你使用 CSS 中尚不存在的特性,比如变量、嵌套规则、混入、函数等等。
Sass 文件在服务器上执行,并将生成的 CSS 发送到浏览器。

龙生   30 Dec 2024
View Details

React 使用 CSS 样式

在 React 应用程序中使用 CSS 有多种方法。
以下是一些常见的方式以及如何在 React 中实现这些方法的详细说明。
1.内联样式
2.通过样式文件
3.CSS 模块

龙生   29 Dec 2024
View Details

React Memo

React.memo 是一个高阶组件(Higher Order Component, HOC),用于优化函数组件的性能。它通过记忆组件的渲染输出,在组件的 props 没有变化时跳过重新渲染,从而提高性能。以下是 React.memo 的详细介绍和使用方法。

龙生   29 Dec 2024
View Details

React 路由

通过使用 React Router,你可以轻松地在 React 应用中实现路由功能,包括基本路由、嵌套路由、动态路由以及 404 页面等。通过这种方式,你可以创建一个功能强大且用户友好的单页应用程序 (SPA)。

龙生   28 Dec 2024
View Details

React 条件判断

if 语句:适合在 render 方法或函数组件的返回值中使用来决定渲染内容。
三元运算符:适合在 JSX 中进行简洁的条件渲染。
逻辑与 (&&) 运算符:适合在 JSX 中条件渲染,当条件为 true 时渲染元素。
switch 语句:适合处理多个条件,进行不同内容的渲染。

龙生   28 Dec 2024
View Details
1 3 4 5 409