当前位置:首页 > 科技  > 软件

JavaScript 命名约定优秀实践

来源: 责编: 时间:2024-04-11 17:32:16 282观看
导读1. 变量的命名约定JavaScript 变量名称是区分大小写的,大写和小写字母是不同的。比如:let DogName = 'Scooby-Doo';let dogName = 'Droopy';let DOGNAME = 'Odie';console.log(DogName); // "Scooby-Doo"console.log(

fu428资讯网——每日最新资讯28at.com

1. 变量的命名约定

JavaScript 变量名称是区分大小写的,大写和小写字母是不同的。比如:fu428资讯网——每日最新资讯28at.com

let DogName = 'Scooby-Doo';let dogName = 'Droopy';let DOGNAME = 'Odie';console.log(DogName);   // "Scooby-Doo"console.log(dogName);   // "Droopy"console.log(DOGNAME);   // "Odie"

但是,最推荐的声明 JavaScript 变量的方法是使用驼峰式变量名。我们可以对JavaScript 所有类型的变量使用驼峰式命名约定,这样就不会相同命名的变量。fu428资讯网——每日最新资讯28at.com

// badlet dogname = 'Droopy'; // badlet dog_name = 'Droopy'; // badlet DOGNAME = 'Droopy'; // badlet DOG_NAME = 'Droopy'; // goodlet dogName = 'Droopy';

变量的名称应该是不言自明的,并描述了储存的值。例如,如果需要一个变量来储存狗的名字,应该使用 dogName 而不是 Name,因为 dogNam 更有意义:fu428资讯网——每日最新资讯28at.com

// badlet d = 'Droopy';// badlet name = 'Droopy';// goodlet dogName = 'Droopy';

2. 布尔值的命名约定

当定义布尔类型的变量时,应该使用is或者has作为变量的前缀。例如,如果需要一个变量来检查狗是否有主人,应该使用 hasOwner 作为变量名:fu428资讯网——每日最新资讯28at.com

// badlet bark = false;// goodlet isBark = false;// badlet ideal = true;// goodlet areIdeal = true;// badlet owner = true;// goodlet hasOwner = true;

3. 函数的命名约定

JavaScript 中函数的名称也是区分大小写的。因为在声明函数时,推荐使用驼峰式方法来命名函数。fu428资讯网——每日最新资讯28at.com

除此之外,推荐使用描述性名词和动词来作为前缀。例如,如果声明一个函数来获取名称,则函数名字应该是 getName:fu428资讯网——每日最新资讯28at.com

// badfunction name(dogName, ownerName) {   return '${dogName} ${ownerName}';}// goodfunction getName(dogName, ownerName) {   return '${dogName} ${ownerName}';}

4. 常量的命名约定

JavaScript 中的常量和变量是一样的,都区分大小写,在定义常量时,推荐使用大写,因为它们是不变的变量。fu428资讯网——每日最新资讯28at.com

const LEG = 4;const TAIL = 1;const MOVABLE = LEG + TAIL;

如果变量声明名称中包含多个单词,就应该使用 UPPER_SNAKE_CASE。fu428资讯网——每日最新资讯28at.com

const DAYS_UNTIL_TOMORROW = 1;

5. 类的命名约定

JavaScript 中类的命名约定规则与函数非常相似,推荐使用描述性的名称来描述类的功能。fu428资讯网——每日最新资讯28at.com

函数名和类名之间的主要区别在于类名要使用大写开头:fu428资讯网——每日最新资讯28at.com

class DogCartoon {   constructor(dogName, ownerName) {     this.dogName = dogName;     this.ownerName = ownerName;   }}const cartoon = new DogCartoon('Scooby-Doo', 'Shaggy');

6. 组件的命名规则

JavaScript 组件广泛应用于React、Vue等前端框架中。组件的命名建议与类保持一致,使用开头大写的驼峰式命名法:fu428资讯网——每日最新资讯28at.com

// badfunction dogCartoon(roles) {   return (     <div>       <span> Dog Name: { roles.dogName } </span>       <span> Owner Name: { roles.ownerName } </span>     </div>   );} // goodfunction DogCartoon(roles) {   return (     <div>       <span> Dog Name: { roles.dogName } </span>       <span> Owner Name: { roles.ownerName } </span>     </div>   );}

由于组件的命名开头字母是大写,因此在使用时,就很容易和HTML、属性值等区分开来:fu428资讯网——每日最新资讯28at.com

<div>   <DogCartoon     roles={{ dogName: 'Scooby-Doo', ownerName: 'Shaggy' }}   /></div>

7. 方法的命名约定

这里说的方法指的是类中方法,在 JavaScript 中,类的方法和函数的结构是非常类似的,因此,命名约定规则也是一样的。fu428资讯网——每日最新资讯28at.com

推荐需要使用驼峰式方法来声明 JavaScript 方法,并使用动词作为前缀,使方法名称更有意义:fu428资讯网——每日最新资讯28at.com

