Angularjs书写规范

文件命名原则:

  1. 遵循以描述组件功能,然后是类型(可选)的方式来给所有的组件提供统一的命名

    • 命名:feature.type.js。
    • 测试文件名(feature.type.spec.js)
  2. 大多数文件都有2个名字:
    • 文件名 (avengers.controller.js)
    • 带有Angular的注册组件名 (AvengersController)
    • 测试文件名(avengers.controller.spec.js)

规则

  1. 一个文件只定义一个组件
  2. 每一个文件都需要使用JavaScript闭包
  3. 使用module的时候,避免直接用一个变量,而是使用getter的链式语法。
    • 设置module,angular.module(‘app‘, []);
    • 获取module,angular.module(‘app‘);
  4. 回调函数使用命名函数,不要用匿名函数
    // logger.js
    angular
        .module(‘app‘)
        .factory(‘logger‘, logger);
    
    function logger () { }
  5. 在controller中需要先把$scope复制给可捕获的变量,选择一个有代表性的名称,例如vm代表ViewModel(方便controller as 语法糖之间的切换)
    function Customer ($scope) {
        var vm = $scope;
        vm.name = {};
        vm.sendMessage = function() { };
    }
  6. 可绑定成员放到顶部(注:如果一个函数就是一行,那么只要不影响可读性就把它放到顶部。)
    function Sessions() {
        var vm = this;
    
        vm.gotoSession = gotoSession;
        vm.refresh = refresh;
        vm.search = search;
        vm.sessions = [];
        vm.title = ‘Sessions‘;
    
        ////////////
    
        function gotoSession() {
          /* */
        }
    
        function refresh() {
          /* */
        }
    
        function search() {
          /* */
        }
    }
  7. 保持Controller的专一性,一个view定义一个controller,尽量不要在其它view中使用这个controller。把可重用的逻辑放到factory中,保证controller只服务于当前视图
  8. 独立的数据调用(Data Services):
    • 把进行数据操作和数据交互的逻辑放到factory中,数据服务负责XHR请求、本地存储、内存存储和其它任何数据操作
    • 数据服务被调用时(例如controller),隐藏调用的直接行为
    • 数据调用返回一个Promise
  9. Directives
    • 一个dirctive一个文件
    • 提供一个唯一的Directive前缀,格式:{namespace}-指令名称
  10. 压缩处理(防止压缩导致出错):
    • 手动添加依赖

      angular
          .module(‘app‘)
          .controller(‘Dashboard‘, Dashboard);
      
      Dashboard.$inject = [‘$location‘, ‘$routeParams‘, ‘common‘, ‘dataservice‘];
      
      function Dashboard($location, $routeParams, common, dataservice) {
      }
  11. Controller命名: 使用UpperCamelCase(每个单词首字母大写)的方式;后缀使用Controller;例如:AvengersController
  12. Service命名: 对service和factory使用camel-casing(驼峰式,第一个单词首字母小写,后面单词首字母大写)方式。避免使用$前缀。
  13. Directive组件命名: 使用camel-case方式,用一个短的前缀来描述directive在哪个区域使用(一些例子中是使用公司前缀或是项目前缀)
时间: 2024-10-08 10:27:45

Angularjs书写规范的相关文章

CSS 样式书写规范

CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, letter-spacing, color- text-align等)4.背景(background, border等)5.其他(animation, transitio CSS书写规范 使用CSS缩写属性 CSS有些属性是可以缩写的,比如paddin

css书写规范

  一.CSS书写顺序     1.位置属性(position, top, right, z-index, display, float等)    2.大小(width, height, padding, margin)    3.文字系列(font, line-height, letter-spacing, color- text-align等)    4.背景(background, border等)    5.其他(animation, transition等) 二.CSS书写规范    

CSS书写规范、顺序和命名规则

一.CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, letter-spacing, color- text-align等)4.背景(background, border等)5.其他(animation, transition等) 二.CSS书写规范 1.使用CSS缩写属性 CSS有些属性是可以缩写的

代码书写规范和命名规范

上一篇给大家分享了一下,关于文档编写的几个概念.这篇文章阐述如果编写代码书写规范以及命名规范文档.[以java语言为例] 1.代码书写规范 代码书写规范,能够让不同的人,写出相同风格的代码.很多人都看过java源代码,你会发现java源代码的整体风格几乎是一致的,但是你要知道编写源代码的人是很多的,如何才能让他们写出同一风格的代码呢?这就是代码书写规范的作用. 代码书写规范描述的是如何从头到尾书写代码(自己定义的).通俗点讲就是如何书写java文件.就像你写毕业论文一样,从头到尾每个细节都是有要

12_Shell语言———脚本的书写规范以及检查和调试脚本

一.脚本的书写规范 在前文中写过一个脚本first.sh,用来创建一个用户,这里新创建一个脚本useradd.sh,用来创建多个用户,用户名和密码相同: # nano useradd.sh #! /bin/bash # Author: Mickey // 指定作者 # Date:2014-5-14 // 指定日期 # Version:0.0.1 // 指定版本 # Description:Add Users // 描述脚本的功能 # 上述内容为规范的脚本格式 useradd userA echo

css命名规范和书写规范

1.位置属性(position, top, right, z-index, display, float等)2.大小(width, height, padding, margin)3.文字系列(font, line-height, letter-spacing, color- text-align等)4.背景(background, border等)5.其他(animation, transition等) CSS书写规范 使用CSS缩写属性 CSS有些属性是可以缩写的,比如padding,mar

<转>CSS书写规范、顺序(推荐)

CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-height, letter-spacing, color- text-align等) 4.背景(background, border等) 5.其他(animation, transition等) CSS书写规范 使用CSS缩写属性 CSS有些属性是可以缩写的,比

推荐大家使用的CSS书写规范、顺序(转)

写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里设计达人网总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line

推荐大家使用的CSS书写规范、顺序

写了这么久的CSS,但大部分前端er都没有按照良好的CSS书写规范来写CSS代码,这样会影响代码的阅读体验,这里总结一个CSS书写规范.CSS书写顺序供大家参考,这些是参考了国外一些文章以及我的个人经验总结出来,我想对写CSS的前端用户来说是值得学习的. CSS书写顺序 1.位置属性(position, top, right, z-index, display, float等) 2.大小(width, height, padding, margin) 3.文字系列(font, line-heig