JavaScript 常见使用误区
JavaScript 常见使用误区,都是平时开发过程中填过的一些坑,整理记录下。
比较运算符常见错误
//在常规的==比较中,数据类型是被忽略的,以下 if 条件语句返回 true:
var x = 10;
var y = "10";
if (x == y)
//在严格的比较运算中,=== 为恒等计算符,同时检查表达式的值与类型,以下 if 条件语句返回 false:
var x = 10;
var y = "10";
if (x === y)
易错点:witch 语句会使用恒等计算符(===)进行比较
以下实例会执行 alert 弹窗:
var x = 10;
switch(x) {
case 10: alert("Hello");
} 以下实例由于类型不一致不会执行 alert 弹窗:
var x = ;//这里是数字,不是字符串
switch(x) {
case "10": alert("Hello");//case要求是字符串"10"
}
浮点型数据使用注意事项(精度问题)
JavaScript 中的所有数据都是以 64 位浮点型数据(float) 来存储。
所有的编程语言,包括 JavaScript,对浮点型数据的精确度都很难确定:
以下是问题代码:
var x = 0.1;
var y = 0.2;
var z = x + y // z 的结果为 0.3
if (z == 0.3) // 返回 false
解决的代码(可以用整数的乘除法来解决):
var z = (x * 10 + y * 10) / 10; // z 的结果为 0.3
JavaScript 字符串分行
//可以使用断行语句
var x =
"Hello World!";
//在字符串中直接按回车键换行,会报错
var x = "Hello
World!";
字符窜断行的方法:字符串断行需要使用反斜杠(\)
var x = "Hello \
World!";
Return 语句使用注意事项
JavaScript 默认是在代码的最后一行自动结束。
遇到return也会结束
function myFunction(a) {
var
power = 10;
return; // 分号结束,或者不加分号也会结束,返回 undefined
a * power;
}
要点:不用对 return 语句进行断行。
避免在数组中使用名字来索引
avaScript 不支持使用名字来索引数组,只允许使用数字索引。
以下是正确用法
var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length; // person.length 返回 3
var y = person[0]; // person[0] 返回 "John"
在 JavaScript 中, 对象 使用 名字作为索引。
如果你使用名字作为索引,当访问数组时,JavaScript 会把数组重新定义为标准对象。
执行这样操作后,数组的方法及属性将不能再使用,否则会产生错误:
var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length; // person.length 返回 0
var y = person[0]; // person[0] 返回 undefined
Undefined 不是 Null,对象只有被定义才可能是Null,否则为undefined
对象只有被定义才有可能为 null,否则为 undefined。
如果我们想测试对象是否存在,在对象还没定义时将会抛出一个错误。
错误的使用方式:
if (myObj !== null && typeof myObj !== "undefined")
正确的方式是我们需要先使用 typeof 来检测对象是否已定义,再去判断这个对象是不是null:
if (typeof myObj !== "undefined" && myObj !== null)
JavaScript 常见使用误区的更多相关文章
- CORS跨域模型浅析及常见理解误区分析
CORS跨域资源共享是前后端跨域十分常用的一种方案,主要依赖Access-Control-Allow(ACA)系列header来实现一种协商性的跨域交互. 基本模型 其中的具体流程大致可以分为以下几步 ...
- JavaScript常见集合操作
JavaScript常见集合操作 集合的遍历 FOR循环(效率最高) 优点:JavaScript最普遍的for循环,执行效率最高 缺点:无法遍历对象 for(let i=0;i<array.le ...
- 关于JavaScript 常见的面试题
关于JavaScript常见的面试题总结 一.JavaScript基本数据类型 null:空.无.表示不存在,当为对象的属性赋值为null,表示删除该属性 undefined:未定义.当声明变量却没有 ...
- javascript常见的20个问题与解决方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JavaScript 常见的六种继承方式
JavaScript 常见的六种继承方式 前言 面向对象编程很重要的一个方面,就是对象的继承.A 对象通过继承 B 对象,就能直接拥有 B 对象的所有属性和方法.这对于代码的复用是非常有用的. 大部分 ...
- JavaScript —— 常见用途
javaScript 简介 第一个JavaScript 程序: 点击按钮显示日期 <!DOCTYPE html> <html> <head> <meta ...
- JavaScript常见的六种继承方式
前言 面向对象编程很重要的一个方面,就是对象的继承.A 对象通过继承 B 对象,就能直接拥有 B 对象的所有属性和方法.这对于代码的复用是非常有用的. 大部分面向对象的编程语言,都是通过"类 ...
- 深度解析javaScript常见数据类型检查校验
前言 在JavaScript中,数据类型分为两大类,一种是基础数据类型,另一种则是复杂数据类型,又叫引用数据类型 基础数据类型:数字Number 字符串String 布尔Boolean Null Un ...
- JavaScript 作用域的误区
了解JavaScript的同学可能知道,JavaScript语言由于设计原因,导致语言本身存在很多先天性的不足,当然这并非设计者有意的,js语言最初是被设计来作为网页交互的脚本语言,依照现有的js语法 ...
随机推荐
- 2018.08.28 洛谷P3345 [ZJOI2015]幻想乡战略游戏(点分树)
传送门 题目就是要求维护带权重心. 因此破题的关键点自然就是带权重心的性质. 这时发现直接找带权重心是O(n)的,考虑优化方案. 发现点分树的树高是logn级别的,并且对于以u为根的树,带权重心要么就 ...
- EXT combobox 二级连动 清空store缓存数据
项目中有这样的一个需求,做一个连动操作,如图: 所属行业中的combobox中下拉框中的值会根据前一个选择框中的值动态去变化,这个其实非常好做,但不是我现在讨论的主要问题,主要问题是,当第二次选择了& ...
- 笔记:CSS常用中文字体英文名称对照表
* 分类排序:中文名+英文名+Unicode+Unicode 2 Windows平台新细明体 PMingLiU \65B0\7EC6\660E\4F53 新细明体细明体 MingLiU \7EC6\6 ...
- (网络流) Sabotage -- UVA -- 10480
链接: http://acm.hust.edu.cn/vjudge/contest/view.action?cid=82835#problem/J 代码: #include<cstdio> ...
- SpringMVC 示例实战教程
一.SpringMVC基础入门,创建一个HelloWorld程序 1.首先,导入SpringMVC需要的jar包. 2.添加Web.xml配置文件中关于SpringMVC的配置 1 2 3 4 5 6 ...
- WPF核心对象模型-类图和解析
DispatcherObject是根基类,通过继承该类,可以得到访问创建该对象的UI线程的Dispatcher对象的能力.通过Dispatcher对象,可以将代码段合并入该UI线程执行. Depend ...
- TFS中设置任务中的“计划开始时间”为可编辑状态
问题现象 如果使用TFS系统的默认模板CMMI新建团队项目,你会发现在网页浏览器中,任务工作项的"计划开始日期"和"计划结束日期"的类型是普通字符,并且不能修改 ...
- Replication--对发布修改的一些小总结
--==================================================== --在华丽分割线下,是我对肖磊--大菠萝的崇高地敬意和婶婶地感谢,本文乃肖兄表述我执笔而来 ...
- 一个Form表单多个Submit提交按钮!实现提交不同的参数!
给 submit 的按钮加onclick 方法来自定义预处理参数,比如<script type="text/javascript">function submitFun ...
- WinForm中的图表控件Chart
第一次接触Chart控件,发现了这个Chart控件的实例项目,非常强大,用示例的方法介绍了该控件各式各样的用法. 下载链接