js 小记

1.操作符的优先级

function(){}()报语法错误的原因:

一元操作符是右序优先结合的。所以你的表达式相当于:function()({}())//实践得出报错都是一样的;所以应该:(function(){})();

但为什么(function(){}())不报错而且能执行呢?

分组操作符:

主要用途:

1、结合逗号操作符用于赋值。例如:var num = (5,1,4,8,0);这里num最后的值为0。

2、转换为表达式。比如eval(‘(‘+jsStr+‘)‘);又比如:
function fn(){
}//函数声明,不能直接调用
(function fn(){
})();//使用()将函数括起来,便可以直接调用
3、用于调用函数。比如fn();。

操作符是从左向右:2+3+4

 

类别 操作符  描述 说明
一元操作符 ++  自增1
1、自增(减)有前置和后置两种类型,前置先自增(减)再参与其它运算,后置先参与其它运算再自增(减)。

2、在ES中,自增(减)不仅适用于整数,它们可以作用于任意值,对于不是Number类型的值,会先按前一篇文章中的规则隐式转换为Number,然后再自增(减),此时变量类型也会变成Number类型。

--  自减1
+  一元加 一元加最主要的应用就是将操作数转变为Number类型,相当于调用Number()转换。 
-  一元减 一元减则是在一元加的基础之上再取其相反数。
算术操作符 +  加
1、除了加(+)之外,如果操作数不是Number类型,会自动调用Number()转换为Number类型再进行计算。

2、对于加减(+-),除了作为算术运算符。还可以作为一元操作符(见上)。当然,由于字符串操作中对加号(+)的重载,还可以用于将任意数值(的字符串)相连,这也是第1点中为什么要除了加(+),它在含有非Number类型值时,会将所有操作数转换为字符串相连接。

3、与一般类C语言不同,在ES中,除(/)和取模(%)并不会区分整数和浮点数,比如 5 / 2 = 2.5 而不是2,5.3 % 3 = 2.3 而不是2。

4、任意运算,只要操作数含NaN,结果就是NaN。但并不是结果为NaN就一定有一个操作数为NaN,比如0/0也返回NaN。

5、对于含无穷Infinity的运算,规定比较多,这里就不列举了,可以参考原书,或者自行测试。

-  减
*  乘
/  除
%  取模
逻辑操作符

(布尔操作符)

!  逻辑非
首先将操作数转换为Boolean类型值,然后再取反。可以使用双重非!!将一个数值转换为相应的Boolean值。

&&  逻辑与
1、当两个操作数相应的Boolean值均为true时,返回true

2、短路:当第一个操作数相应的Boolean值为false时,会直接返回false,不会再计算第二个操作数。这常常被应用在判断一个变量(属性)是否有定义,如:
if(object && object.name && object.name = ‘linjisong‘){ }
 这里会首先判断object存在,不存在的话就不会解析object.name从而阻止错误的发生,同样,也只有object.name存在,才会去比较这个值。

||  逻辑或
1、当两个操作数相应的Boolean值至少有一个为true时,返回true

2、短路:当第一个操作数相应的Boolean值为true时,会直接返回true,不会再计算第二个操作数。

3、逻辑或,除了用于一般的判断之外,还常常被应用在提供默认值的情况,如:

function Fn(obj){
   obj = obj || {};
}

这里如果调用Fn未传入obj,则会自动给obj赋值为undefined,然后因为undefined的相应Boolean值为false,所以会将一个空对象{}赋值给obj,如果调用传入了obj,则因为任意对象的Boolean值为true,所以就不会取后面的{},从而达到给obj一个默认值{}的效果。

这种方式还被应用在大型JS库的多个相对独立的文件中:
//jsLib
var jsLib;
//file1
(function (jsLib){
   jsLib = jsLib || {};
})(jsLib);

//file2
(function (jsLib){
   jsLib = jsLib || {}; 
})(jsLib);

使用这种方式,无论先加载哪个文件,都会判断jsLib是否已经定义,如果未定义就提供一个默认值,这样做可以使得相对独立模块可以不用考虑加载顺序。


关系操作符

(比较操作符)

<  小于
1、只要有一个操作数是Number类型或Boolean类型值,就将两个操作数转换成Number类型值(如果需要转换)执行数值比较。

2、字符串比较,会逐个比较字符编码值。

3、操作符是对象时,调用valueOf()(如果没有,就调用toString()),再将结果按上面规则比较。

4、任意数和NaN比较返回false。

<=  小于或等于
>  大于
>=  大于或等于
==  相等
1、相等和不等(==、!=)在比较时,只要有必要,就会隐式类型转换。

2、全等和不全等(===、!==)在比较时,不会转换类型,如果类型不一致,直接为!==。

3、结合1、2,可以知道,a===b则一定有a==b,而a!=b则一定有a!==b。