class DogCartoon {  constructor(dogName, ownerName) {     this.dogName = dogName;     this.ownerName = ownerName;   }  getName() {     return '${this.dogName} ${this.ownerName}';   }}const cartoon= new DogCartoon('Scooby-Doo', 'Shaggy');console.log(cartoon.getName());   // "Scooby-Doo Shaggy"

8. 私有函数的命名约定

下划线 (_) 在 MySQL 和 PHP 等语言中广泛用于定义变量、函数和方法。但在 JavaScript 中,下划线用于表示私有变量或函数。fu428资讯网——每日最新资讯28at.com

例如,有一个私有函数名 toonName,则可以通过添加下划线作为前缀 (_toonName) 来将其表示为私有函数。fu428资讯网——每日最新资讯28at.com

class DogCartoon {   constructor(dogName, ownerName) {     this.dogName = dogName;     this.ownerName = ownerName;     this.name = _toonName(dogName, ownerName);   }   _toonName(dogName, ownerName) {     return `${dogName} ${ownerName}`;   } }const cartoon = new DodCartoon('Scooby-Doo', 'Shaggy'); // goodconst name = cartoon.name;console.log(name);   // "Scooby-Doo Shaggy" // badname =cartoon._toonName(cartoon.dogName, cartoon.ownerName);console.log(name);   // "Scooby-Doo Shaggy"

9. 全局变量的命名约定

对于 JavaScript 全局变量,没有特定的命名标准。建议对可变全局变量使用驼峰式大小写的方式,对不可变全局对象使用大写fu428资讯网——每日最新资讯28at.com

10. 文件名的命名约定

大多数 Web 服务器(Apache、Unix)在处理文件时都区分大小写。例如,flower.jpg 和 Flower.jpg 是不一样的。fu428资讯网——每日最新资讯28at.com

但是,如果从不区分大小写的服务器切换到区分大小写的服务器,即使是一个小错误也可能导致网站崩溃。fu428资讯网——每日最新资讯28at.com

因此,尽管它们是支持区分大小写的,建议在所有服务器中还是使用小写来命名文件。fu428资讯网——每日最新资讯28at.com

本文链接:http://www.28at.com/showinfo-26-82954-0.htmlJavaScript 命名约定优秀实践

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com

上一篇: Redis Pipelining 底层原理分析及实践

下一篇: 简单易用的.NET免费开源RabbitMQ操作组件EasyNetQ

标签:
  • 热门焦点
  • K60 Pro官方停产 第三方瞬间涨价

    虽然没有官方宣布,但Redmi的一些高管也已经透露了,Redmi K60 Pro已经停产且不会补货,这一切都是为了即将到来的K60 Ultra铺路,属于厂家的正常操作。但有意思的是该机在停产之后
  • 卢伟冰长文解析K60至尊版 对Redmi有着里程碑式的意义

    在今天的Redmi后性能时代战略发布会结束之后,Redmi总经理卢伟冰又带来了一篇长文,详解了为什么 Redmi 要开启后性能时代?为什么选择和 MediaTek、Pixelworks 深度合作?以及后性
  • 小米降噪蓝牙耳机Necklace分享:听一首歌 读懂一个故事

    在今天下午的小米Civi 2新品发布会上,小米还带来了一款新的降噪蓝牙耳机Necklace,我们也在发布结束的第一时间给大家带来这款耳机的简单分享。现在大家能见到最多的蓝牙耳机
  • 天猫精灵Sound Pro体验:智能音箱没有音质?来听听我的

    这几年除了手机作为智能生活终端最主要的核心之外,第二个可以成为中心点的产品是什么?——是智能音箱。 手机在执行命令的时候有两种操作方式,手和智能语音助手,而智能音箱只
  • K6:面向开发人员的现代负载测试工具

    K6 是一个开源负载测试工具,可以轻松编写、运行和分析性能测试。它建立在 Go 和 JavaScript 之上,它被设计为功能强大、可扩展且易于使用。k6 可用于测试各种应用程序,包括 Web
  • 从 Pulsar Client 的原理到它的监控面板

    背景前段时间业务团队偶尔会碰到一些 Pulsar 使用的问题,比如消息阻塞不消费了、生产者消息发送缓慢等各种问题。虽然我们有个监控页面可以根据 topic 维度查看他的发送状态,
  • 自律,给不了Keep自由!

    来源 | 互联网品牌官作者 | 李大为编排 | 又耳 审核 | 谷晓辉自律能不能给用户自由暂时不好说,但大概率不能给Keep自由。近日,全球最大的在线健身平台Keep正式登陆港交所,努力
  • 华为发布HarmonyOS 4:更好玩、更流畅、更安全

    在8月4日的华为开发者大会2023(HDC.Together)大会上,HarmonyOS 4正式发布。自2019年发布以来,HarmonyOS一直以用户为中心,经历四年多的发展HarmonyOS已
  • 3699元!iQOO Neo8 Pro顶配版今日首销:1TB UFS 4.0同价位唯一

    5月23日,iQOO推出了全新的iQOO Neo8系列,包含iQOO Neo8和iQOO Neo8 Pro两个版本,其中标准版搭载高通骁龙8+,而Pro版更是首发搭载了联发科天玑9200+旗舰
Top