代码规范

[JNUfeatherwit]

一、命名规范

1、代码中的命名均不能以下划线或美元符号开始，也不能以下划线或美元符号结束。(--- 单个_可代表匿名变量, _name 可代表私有变量, 此规范部分酌情考虑, 如果有异议, 请参考ts 中相应代码示例 )

反例: _name / _name / $name / name_ / name$ / name_

2、代码中的命名严禁使用拼音与英文混合的方式,更不允许直接使用中文的方式。

反例: DaZhePromotion [ 打折 ] / getPingfenByName() [ 评分 ] / let 某变量 = 3

3、类名使用 UpperCamelCase 风格，即首字母大写。

正例: Person

4、方法名、参数名、成员变量、局部变量都统一使用 lowerCamelCase 风格，即首字母小写。

正例: localValue / getHttpMessage() / inputUserId

5、常量命名全部大写，单词间用下划线隔开，力求语义表达完整清楚，不要嫌名字长。

正例: MAX_STOCK_COUNT
反例: MAX_COUNT

6、文件夹命名统一小写；组件，或者类名，首字母全部大写，遵守驼峰命名法；图片名字不允许使用中文。

二、对象操作

1、【推荐】使用扩展运算符[...]浅克隆对象

正例:

  const original = { a: 1, b: 2 };
  const copy = { ...original, c: 3 };

反例:

 const original = { a: 1, b: 2 };
 const copy = Object.assign(original, { c: 3 }) 

反例:

 const clone = Object.assign({}, original, {c: 3}) // 此方法酌情使用

2、【推荐】使用扩展运算符[...]复制数组 或者slice()。 正例：

const itemsCopy = [...items];
const clone = items.slice() // 此代码如果报错 将会给出十分有利修复信息;

反例 (包括类似代码)

    const itemsCopy = new Array(items.length);
    for (let i = 0, len = items.length ; i < len; i++) {
        itemsCopy[i] = items[i];
    }

3、【推荐】使用数组成员对变量赋值时，优先使用解构赋值。 正例:

const arr = [1, 2, 3, 4];

const [first, second] = arr;

反例

const arr = [1, 2, 3, 4];

const first = arr[0];
const second = arr[1];

4、【推荐】适当采用解构赋值来代替xxxx.xxx.xxx的方式获取参数 正例:

render(){
const {name='默认名称'}=this.props
return <Component text={name}/>
}

反例

render(){
return <Component text={this.props.name}/>
}

5、【推荐】使用可选链和双问号操作符，避免a.b.c.d这种容易出问题的取值

当前版本的rn已经支持了双问号以及可选链这两个es的新特性，建设使用这两个特性进行优雅的取值，

双问号

基本形式：a??b

如果a为null或者undefined，就会取到b，否则取a。

const noValue = undefined;
const value = 'Hello';
noValue ?? 'Nothing'; // => 'Nothing'
value   ?? 'Nothing'; // => 'Hello'

跟 || 的功能差不多，区别在于||遇到如0、'',false之类的也会取右边

const zero= 0;
zero || 'Nothing'; // => 'Nothing'
zero ?? 'Nothing'; // => 0

可选链

基本形式：a?.b

如果a为有效值，则会取a.b,否则返回undefined

用来回避空对象或者类型错误的问题

const a = null
a.b.c.b.c //catch Error
a?.b?.c?.b?.c //undefined

可选链加双问号结合

const a=null
a?.b?.c?.b?.c ??'Nothing' //Nothing

三、函数规范

1、【推荐】使用默认值语法设置函数参数的默认值。

正例:

const handleThings=(opts = {})=> {
  // ...
}

反例:

const handleThings=(opts)=> {
  opts = opts || {};
}

2、【推荐】使用...来代替函数参数arguments

正例:

function handleThings(...arg){
  console.log(arg)
}

反例:

function handleThings=()=> {
  console.log(arguments)
}

四、其他规范

1、【推荐】import文件分行导入，建议分类导入（本地文件与第三方库分开导入，组件文件与其他文件分开导入)

import React from 'react'
import {FlatList, View} from 'react-native'

import Header from '@components/Header'
import WhiteSpace from '@components/WhiteSpace'

import alert from '@utils/alert'

2、使用yarn来安装本地依赖，不使用npm(除非yarn 装不上)

3. 导入请尽量使用绝对路径导入(除非模块内部), 以免迁移代码造成路径问题, 最好采用路径别名 正例:

   import device from "@native/device";

   反例:

   import device from "../../../native/device";