前端基础学习:javascript表达式,你知道为什么3+true=4吗?

原始表达式

原始表达式是最简单的表达式。它是表达式的最小单元。

前端基础学习:javascript表达式,你知道为什么3+true=4吗?

Javascript中的原始表达式有:常量、直接量、关键字、变量。

1.23 //数字直接量

"hello"//字符串直接量

true//保留字,布尔值

null//保留字,表示空值

this//保留字,返回当前对象

i //变量,表示i值

数组初始化表达式

数组初始化表达式(也称数组直接量),它实际上是一个新创建的数组。

数组初始化表达式是通过一对方括号和其内由逗号隔开的列表构成。

[] //空数组

[1 + 2,3 + 4] //[3.7]

[[1,2,3],[4,5,6]] //表达式可嵌套,这里相当于二维数组

[1,,,,,3] //逗号间元素可以省略,逗号间空位将填充为undefined

注意,元素列表最后一个元素后可以留单个逗号,但是不会创建一个值为undefined的元素。即会忽略最后一个空位。

var a = [1,];

alert('a数组的长度是:'+ a.length); //a数组的长度是:1

var b = [1,,];

alert('b数组的长度是:'+ b.length + ';b数组的第二个元素是:'+b[1]); //b数组的长度是:2;b数组的第二个元素是:undefined

//b数组列表中两个逗号间的空位是有被创建元素的,只是为赋值,为undefined。

//而第二个逗号后面的空位,被忽略,数组长度为2

对象初始化表达式

对象初始化表达式(也称对象直接量),它实际上是一个新创建的对象。

对象初始化表达式是通过一对花括号和其内由逗号隔开的值名对列表构成。

var p = {} //空对象

var q = {x:1,y:2} //有两个属性的对象

var o = {dot1:{x:1,y:3},dot2:{x:4,y:6}} //对象直接量也可嵌套

var side = 1;

var square = { 'upperLeft' :{x:q.x,y:q.y}, //对象中的属性名称可以是字符串

'lowerRight' :{x:q.x + side,y:q.y + side} //属性值也可以是表达式

};

函数定义表达式

函数定义表达式,在某种意义上也可以称为函数直接量。

一个典型的函数定义表达式包含关键字function,跟随其后的是一对圆括号,括号内是一个以逗号分隔的列表,列表含有0个或多个标示符表示参数,然后再跟随一个由花括号包裹的javascript代码段。

var square = function(x){

return x * x;

}

属性访问表达式

属性定义表达式用于获得属性或数组元素的值。

有两种写法:

expression.identifier //expression用于指定对象,identifier用于指定需要访问的属性名称

expression[expression] //表达式指定要访问的属性名称或代表要访问数组元素的索引

var o = {x:1,y:{z:3}}; //创建一个对象,有两个属性,其中属性y的值也是一个对象,有一个属性z

var a = [o,4,[5,6]]; //创建一个数组,第一个值为一个对象,第三个值是另一个数组

alert(o.x); //1 ,对象o的x属性值

alert(o.y.z); //3 ,对象o的y属性,它的z属性值

alert(o['x']); //1 ,对象o的x属性值

alert(a[1]); //4 ,数组a中索引为1的元素

alert(a[2]['1']); //6 ,数组a中索引为2的元素,它的索引为1的元素

alert(a[0].x); //1 ,数组a中索引为0的元素,它的x属性

调用表达式

调用表达式即调用函数或方法的语句。

f(0); //f是一个函数,给它传递一个值为0的参数

Math.max(x,y,z) //Math.max是一个求最大值的函数,其中x,y,z是传入的参数

a.sort() //是一个没有参数的排序函数

对象创建表达式

对象创建表达式用来创建一个对象并调用一个函数(即构造函数)初始化新创建的对象。

对象创建表达式用使用new关键字来初始化一个对象实例。

new Array(); //创建一个数组对象

new Object(); //创建一个对象

new Point(2,3); //创建一个Point对象实例

new Date; //如果构造函数不需要任何参数,可以省略圆括号,但是不推荐

一上便是关于javascript表达式和运算符的小结