!=  不等
===  全等
!==  不全等
赋值操作符 =  赋值  
复合算术赋值操作符  算术运算符加= 对应算术运算符,有+=、-=、*=、/=、%= 
复合按位赋值操作符  按位运算符加= 对应按位运算符,有~=、&=、|=、^=、<<=、>>=、>>>=
按位操作符 ~  按位非 按位取反,也即返回反码
&  按位与 按位对齐,逐位操作,只有两个操作位均为1才返回1,否则该位返回0,最后将所有位操作结果组合返回
|  按位或 按位对齐,逐位操作,只有两个操作位均为0才返回0,否则该位返回1,最后将所有位操作结果组合返回 
^  按位异或 按位对齐,逐位操作,两个操作位不相同时返回1,否则该位返回0,最后将所有位操作结果组合返回
<<  左移 二进制数向左移位,左移不会改变符号位 
>>  有符号右移 二进制数向右移位,高位以符合位填充 
>>>  无符号右移 二进制数向右移位,直接右移,对于正数,结果和>>相同,对于负数,会把负数的二进制补码当成正数的二进制码处理
字符串操作符 +  字符串连接 相当于concat()函数,会先将所有操作数转换为字符串,然后再连接。注意,字符串一旦创建就不会变更,执行字符串连接时,在后台会有一个中间的连接和销毁过程,这也是老旧浏览器在大量字符串连接操作时运行缓慢的原因。
+=  字符串连接复合 a+=b,相当于a=a+b。 
对象操作符 .  属性访问符 简单的对象属性访问符。
[]  属性或(类)数组访问 通过[],可以访问名称是一个变量或含有特殊字符的属性。
new  调用构造函数创建对象 返回一个新创建的对象,在构造函数内部的this被指向这个新创建的对象。
delete  变量、属性删除 删除属性(变量可以看成是全局对象或执行环境的一个属性)。
void   返回undefined。
in  判断属性 对象属性或原型链上的属性。
instanceof  原型判断 比较同一个上下文中的对象是否为另一个对象的原型。
其它操作符 ?:  条件操作符 语法;var value = exp ? trueExp : falseExp。 相当于var value; if(exp){ value = trueExp;}else{value = falseExp;}
,  逗号操作符 主要用于声明多个变量,这也是很多JS库的流行做法。例如:var num1=1,num2=2,num3=3;
()  分组操作符
主要用途:

1、结合逗号操作符用于赋值。例如:var num = (5,1,4,8,0);这里num最后的值为0。

2、转换为表达式。比如eval(‘(‘+jsStr+‘)‘);又比如:
function fn(){
}//函数声明,不能直接调用
(function fn(){
})();//使用()将函数括起来,便可以直接调用
3、用于调用函数。比如fn();。

typeof  类型操作符
返回一个字符串值:Undefined类型—>‘undefined‘、Null类型—>‘object‘、Boolean类型—>‘boolean‘、Number类型—>‘number‘、String—>‘string‘、内置Function对象的实例—>‘function‘、其它Object类型—>‘object‘。(有些浏览器实现略有不同)

说明几点:

1、这里的分类并不十分严格,比如按位非(~)、逻辑非(!)、delete、void、typeof,都可以算是一元操作符,而自增(++)在很多资料中也被归为算术操作符之中。我在整理时则主要参考原书分类,也兼顾自然性。

2、加号(+)的用法比较灵活,需注意,特别是用于计算时,忽略了其中的字符串,会很容易犯错误。

3、typeof一般用来判断简单数据类型,如果是对象类型,因为大部分返回的都是object,没有多大实际用处,而instanceof的判断也需要满足同一个上下文的条件,否则也会出错,对于对象类别的判断会在后面讲述对象时再详细说明另外一种更为稳妥的方法。

4、先看下面的代码:

复制代码代码如下:

var numVal = 10.00, 
strVal = ‘10‘, 
strObj = new String(‘10‘); 
console.info(numVal == strVal);//true 
console.info(typeof (strVal+strObj));//string

第一个输出的竟然是true,是不是出乎你的意料?在这里,由于==比较符发生了隐式类型转换,会将Number类型转换为String类型,然后Number类型的10.00因为小数点后没有不是0的数值,会被解析成整数10,从而比较的时候会相等。第二个输出是string,这其实还是比较容易理解的,strVal是字符串,strObj是字符串对象,两者相加,会把对象转换成字符串,所以最终结果也是字符串类型。 
5、关于符号,重复一下几个流行的用法(这里不涉及正则表达式中的用法): 
(1)使用一元加号(+)转换为Number类型。 
(2)使用双重逻辑非(!!)转换为Boolean类型。 
(3)使用逻辑与(&&)来检测对象是否存在并进行后续操作。 
(4)使用逻辑或(||)来给函数参数提供默认值。 
(5)使用分组(())来明确指定为表达式。 
(6)使用花括号({})来定义对象字面量,JSON数据格式,代码块。 
(7)使用中括号([])来定义数组字面量,JSON数据格式,访问数组,访问名称是变量或特殊字符的属性。
6、关于按位运算,虽然结果不是很直观,但是运行效率高,也有很多有趣的应用,比如不使用中间变量直接交换两个数值、判断奇数和偶数、MD5加密等等,有兴趣的朋友可以找相关资料自行研究。

