Рефакторинг: богиня контратаки в именовании кода

JavaScript
Рефакторинг: богиня контратаки в именовании кода

Лу Синь однажды сказал: Весь код не одноразовый, будь то изменение или чтение, имя в одном предложении - это хороший дизайн.

текст

Чтобы быть со своей любимой богиней, Ли Гоудань сделал все, что мог, посмотрим, как он контратаковал.

Любое сходство между историями чисто случайно, следующий метод именования только для справки, реального стандарта нет.

имя переменной

Дело 1:

Гудан хотел увидеть подробную личную информацию богини, поэтому вызвал код официального сайта:

   // list即可能是列表也有可能是表格
   const configListData;
   const configList;
   const configData;
   const configFormList;
   ......

WTF!Имена этих переменных точно такие же? Какой из них я должен посмотреть?

Разобрать:

Давайте посмотрим на наименования elementui:

  • 表格: table
    
  • 表单:form
    
  • 列表:list
    

При использовании машинного перевода одно и то же имя часто не является синонимом. Вам нужно указать свои собственные спецификации для основных компонентов. Представьте, что несколько человек поддерживают единый набор кода, у каждого человека разные стили и нет комментариев, а загадочные переменные склонен к появлению.

  1. Сделайте колеса максимально простыми и используйте единые правила именования для инкапсуляции компонентов, например:
        {
             data:'',   //数据
             config:'', //配置
             size:'',   //尺寸
             style:'',  //样式
             state:'',  //状态
             show:'',   //展示
             ......
        }
  1. Старайтесь избегать переменных со схожей семантикой, так как сейчас используется большинство UI-фреймворков, если на странице есть два компонента одного типа, то для их именования рекомендуется использовать такой метод:

     studentTable, // 内容-组件模块 (如果有很多学生的表格,最好说明是什么学生)
    

case2:

Гудан, наконец, разобрался с формой и планировал использовать в качестве критерия запроса хорошо известные измерения богини, Боже мой! Слишком много условий запроса:

   //vue中的data
   这里用了苍老师的.....
   {
       age:'18',
       sex:'female',
       major:'english', //专业
       class:'201',
       bust:'90',        //胸围
       waistline:'58',   //腰围
       hips:'83',        //臀围
       table:'',
   }
   table.search({waistline,hips,bust});

Ошибка: Откуда в серьезной школе могут быть мерки!

Разобрать:

Для формы существует много условий запроса, но в приведенном выше разделе приведены не все условия запроса в форме учащегося.

В ярости собака модифицировала конструкцию:

   {
       // 查询学生条件
       studentSearchData:{
         age:'18',
         sex:'female',
         major:'english', //专业
         class:'201',
       },
       // 查询私人条件
       privateSearchData: { 
           bust:'90',        //胸围
           waistline:'58',   //腰围
           hips:'83',        //臀围
       },
       table:'',
   }
   table.search(studentSearchData); //少写几个变量

Таким образом, бизнес-домен абстрагируется в объект (класс), чтобы отличить бизнес.В сложных бизнес-сценариях цепочка ответственности данных может быть не только подтверждена, но и код может быть сделан более «модульным» за счет именования, а в некоторых функциях может быть даже удобнее.

Имя функции

Дело 1:

Чтобы сохранить образ богини (чтобы владеть им), Гудан хочет изменить (сохранить) условия конфиденциальности:

   changeSearchData('privateSearchData');
   updateSearchData('privateSearchData');

Так что же такое функция модификации?

Разобрать:

Рекомендуется использовать операцию (спокойная) + контент/контент + поведение для имени

   searchData();        //获取 加get多此一举,个人风格你们也可以加
   initSearchData();    //删除
   addSearchData();     //添加
   updateSearchData();  //更新
   removeSearchData();  //移除某个属性
   deleteSearchData();  //删除    
   searchDataToString(); //转换数据格式
   .....

case2:

Помогите богине опустошить тележку для покупок и подсчитайте количество потребляемой ею двойной тележки для покупок:

(Количество * Цена за единицу) * Скидка + Расстояние * Доставка

   function Price(){
       return (order.quantity * order.itemPrice) * order.discount 
       + distance * shipping 
   }

Гоудан хочет изменить логику расчета корзины, но не знает, с чего начать.

Такой код часто встречается в наших проектах, это не неправильный код (жесткий спрос, ленивый рак), но его надо рефакторить. Код этой функции слишком сложен, чтобы объяснить ее специфическое поведение одним именем.

Разобрать:

Рефакторинг с единственной ответственностью:

     // 基本价格 = 数量 * 单价
     function basePrice (){ 
         return  order.quantity * order.itemPrice;
     }
     // 折后价格 = 基本价格 * 折扣
     function discountPrice (basePrice){ 
         return  basePrice * order.discount;
     }
     // 运费价格 = 公里数 * 运费
     function shippingtPrice (){ 
         return  distance * shipping;
     }
     
     function Price(){
        return discountPrice(basePrice()) + shippingtPrice();
     }
     ......

Я написал примерный план, и его можно оптимизировать под конкретный бизнес.Преимущества рефакторинга:

  1. Каждая формула расчета имеет свою функцию и явное имя
  2. Общий процесс не изменится, внутренний метод расчета каждой функции может быть изменен в соответствии с потребностями.
  3. Функция цены выпуска постоянна, и нам не нужно заботиться о том, как она реализуется впоследствии.

имя параметра

Полностью индивидуальный стиль:

  1. Параметров не должно быть слишком много, больше 3-х нужно учитывать ссылку на форму, которую можно объединить в объект (переменная case2)
  2. Параметры унифицированы, если параметр передается в одном процессе, рекомендуется использовать одно и то же имя параметра для быстрого поиска (ctrl+f). Следующий код может быстро найти соответствующий поток обработки через movieName.

       const movie = [];
       
       function updateDesignation(){
           const movieName = 'SSNI-436';
           downLoadMovie(movieName);
       }
       .... 
       此处省略一万行代码,但是我们可以通过movieName快速定位参数走向  
       ....
   
       function downLoadMovie(movieName){
           movie.push(movieName);
       }
       

Богиня опустила голову и прошептала на ухо Гудану: «На самом деле, тебе не нужно так часто возвращаться за мной, мне просто нравится, как ты пишешь код, это действительно красиво. (Мне просто нравятся твои глупые деньги)

Пес Дэн: Эй, Богиня интересовалась кодом, какой язык ты считаешь лучшим в мире?

女神:。 . . . . .


Просьба код не писать тут тайна, не каждый детектив

Если вы считаете, что это хорошо, пожалуйста, в хорошем качестве, ставьте лайки, подписывайтесь, пересылайте и комментируйте, ведь нужно правильно питаться.

Чтобы узнать больше, обратите внимание на технический паблик: ihap technology blackhole! ! !