优雅的使用注释

前言

注释相信小伙伴们都不陌生，但是就是这个小小的注释就像项目文档一样让许多小伙伴又爱又恨。不喜欢写注释，又讨厌别人不写注释。在此我们将讨论 JavaScript 和 CSS 的注释，希望通过这篇文章，让你重拾对注释的喜爱，让编码的乐趣如星辰大海。

一、语法

1. CSS 注释

/* css 注释 */

2. JavaScript 注释

// 单行注释

/**
 * 多行注释，注意第一行最好用两个 *
 * ...
 */
 
/*
 当然，除了两端的 * 必须加以外，其他的 * 不加也行
 ...
*/

二、基本使用

1. 单行注释

一般情况下，单行注释会出现在代码的正上方，起到提示的作用：

/* 用注释备注 CSS 类名的功能 */

/* 顶部组件 */
.hd {
   
  position: fixed;
  width: 100vw;
}

/* 版心 */
.container {
   
  margin: 16px auto;
  width: 1200px;
}

// 用单行注释备注简单的信息

const userName = ""; // 用户名
const userAvatar = ""; // 用户头像

// xxx函数
const myFunction = () => {
   };

2. 多行注释

多行注释一般用于需要备注的信息过多的情况，常常出没于 JavaScript 函数的附近。首先提出一个问题：为什么要用到多行注释，用单行注释不香吗？下面就来看看下面的代码：

// xxx函数
const myFunction = ({
     id, name, avatar, list, type }) => {
   <