js 小记

时间: 2024-10-21 13:38:02

js 小记的相关文章

js小记 function 的 length 属性

原文:js小记 function 的 length 属性 [1,2,3].length  可以得到 3, "123".length  也可以得到 3,这个略懂js的都知道. 但是  eval.length,RegExp.length,"".toString.length,1..toString.length  会得到什么呢? 分别得到 1,2,0,1,这些数字代表什么呢? 这个是群里很多新人朋友一直问的一个问题,其实函数的 length 得到的是形参个数.可以参见这

HTML/CSS/JS小记

HTML CSS 1..html插入.css <head> <link rel="stylesheet" type="text/css" href="style.css"> </head> 2.调用元素的class: <div class="div1"></div> <syle> .div1 {margin:auto} <!--或者用下面的-->

js 正则学习小记之匹配字符串优化篇

昨天在<js 正则学习小记之匹配字符串>谈到 /"(?:\\.|[^"])*"/ 是个不错的表达式,因为可以满足我们的要求,所以这个表达式可用,但不一定是最好的.从性能上来说,他非常糟糕,为什么这么说呢,因为 传统型NFA引擎 遇到分支是从左往右匹配的,所以它会用 \\. 去匹配每一个字符,发现不对后才用 [^"] 去匹配.比如这样一个字符串: "123456\'78\"90"共 16 个字符,除了第一个 " 直接

js 正则学习小记之匹配字符串

原文:js 正则学习小记之匹配字符串 今天看了第5章几个例子,有点收获,记录下来当作回顾也当作分享. 关于匹配字符串问题,有很多种类型,今天讨论 js 代码里的字符串匹配.(因为我想学完之后写个语法高亮练手,所以用js代码当作例子) var str1 = "我是字符串1哦,快把我取走", str2 = "我是字符串2哦,快把我取走"; 比如这样一个字符串,匹配起来很简单 /"[^"]*"/g 即可. PS: 白色截图是 chrome 3

JS常用函数用途小记

concat() 方法用于连接两个或多个数组. 该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本. var a = [1,2,3]; document.write(a.concat(4,5)); shift() 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值. var arr = new Array(3) arr[0] = "George" arr[1] = "John" arr[2] = "Thomas" document

js变量提升小记

作为世界上最优美的语言javascript的使用者,呵呵,js的魅力是无穷的,今天来聊聊他的魅(dan)力(teng)之一,变量提升. 每种语言所定义的变量基本都会有一定得作用域,而js的作用域则存在着一定的陷阱.首先看一下下面一道题: <script> var str1 = "haha"; var str2 = "hehe"; function t1() { console.log(str1); console.log(str2); var str2

Node.js+Express4+Nunjucks+supervisor安装使用小记

大家都很熟悉Node.js就不用作过多介绍了. 各个项目的首页: Node.js: http://nodejs.org Express: http://expressjs.com Nunjucks: http://mozilla.github.io/nunjucks/ supervisor: https://github.com/isaacs/node-supervisor 其中,Nunjucks受Python的Jinja2模板启发发展而来,如果有使用Python的Django模板爱好者的话可以

学习小记:JS判断时特殊值与boolean类型的转换

扒开JQuery以及其他一些JS框架源码,常常能看到下面这样的判断, 写惯了C#高级语言语法的我,一直以来没能系统的理解透这段代码. var test; //do something... if(test){ //do something... } 此处就系统的记录一下这个JS特殊值与boolean类型的转换,测试代码与结果如下 window.onload = function () { var minusNum = -1; var zero = 0; var one = 1; var stri

js 正则学习小记之NFA引擎

之前一直认为自己正则还不错,在看 次碳酸钴,Barret Lee 等大神都把正则玩的出神入化后发现我只是个战五渣.  求抱大腿,求大神调教. 之前大致有个印象,正则有很多种引擎,但我根本不知道有哪些引擎. 今天在读<精通正则表达式>才发现有Traditional NFA,POSIX NFA 和 DFA (具体自己百度下吧).可用了这么久的正则,还不知道 js 属于哪一种呢.在<精通正则表达式>里有个简单是方法检测属于哪一种. 用 /nfa|nfa not/ 去匹配 "nf