当前位置： 首页 > news >正文

前端代码注释

news 2026/5/13 17:56:09

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

  • 前言
  • 类注释
  • 属性注释
  • 函数注释
  • 函数参数注释
  • 解构 & 函数返回结果 注释
  • Vue Props 注释
  • 注释建议
      • 注释内容要清晰简洁
      • 注释类型
      • 避免不必要的注释
      • 采用一致的风格
      • 版本与更新记录
      • 注释的适用范围
      • 更新与维护

前言

代码注释是代码中很重要的一部分，或者说是一个前端项目中很重要的一部分，因为它能起到解释代码的作用，所以注释越多的项目，说明这个项目的可维护性更高，更加地健壮

类注释

示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。

当你想要给一个类注释时，你可以这么去写
在这里插入图片描述
这样的话，当你在使用这个类的时候，会有提示

在这里插入图片描述

属性注释

当你想要给一个类属性注释时，你可以这么去写

在这里插入图片描述

这样的话，当你在使用这个类属性的时候，会有提示

在这里插入图片描述

函数注释

对于一个函数，我们可以做很多注释，比如：

  • 函数的用处
  • 函数的参数
  • 函数的使用注意点

还是刚刚的方式，我们甚至可以在注释里面去使用 markdown 语法，让注释变成更加有趣生动

在这里插入图片描述
按照上面这样的注释写法，我们在使用这个函数时，可以得到这样的有趣提示~

在这里插入图片描述
而类里的方法也是一样的效果

在这里插入图片描述
在这里插入图片描述

函数参数注释

如果我们相对函数的每一个参数都进行注释，应该怎么做呢？可以这么去写注释
在这里插入图片描述
这样我们在使用函数的时候，会有参数提示

在这里插入图片描述

解构 & 函数返回结果 注释

想要解构的对象，或者解构函数返回结果时有提示，同样可以在类型那里进行注释

在这里插入图片描述
在这里插入图片描述

Vue Props 注释

这样的样式同样也适用在 Vue Props 上

在这里插入图片描述

在这里插入图片描述

注释建议

注释内容要清晰简洁

  • 避免冗长：注释应简洁明了，直接表达意图，避免复杂的句子。使用简单的语言：确保即使是不熟悉项目的开发者也能理解你的注释

注释类型

  • 模块和组件注释：在每个文件的顶部，描述该模块或组件的功能、目的及用法
  • 函数和方法注释：在函数前简要说明该函数的用途、参数、返回值以及异常情况
  • 代码段注释：在复杂的代码块上方或旁边添加注释，解释其逻辑或特定的实现方法

避免不必要的注释

  • 自解释的代码：如果代码变量、函数命名已经清晰表达其功能，通常不需要额外注释
  • 避免注释明显的内容：如 // 加1 这种注释一般没有必要

采用一致的风格

  • 格式统一：无论是使用单行注释 // 还是多行注释 /* */，都要保持一致
  • 使用文档注释：对于函数和类，使用类似 JSDoc 的格式来标准化注释，这样更易于生成文档

版本与更新记录

  • 记录变更：在文件顶部或注释区域，简要记录修改历史，包括修改者、时间和更改内容
  • -遵循代码风格指南：遵循团队的代码风格指南，以确保注释的风格一致

注释的适用范围

  • 考虑不同受众：注释应考虑到团队中的不同技术水平的开发者，不同背景的开发者需要不同深度的注释
  • 避免私人笔记：注释应面向所有开发者，避免包含个人笔记或无关内容

更新与维护

  • 及时更新：每当代码更改时，要同步更新相关注释，保持注释的准确性和相关性。
  • 定期审查：在代码审查或重构时，检查注释的有效性，确保它们依然适用。

原文链接

相关文章：

前端代码注释

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录 前言类注释属性注释函数注释函数参数注释解构 & 函数返回结果 注释Vue Props 注释注释建议注释内容要清晰简洁注释类型避免不必要的注释采用一致的风格版本与更…...

编程日记 2024/10/31 1:58:32

Linux线程安全（二）条件变量实现线程同步

