[JS] 关于JavaScript 开发中的小技巧

1. 使用onclick(this) 来传递参数

<input id="tips" type="text" value="我要传递参数this" onclick="Test(this);"/>

// js部分
<script>
  function Test(s) {
    console.log(s.value);
  }
</script>

结果：

这种方式，省去了你用 document.getElementById(‘tips’) 去获取元素。

2. 对代码行进行折行

你可以在文本字符串中使用反斜杠 ’ \ ’ 对代码行进行换行。

document.write("你好世界!");

// 换行
document.write("你好 \
世界!");

记住，是在文本字符串中。

3. JS注释

JavaScript 不会执行注释。我们可以添加注释来对 JavaScript 进行解释，以提高代码的可读性。
单行注释以 // 开头。多行注释以 /* 开始，以 */ 结尾。

// 这是单行注释

/*
   这是多行注释
   这是多行注释
*/

养成一个写注释的好习惯。方便你二次阅读，维护你的代码。如果后面项目转手，也方便别人来理解你的代码和维护你的代码。

4. 常用CSS样式命名规范

//  网页公共命名
    #wrapper	页面外围控制整体布局宽度
    #container或#content	容器,用于最外层
    #layout	布局
    #head, #header	页头部分
    #foot, #footer	页脚部分
    #nav	主导航
    #subnav	二级导航
    #menu	菜单
    #submenu	子菜单
    #sideBar	侧栏
    #sidebar_a, #sidebar_b	左边栏或右边栏
    #main	页面主体
    #tag	标签
    #msg #message	提示信息
    #tips	小技巧
    #vote	投票
    #friendlink	友情连接
    #title	标题
    #summary	摘要
    #loginbar	登录条
    #searchInput	搜索输入框
    #hot	热门热点
    #search	搜索
    #search_output	搜索输出和搜索结果相似
    #searchBar	搜索条
    #search_results	搜索结果
    #copyright	版权信息
    #branding	商标
    #logo	网站LOGO标志
    #siteinfo	网站信息
    #siteinfoLegal	法律声明
    #siteinfoCredits	信誉
    #joinus	加入我们
    #partner	合作伙伴
    #service	服务
    #regsiter	注册
    arr/arrow	箭头
    #guild	指南
    #sitemap	网站地图
    #list	列表
    #homepage	首页
    #subpage	二级页面子页面
    #tool, #toolbar	工具条
    #drop	下拉
    #dorpmenu	下拉菜单
    #status	状态
    #scroll	滚动
    .tab	标签页
    .left .right .center	居左、中、右
    .news	新闻
    .download	下载
    .banner	广告条(顶部广告条)

 //  CSS文件命名
	master.css,style.css	主要的
	module.css	模块
	base.css	基本共用
	layout.css	布局，版面
	themes.css	主题
	columns.css	专栏
	font.css	文字、字体
	forms.css	表单
	mend.css	补丁
	print.css	打印

我们在定义变量时，需要遵循以下规则：

• 变量必须以字母开头
• 变量也能以 $ 和 _ 符号开头（不过不推荐这么做）
• 变量名称对大小写敏感

定义变量，未给赋值时，其变量值是 undefined。

注释：一个好的编程习惯是，在代码开始处，统一对需要的变量进行声明。

5. JavaScript 数据类型

值类型(基本类型、原始类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。

引用数据类型：对象(Object)、数组(Array)、函数(Function)。

注：Symbol 是 ES6 引入了一种新的原始数据类型，表示独一无二的值。

判断数据类型方法：

1. typeof 用来判断参数是什么类型的实例，其返回结果为js基本数据类型。
   结果为字符串"string"，“boolean”，“number”，“object”，“undefined”，“function”。
   语法: typeof(data) 或 typeof data
       
   若参数data为引用类型，例如Array、null返回的始终是“object”，所以typeof判断类型有一定的局限性。

2. instanceof 用来判断一个对象在其原型链中是否存在一个构造函数的prototype属性。用于判断一个对象是否为某一数据类型。
   语法: :a instanceof b 判断a是否为b的实例，可用于继承关系中.
   例如：
    

6. underfined、null、0、false、NaN、空字符串的逻辑结果均为 false。

 
 
 
 
 
正在更新中…