大家好,我是刚开始学前端的小白:will-black,今天我开始第一篇文章记录。
做一个想做前端的人我尝试过自学,其实像html与CSS这些语言逻辑都不难,但并不知道从何入手,就像手里拿着屠龙刀不知道如何去打怪兽,只能天天用它切菜。
随着报了一个培训班,我已经了解了如何去使用哪些div、section、header、main、footer……这些标签的使用场景也清晰了很多,也梳理了外链式css的使用流程,目前来说在没有js的情况下可以很有思路的完成一个作品。
我相信很多自学者都能完成这样的事情,但是如果这样就安安心心的去自学js、Ajax、vue总会觉得少一点什么。尤其是在我们写一个网页时,需要用到class类名的时候,我们脑子里就会出来box1、box2、title、info、banner……等有限的词汇,在嵌套div的时候时不时加一个left、right让我们自己觉得这种命名方式很不专业,很不通用。
当然,我们可以跳过这些在以后的慢慢编程路上去一点点改,本质上不会影响我们对网站编写的认知,但如果你有一点点强迫症,或是多次被命名的事情打断编程思路不妨看一看我下面整理的一些我认为比较有帮助的文件。
常见的前端单词
这是我从一个一同培训,在大学专业也是计算机的一位同学所记的笔记中抄录出来的,总共分为三类名词
页面结构
容器 container 页头 header 内容 content/container 页面主体 main 页尾 footer
导航 nav 侧栏 sidebar 栏目 column 页面外围控制整体布局宽度 wrapper
左中右 left/center/center
导航
导航 nav 主导航 mainNav 顶导航 topNav 子导航 subNav 边导航 sideBar
左导航 leftSideBar 右导航 rightSideBar 菜单 menu 子菜单 subMenu
标题 title 摘要 summary
功能
标志 logo 广告 banner 登录 login 登录条 loginBar 注册 regsiter 搜索 search
功能区 shop 标题 title 加入 joinus 状态 status 按钮 btn 滚动 scroll
标签页 tab 文章列表 list 标识信息 msg 当前的 current 小技巧 tips 图标 icon
注释 note 指南 guild 服务 service 热点 hot 新闻 news 下载 download
投票 vote 合作伙伴 partner 友情链接 link 版权 copyright
关于命名我只抄了这么多名词,那英语不错的同学会发现这些就是普通的英语单词,所以本身来讲命名并不难,我们在制作网页的时候给这些类名或ID名起对意思就可以了,在职场中,我相信技术人员更希望同事用相同的命名进行编码,这样看别人的代码就会清晰易懂。
除了以上的常用单词以外,我们会发现上面单词会有一些大写字母,比如topNav。这是由top与nav两个单词构成的,意思时顶部导航。在抄原名的时候,笔记中时小写的,即topnav。但今天我学习了JavaScript的变量命名方法,便改写成这种形式。
变量是可以作为一个名字的代号,我们可以给很多东西起名字,比方说数学中的x代表水平方向,x代表水平方向,x=0代表是在画面水平方向的正中间,这里的x,就是人们给水平方向起的名字。x的变化代表水平位置的变化。
那么如果编程中,我起名字都用x的话,同事在看到代码的时候很难理解这个x代表什么,需要阅读你的代码去猜测x的含义。为了减少这种不必要的麻烦,程序员在写名字的时候都会用有含义的单词进行变量命名。比如我们需要一个变量来代表张三写的这个列表,文章列表的英文单词是the article lists,在编写时,我们就可以简写成list,而不是用x。
如果说不同列表的功能不一样,为了区别不同的列表,我们要给张三的列表加一个特殊的地方来区分。这个时候我们可以看一下列表的内容,我们发现张三的列表记录的是班级里男生的名字。我们就可以在原有list的前面增加一个boy。来代表张三的列表——boylist。
意思是搞对了,但是不一定每个人都能看出这是两个单词组合成起来的,突然看到boylist的人可能会觉得这是一个单词,这样他就不认识了。为了告诉阅读者这是两个单词,我们有一下几种办法:
1、驼峰法
把第二个单词的首字母进行大写:boyList
2、下划线方法
在两个单词中间加上下划线:boy_list
以上是我们常用的命名逻辑,我也没有学习的太过深入,希望以上的内容对你有帮助。
下面是命名知识的一些拓展。
$在名字前面,通常代表这个名字内容来JQ或其他使用$的类库中获取的内容
_在名字前面,通常代表这个变量是个全局变量
在名字的后面增加一个数字,是一种基于数字区分相似名称的变量
在命名时,我们的命名只能出现$、_、驼峰命名。并且数字不能开头,也不能用关键字和保留字进行命名。