目录 条件变量 条件变量初始化和唤醒 键盘触发条件变量唤醒线程demo 条件变量的等待 条件变量定时等待demo 条线变量实现多线程间的同步 条件变量 条件变量是为了控制多个线程的同步工作而设计的 比如说一个系统中有多个线程的存在但有且仅有一个线程在工作&#xff0c…...

编程日记 2024/10/31 1:55:29

Linux初阶——线程（Part2）：互斥同步问题

一、互斥锁 1、CPU 运算过程 执行完整个语句后，才会把数据写入内存；如果执行时被中断，那么数据和上下文就会保存到线程的 TCB，但数据并不会被写入内存。 1.1. 当 CPU 执行完整个语句时 CPU 最终执行完整个语句的过程 就用上图举…...

编程日记 2024/10/31 1:54:29

力扣——二叉树的后序遍历（C语言）

1.题目： 给你一棵二叉树的根节点 root ，返回其节点值的后序遍历。 2.原理： 这里的遍历，是要存入到数组中，所以需要建立数组，这里传参有*returnSize，需要求节点个数，可以调用前面Tr…...

编程日记 2024/10/31 1:53:28

利用kimi编程助手从0到1开始搭建小程序！

电脑崩了，更新5次小程序，什么都不剩！（但是遗留下来了一些东西，开源的思维和不断地对于技术的使用和掌握“一个软件更多的哲学：（01）优秀的ui页面设计（02）更加细…...

编程日记 2024/10/31 1:52:26

WSL(Ubuntu20.04)编译和安装DPDK

编译和安装DPDK DPDK可以使用工具meson和ninja在您的系统上进行配置、构建和安装。 DPDK配置 要配置DPDK构建，请使用： meson setup build --prefix/home/xx/dpdk19.11xxxx:~/dpdk-stable-19.11.14/$ meson setup build Message:Content Skipped libs…...

编程日记 2024/10/31 1:51:25

HLS协议之nginx-hls-多码率测试环境搭建

运行环境：ubuntu 20.04 时间：2024年10月26日 环境更新 sudo apt-get update sudo apt-get install build-essential libtool libpcre3 libpcre3-dev zlib1g-dev openssl下载nginx wget http://nginx.org/download/nginx-1.19.2.tar.gz tar xvzf n…...

编程日记 2024/10/31 1:50:24

函数式接口与回调函数实践

函数式接口与回调函数实践 一、Java 的函数式接口 是指仅包含一个抽象方法的接口，通常用于 lambda 表达式或方法引用。Java 8 引入了很多内置的函数式接口，比如 Runnable、Callable、Predicate、Function、Consumer 等 演示，数据类型转换的函…...

编程日记 2024/10/31 1:49:23

Windows11系统如何使用自带的录音、录屏工具？

电脑录音和录屏作为现代办公的辅助工具，不仅极大地提升了工作效率，也保障了信息传递的准确性和完整性。通过合理利用这些工具，我们可以更好地保存和管理重要资料，为办公带来无与伦比的便利。 在会议记录、讲座学习、语音备忘等场景…...

编程日记 2024/10/31 1:47:21

使用 web (vue 和DRF))实现 模拟一个IDE 功能思路

采用文件系统和数据库相结合的方案，不仅可以实现基本的文件管理，还可以为未来的扩展提供灵活性。结合我们讨论的内容，以下是更完善的策略： 方案概述：文件系统与数据库结合 文件系统负责实际的文件存储和执行操作&…...

编程日记 2024/10/31 1:46:20

智航船舶租赁综合管理系统

1.产品介绍 产品介绍方案 产品名称： 智航船舶租赁综合管理系统 主要功能： 船舶信息管理租赁合同管理运营调度与优化财务分析与报告功能介绍： 1. 船舶信息管理 具体作用与使用方式：该功能模块允许用户录入、编辑和查询所有船舶的详细信息，包括但...

编程日记 2024/10/31 1:45:19

统信UOS下启动图形界面应用工具monitor报JAVA相关错：An error has occurred. See the log file

