走进javascript——不起眼的基础,值和分号
值
有时我很想知道javascript解析引擎是如何区分一个变量的值,比如下面这段代码。
var x = 'javascript'; //javascript
x = "hello"; // hello
x = 555; //555
x = null; //null
x = a; //a is not defined
x = true; //true
对于数字是直接赋值的,因为它没有多样性,数字就是数字。但是对于值是英文的情况就很难区分了,因为在编程语言中,英文既可能是字符串,也可能是引用的另外一个变量。因此如何区分变量和字符串就显得格外重要,编程语言常常将字符串用引号括起来,从而达到区分变量和字符串的作用。有些语言比如java,它们还区分单引号和双引号,单引号括起来的是一个字符,而双引号括起来的才是字符串。但javascript并不区分字符和字符串,而是把它们都当作字符串,因此在javascript中单引号和双引号并没有什么区别。
虽然通过引号可以用来区分变量和字符串,但值往往也可能是一个关键字,比如上面那段代码我将x赋值为null,那么这些编程语言又是如何区分变量和关键字的呢?
null = 123;
console.log(null); //Uncaught ReferenceError: Invalid left-hand side in assignment
undefined = 456;
console.log(undefined); //undefined
以上我给null和undefined分别赋给了另外一个值,其结果,给null赋值报错了,给undefined赋值虽然没有报错,但也没有成功。也许对于null和undefined来说,它们就是值。而变量则是寻找值。我们说javascript是如何区分变量和关键字,最终或许就变成了javascript是如何区分变量和值的。
分号
在一些JS插件中,经常会看到类似下面这样的一行代码
;(function(){
.........
})();
在代码的最前面有一个分号,那么这个分号是干什么用的呢?
我们知道一个分号代表了一段代码的结束,但问题是javascript允许你不写分号,这样就出现了一个问题,代码的结束与否不是你来决定的而是由程序来决定的,而程序也不是万能的,往往它只是走的某个规则,而如果你写的这段代码和它的规则不符,最终的结果就有些不如人意了。
以下是javascript对省略分号的解析规则
var a
=
1 + 2
console.log(a) //3
javascript解析器会将以上代码解析成
var a = 1 + 2;
console.log(a); //3
如果javascript不给2后面添加分号将会无法解析下去,也可以这么说,如果遇到无法解析下去则javascript解析器会尝试给其添加一个分号,如果还是解析不了则报错。又比如下面这一段代码
var a = 10;
var b = 5;
var c = a + b
(a + b).toString()
// b is not a function
它说b不是一个函数,也就是说以上这段代码很有可能解析成了下面这段代码
var a = 10;
var b = 5;
var c = a + b(a + b).toString();
它把()当成了函数调用。也可以理解为javascript解析器会尽可能多的去匹配,但也有几个例外,它们是retrun、break、continue,当javascript解析器解析到这几个关键字时,它不会把换行后的内容当成是自身的,而是直接在换行之前添加分号,不妨看看下面这段代码
function test(){
return
123;
}
console.log(test()); //undefined
它并没有返回123,也就是说它直接在retrun后面加了分号。
再回过头来看看,那些插件开发者为什么要在代码第一行添加一个分号?
既然是插件,自然是给别人用的对吧,可关键问题是你也不清楚使用这个插件的人它的代码是如何编写的,这好像挺谬论的,它的代码和我们有什么关系呢。
如果说使用者的代码会影响我们的代码,那么它又是如何影响的呢?比如我们正在编写类似下面这样的一段代码
<script src="test.js"></script>
<script src="zmz.js"></script>
第一个脚本是使用者自己写的,第二个脚本是引入的某个插件,那么浏览器又是如何解析这两个脚本的呢?不妨我们来测试一下
test.js
var a
a
zmz.js
(1+2)
如果你运行起来会发现并没有报错,也就是说javascript解析器并不会因为前面这个文件没有加分号而和后一个文件中的代码一起解析。
问题倒不在这,而是有可能你刚刚看了一本关于HTTP的书,哇靠,原来把文件合并可以减少请求数,于是乎这两个脚本融为一体了。摇身一变成了下面这样
var a
a(1+2)
你说这能不出错吗,如果我们在插件的一开始就加上分号,这种事情就不可能出现。
var a
a;(1+2)
因此不要把分号单单认为只是用来结束某段代码,它还可以用来隔离某段代码和别人划清界限。
走进javascript——不起眼的基础,值和分号的更多相关文章
- 玩转JavaScript OOP[0]——基础类型
前言 long long ago,大家普遍地认为JavaScript就是做一些网页特效的.处理一些事件的.我身边有一些老顽固的.NET程序员仍然停留在这种认知上,他们觉得没有后端开发肯定是构建不了系统 ...
- JavaScript学习02 基础语法
JavaScript学习02 基础语法 JavaScript中很多基础内容和Java中大体上基本一样,所以不需要再单独重复讲了,包括: 各种算术运算符.比较运算符.逻辑运算符: if else语句.s ...
- 【JavaScript 从零开始】 原始值和对象引用、类型转换
JavaScript 中的原始值(undefined.null . 布尔值.数值和字符串)于对象(包括数组和函数)有着根本区别. 原始值是不可更改的:任何方法都无法改变(或“突变”)一个原始值. 对于 ...
- JavaScript传递变量:值传递?引用传递?
今天在看 seajs-2.2.1/src/util-events.js源码,里面有段代码不是很理解: var events = data.events = {} // Bind event seajs ...
- JavaScript 笔记(1) -- 基础 & 函数 & 循环 & ...
目录(代码编写): 显示数据 语法 变量 & 变量类型 对象 函数 事件 字符串 运算符 条件语句 循环语句 Break 和 Continue 使用 JS 近两年,现整理下一些基本: HTML ...
- JavaScript Allongé 序幕:值和表达式
序幕:值和表达式 下面的内容非常基础,然而,就像大多数的故事一样,在最初的时候开始才是最好的开端. 想象一下,我们要去最喜欢的咖啡馆,他们会为你制作几乎任何你想要的饮料,从小而强烈的 Espres ...
- php面试专题---12、JavaScript和jQuery基础考点
php面试专题---12.JavaScript和jQuery基础考点 一.总结 一句话总结: 比较常考察的是JavaScript的HTML样式操作以及jQuery的选择器和事件.样式操作. 1.下列不 ...
- 100多个很有用的JavaScript函数以及基础写法大集合
100多个很有用的JavaScript函数以及基础写法大集合 1.document.write("");为 输出语句2.JS中的注释为//3.传统的HTML文档顺序是:docume ...
- JS获取url中query_str JavaScript RegExp 正则表达式基础详谈
面我们举例一个URL,然后获得它的各个组成部分:http://i.cnblogs.com/EditPosts.aspx?opt=1 1.window.location.href(设置或获取整个 URL ...
随机推荐
- 通过非root用户访问VNC
我采用的是realvnc5.3.2.对于非root用户通过vnc访问linux桌面,网络上绝大数文章都是说要去配置/etc/sysconfig/vncservers.但安装完realvnc5.3.2之 ...
- CCArray
CCArray也是cocos2d-x自己写的类.它相当于是objc的NSArray.在cocos2d-x中是没有NSArray的概念的(NSArray和NSMutableArray的唯一区别就是一个不 ...
- iOS数据存储
[reference]http://www.infoq.com/cn/articles/data-storage-in-ios 谈到数据储存,首先要明确区分两个概念,数据结构和储存方式.所谓数据结构就 ...
- WPF中ContextMenu通过CommandParameter传参
场景:ListBox中有个ContextMenu,希望点击其中一个菜单项的时候把ListBox当做CommandParameter传递给Command,但是发现无论是通过ElementName还是Re ...
- Lamp环境下设置绑定apache域名
先进入apache配置目录 [root@iZ233vkrtsiZ local]# cd /usr/local/apache/conf/vhost 然后找到自己网站的配置.以本站为例 [root@iZ2 ...
- MongoDB复制集环境搭建
原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://suifu.blog.51cto.com/9167728/1853478 环境介绍 ...
- java 数据设置和显示
1. 首先设置ModelAndView 的值 @Override public ModelAndView handleRequest(HttpServletRequest arg0, HttpServ ...
- KingbaseES的standby搭建
KingbaseES数据库部署及双机热备配置 Dataguard双机热备部署 注:配置期间使用数据库的属主用户进行操作 1.1 数据一致性准备 (1)修改数据库的配置文件参数:(2阶段初始化的数据库实 ...
- easelJS 初始入门
easelJS 初始入门 <%@ page language="java" contentType="text/html; charset=UTF-8" ...
- JavaScript的4种this调用模式
方法调用模式:函数调用模式:构造器调用模式:apply调用模式: 方法调用模式: 当一个函数被保存为对象的一个属性时,我们称它为一个方法.当一个方法被调用时,this被绑定到该对象. 函数调用模式: ...