目的主要有两个:

  1. 了解javascript中各种表达式

  2. 理解并等能使用javascript中各种运算符

接下来我们来看一些小知识:

JavaScript:为什么3+true=4?

3 + true === 4。学习为什么以及一起探索其他八个有趣的JavaScript方程式。

如何跟随

跟随我往下一起探索是不是觉得奇怪?你可以打开你的Chrome浏览器的开发者控制台:Windows系统按下Ctrl + Shift + J,Mac电脑按下Cmd + Option + J。这样做的好处是,让你在控制台输入以下代码,你会可以看到这些代码会发生什么。

3 + true == 4

我不是在开玩笑。在JavaScript中,当+操作符之间放置一个number
和boolean,这个boolean会转为一个number。

由于false == 0和true == 1。有此可鉴,3 + true转化为3 + 1,因此得到的答案是4。

console.log(3 + true); // 4console.log(3 + true == 4); // trueconsole.log(3 + true = 4); // Uncaught ReferenceError: Invalid left-hand side in assignment

true + false

这里的逻辑和上面的示例一样。当+运算符之间两都都是boolean,那么两个boolean
都会转成number。这样一来,true + false就转换成1 + 0,两者的结果就是1。

console.log(true + false); // 1console.log(true + true); // 2console.log(false + false); // 0

'4' + 8

当一个string数字和一个真实的number通过+运算符运算将会发生什么呢?当一个+运算符放置在一个string和number
或boolean之间时,number和boolean将变成一个string。两者将连接在一起。这个逻辑是这样的,'4' + 8变成了'4' + '8',得到的答案就是'48'。

true + '4'

类似上面的例子,JavaScript先将boolean转换成字符串,再和字符串连接。这就变成了true + '4'
的结果是true4。

console.log(true + '4'); // true4console.log('4' + true); // 4trueconsole.log(false + '4'); // false4console.log('4' + false); // 4false

注意:

如果boolean和number之间不是+运算符,是其他的运算符时(比如-、*、/或者%),boolean和string都会转换成number。比如下面的示例:

console.log(true - '4'); // -3console.log('4' - true); // 3console.log(false - '4'); // -4console.log('4' - false); // 4console.log('4' * false); // 0console.log('4' * true); // 4console.log(true / '4'); // 0.25console.log(false / '4'); // 0console.log('4' / true); // 4console.log('4' / false); // Infinityconsole.log(true % '4'); // 1console.log(false % '4'); // 0console.log('4' % true); // 0console.log('4' % false); // NaN

1 + 1 + '1'

运算符的顺序也是非常重要的。在这个例子中,JavaScript先会评估第一个运算符+,这个+前后都是number,所以先会进行加法运算,也就是1 + 1 = 2。然后继续看第二个运算符+,这个运算符是置于一个number和一个string
之间。根据前面介绍的,这个时候number
会变成string,所以两个string会拼接在一起,也就是最后的答案是'21'。操作的过程:

1 + 1 + '1' 2 + '1' '21'

'1' + 1 + 1

当我们把第一个number和最后一个string调换一个位置将会发生什么呢?要记住,操作符的运算顺序是从左到右

'1' + 1 + 1 '11' + 1 '111' string + number = string。所以这个例子最后的结果得到的是一串字符串'111'。

-'69' + 69

如果在一个string前面添加一个负号-和一个number相加,这个时候会发生什么呢?现在你应该知道,如果string
前面没有这个-号,我们的答案是'6969'。然而,有-号会有什么变化。'69'前面有一个-号,其实是一个一元操作符,它将一个string转换成一个负的number。因此我们的方程式变成了-69 + 69 = 0。最终的答案也就是0

-'giddyup' + 409

如果在一个string前有一个一元操作符(-),string总不能转换成一个number吧。当JavaScript未能生成一个

number,将会生成一个NaN(不是一个number)。这个时候运算符就变成了NaN + 409,其结果就是NaN

对前端感兴趣的,想要进行学习的朋友可以加我qq裙:213126486   邀请码:落叶,我还会不时分享一些技术经验和资料

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值