☞ ░ 前往老猿Python博客 ░ https://blog.csdn.net/LaoYuanPython 一、前言 在博文《基于飞腾2000CPU浪潮电脑统信UOS安装达梦数据库详解 https://blog.csdn.net/LaoYuanPython/article/details/143258863》中介绍了基于飞腾2000CPU浪潮电脑统信UOS安装达梦数据库的详细过程…...

编程日记 2024/10/31 1:42:17

N-154基于springboot酒店预订管理系统

开发工具：IDEA 服务器：Tomcat9.0， jdk1.8 项目构建：maven 数据库：mysql5.7 前端技术：AdminLTEBootstrapLayUIHTMLjQuery 服务端技术：springbootmybatis-plusthymeleaf 本项目分前台和后台…...

编程日记 2024/10/31 1:41:16

微信小程序如何实现地图轨迹回放?

要在Uni-app中实现微信小程序的地图轨迹回放功能，你可以按照以下步骤进行操作： 在Uni-app项目中引入地图组件：在页面中使用uni-app提供的map组件，可以使用uni.createMapContext方法获取地图上下文对象，以便后续操作地图…...

编程日记 2024/10/31 1:40:10

vscode的一些使用心得

问题1：/home目录空间有限 连接wsl或者remote的时候，会在另一端下载一个.vscode-server，vscode的插件都会安装进去，导致空间增加很多，可以选择更换这个文件的位置 参考：https://blog.csdn.net/weixin_4389…...

编程日记 2024/10/31 1:39:09

Python金色流星雨（完整代码）

文章目录 环境需求完整代码下载代码代码分析1. 导入库和窗口设置2. 创建画笔对象3. 流星的颜色4. 定义流星类`Meteor`5. `meteor`方法：绘制流星6. `move`方法：流星的运动7. 创建流星对象列表8. 动画循环总结系列目录写在后面环境需求 python3.11.4PyCharm Community Edition …...

编程日记 2024/10/31 1:38:08

[山河CTF 2024] week3

一周不在家，这是补的最后一篇。后边的还有0xgame和shctf的末周。打不动了。 Crypto Approximate_n 题目分两部分，flag分两块两个RSA，第1个泄露了4个n_approxkpr的值，后边只泄露了1个。 第1部分利用以前的模板，造格…...

编程日记 2024/10/31 1:37:07

Java集合常见面试题总结(5)

HashSet 如何检查重复? 当你把对象加入HashSet时，HashSet 会先计算对象的hashcode值来判断对象加入的位置，同时也会与其他加入的对象的 hashcode 值作比较，如果没有相符的 hashcode，HashSet 会假设对象没有重复出现。但是如果发…...

编程日记 2024/10/31 1:36:06

牛客网刷题(3)（Java的几种常用包）

目录 一、牛客网案例题目。 二、Java常用包的总结。 <1>JAVA常用包&#xff08;图片&#xff09;。 <2>java.lang包。 <3>java.util包。 &#xff08;1&#xff09;集合框架。 1、Collection接口。 2、List接口。 3、Set接口。 4、Queue接口。 5、Map接口。 …...

编程日记 2024/10/31 1:34:05

PyTorch nn.Conv2d 空洞卷积

torch.nn.Conv2d() 中 dilation 参数控制卷积核的间隔 dilation controls the spacing between the kernel points 当 dilation1 时, 表示卷积核没有额外的空白间距, 也就是标准卷积当 dilation>1 时, 表示空洞卷积(dilated convolution) 动画演示: 手动计算 以 2*2 的卷…...

编程日记 2024/10/31 1:31:02

Cursor Pro破解工具终极指南：5步实现永久免费使用的完整教程

Cursor Pro破解工具终极指南&#xff1a;5步实现永久免费使用的完整教程 【免费下载链接】cursor-free-vip [Support 0.45]&#xff08;Multi Language 多语言&#xff09;自动注册 Cursor Ai &#xff0c;自动重置机器ID &#xff0c; 免费升级使用Pro 功能: Youve reached yo…...

编程新知 2026/5/13 17:52:45

Flow区块链开发：用AI规则库提升Cadence智能合约与FCL前端开发效率

1. 项目概述与核心价值 如果你正在Flow区块链上用Cadence语言开发智能合约&#xff0c;并且恰好也在用Cursor这样的AI辅助编程工具&#xff0c;那你可能和我一样&#xff0c;经历过一个有点“分裂”的阶段。一方面&#xff0c;Cadence作为一门资源导向型语言&#xff0c;其独特…...

编程新知 2026/5/13 17:18:35

别再只做AB测试了！用Python实战倾向性得分匹配(PSM)，搞定业务中的因果推断难题

用Python实战倾向性得分匹配(PSM)&#xff1a;超越AB测试的因果推断利器 在数据驱动的决策时代&#xff0c;企业经常面临一个核心问题&#xff1a;如何准确评估策略或干预措施的真实效果&#xff1f;传统AB测试虽然简单直观&#xff0c;但在面对历史数据、观测数据等非随机实验…...

编程新知 2026/5/13 9:35:43

Godot 4.x ECS插件GECS：数据驱动架构提升游戏性能与可维护性

1. 项目概述&#xff1a;GECS&#xff0c;为Godot 4.x注入ECS架构之力如果你正在用Godot开发游戏&#xff0c;尤其是那种实体数量多、交互逻辑复杂的项目&#xff0c;比如RTS、模拟经营或者一个满屏敌人的弹幕游戏&#xff0c;你很可能已经感受到了传统面向对象&#xff08;OOP…...

编程新知 2026/5/13 9:08:43

跨设备代码同步工具cursor-sync：设计原理与工程实践指南

1. 项目概述&#xff1a;一个为开发者设计的代码同步工具如果你和我一样&#xff0c;经常在多个设备上切换着写代码——比如在公司用台式机&#xff0c;回家用笔记本&#xff0c;甚至偶尔在平板上改几行——那你一定对“代码同步”这个痛点深有体会。手动复制粘贴、用U盘倒腾、…...

编程新知 2026/5/13 8:53:24

1.7.3 掌握Scala函数 - 神奇占位符

本次Scala函数实战主要聚焦于“神奇占位符”下划线&#xff08;_&#xff09;的灵活运用&#xff0c;通过三个递进的案例深入理解其简化代码的核心作用。 演示过滤列表&#xff1a;利用 filter 方法&#xff0c;对比了常规匿名函数与使用占位符的写法&#xff0c;直观展示了如何…...

编程新知 2026/5/13 8:30:20

claw-gatekeeper：构建稳定智能的数据抓取守护服务

1. 项目概述&#xff1a;一个守护数据抓取流程的“看门人”在数据驱动的时代&#xff0c;无论是市场分析、舆情监控还是学术研究&#xff0c;自动化数据抓取&#xff08;爬虫&#xff09;都扮演着至关重要的角色。然而&#xff0c;任何稍有规模的抓取任务&#xff0c;都绕不开几…...

编程新知 2026/5/13 8:01:03

机器人伦理工程化：从道德困境到可解释决策系统的技术实现

1. 项目概述&#xff1a;当机器人需要做出道德抉择十年前&#xff0c;当我在实验室里调试一台协作机器人的碰撞检测算法时&#xff0c;一个从未预想过的问题出现了&#xff1a;在一条狭窄的通道里&#xff0c;机器人的移动路径上同时出现了一位匆忙的工程师和一个价值百万的实验…...

编程新知 2026/5/13 7:43:23

车载项目氛围灯功能——音乐律动

车载项目里面很多用到音乐律动&#xff0c;就是根据音乐的响度和频率&#xff0c;对应氛围灯的亮度和颜色&#xff0c;让人看起来跟着音乐在闪动。本文记录了从FWK的傅里叶函数获取响度和频率的方法&#xff0c;封装了一下工具类&#xff0c;留着以后使用package com.demo.func…...

编程新知 2026/5/13 6:35:54

我写的C语言代码笔记

单链表&#xff1a;#include <stdio.h> #include <stdlib.h>//实现初始化&#xff0c;头插&#xff0c;尾插&#xff0c;删除&#xff0c;输出等单链表的基本操作 typedef struct Node {int data;struct Node* next; }Node;//初始化 Node* intList() {Node* list …...

编程新知 2026/5/13 6:27:37