JavaScript基础(3)运算符 +、==、&&、||、i++、++i

571 阅读5分钟

+的 数学运算和字符拼接

  1. 当表达式中出现字符串,就是字符串拼接否则是数学运算
  2. 数学运算:遇到的只要不是字符串都先转化为数字
  3. 字符串拼接:遇到的只要不是字符串都先调用toString方法转为字符串
  4. 对象数据类型的数学运算中除了普通对象,其他的都是先转字符串进行字符串拼接
  • 1+true => 2 数学运算
  • '1' + true => '1true' 字符串拼接
  • [12] + 10 => '1210' 虽然现在没有字符串,但是引用数据类型转为数字先转为了字符串,所以变为了字符串拼接,(在对象数据类型中除了普通对象,其他的都是先转字符串再进行字符串拼接)
  • ({}) + 10 => "[object Object]10"
  • []+ 10 => '' + 10 => '10' 这些输出是控制台直接输出,console.log结果是"[object Object]10"
  • {} +10 => 10 这个和上边说的没关系,因为它既不是数学运算,也不是字符串拼接,他是两部分代码
    • {}代表一个代码块(块级作用域)
    • +10 才是我们的操作
    • 严格写法:{};+10; 结果是10
    • function(){} +10 => +10; => 10
    • +10 就是0+10
12+true+false+null+undefined+[]+'哈哈哈'+null+undefined+[]+true

12+true =>13
13+false =>13
13+null  =>13
13+undefined =>NaN
NaN+[]  => NaN+'' => 'NaN'
'NaN'+'哈哈哈' =>  'NaN哈哈哈'
'NaN哈哈哈'+null+undefined  =>  'NaN哈哈哈nullundefined'
'NaN哈哈哈nullundefined' + []  =>  'NaN哈哈哈nullundefined'+''=>'NaN哈哈哈nullundefined'

'NaN哈哈哈nullundefined'+ true  =>  'NaN哈哈哈nullundefinedtrue'
 

==在进行比较的时候,如果左右两边的数据类型不一样,则先转换为相同的类型(数字类型),再进行比较

对象==对象:不一定相等,对象操作的是引用地址,地址不相同则不相等

{name:'aa'}=={name:'aa'}   =>false
[]==[]  false

var obj={}
var obj1=obj,obj2=obj;
obj1==obj2   true

不同数据类型比较,都是把其他值转化为数字,然后在进行比较

对象 == 数字 :把对象转化为数字,然后比较

对象==布尔 :把对象转为数字,把布尔也转换为数字

对象==字符串: 把对象转为数字,把字符串也转换为数字

字符串==数字:把字符串转换为数字

字符串==布尔: 都转换为数字

数字==布尔: 布尔转换为数字

[] == ![]: true

![]   !符号转化为了boolean
[] == false
== 操作符 不同类型先转数字 再比较
0 == 0
true

//typeof []  //Object
//typeof ![] //Boolean

null == undefined :true ;js规定null 和 undefined在相等操作符中是相等的(不是转数字的原因)

null除了等于undefined和自身以外,不等于任何数据(undefined同理)

在比较相等性之前,不能将null和undefined转化其他任何数据类型(也就是说null除了等于undefined,不等于任何数据,虽然Number(null) 结果是0 但是 0 == null 是 false)

null === undefined :false

在===情况下null、undefined和其他值都不相等,只和自己相等`

null == null true

undefined == undefined true

NaN== NaN false

NaN和谁都不相等包括自己

1==true    :true
1==false   :false
2==true    :false   这里是把true变为数字


[] == []   :false
[]==false   :true   都转化为数字  0 == 0
[]==true    :false   都转化为数字  0 == 1
![]==false  :true   //先算 ![],把数组转化为布尔得到true取反为false  =>  false == false  

等号操作

= :赋值,等号左边是变量,右边是值;(右边不管是啥都先转化为值)

==:比较,如果左右两边值的类型不一样,浏览器会默认转化为一样的(转化为数字)在进行比较;例如:'6' == 6 => '6' ->6 => 6==6 =>true

===:绝对相等,不仅要求值一样,并且类型也要完全一样;'6'===6 false

&&逻辑与 VS ||逻辑或

1、在条件判断中

&&:所有条件都为真,整体才为真

||:只要有一个条件为真,整体都为真

2、在赋值操作中

||: A|| B 首先看A的真假,A为真返回的是A的值,A为假返回的B的值(不管B是啥) 1|| 2 => 1 ;0|| false=>false;

&& : A&&B 首先看A的真假,A为真返回B的值,A为假返回A的值;1&&2 => 2;0&&false => 0

真实项目中我们利用逻辑或实现默认值的设置操作,形参的默认值赋值

callback && callback(); callback为真callback就执行

逻辑与 的优先级高于 逻辑或 先计算 逻辑与

function fn(num,callback){
    //=>如果num没有传递值让其默认值为0;
    //if(typeof num === 'undefined') num=0;  更严谨
    num=num || 0;

    //如果 callback传递的是一个函数,就把这个函数执行
     //if(typeof callback === 'function') callback();  更严谨
     callback && callback();
}
0 || 2 && false || 3

2&&false   //false
0||false   //false
false || 3 //3

数学运算:+、-、*、/、% ,

+不仅仅是数学运算,还有可能是字符串拼接

i++就是单纯的数学运算,已经摒弃掉字符串拼接的规则

数学运算先把不是数字的调用Number()转化为数字

'3' - 1  =>2
	Number('3')  =>3
	3-1  =>2

'3px' - 1  => NaN

'3px' + 1  =>  '3px1'

var  i=3;
i+='1';  => '31'
i=i+'1'; => '31'
i++;   =>4  //i++就是单纯的数学运算,已经摒弃掉字符串拼接的规则

i++ 与 ++i

i++:先拿原有i的值和其他值进行运算,运算完成后再自身累加

++i:先自身累加1,然后拿累加完的值和其他值进行运算

var i=5;
console.log( 10 + (++i) + (i++) + 5 + (i++) + (++i))
             10 +  6  + 6   + 5 + 7 +  9
                  I=6  I=7      I=8  I=9
var i=5;
console.log(5+i++)    =>10   5+(i++)  加括号也是先运算再累加1
console.log(i) => 6

var i=5
console.log(5+++i) => 报错
console.log(5+ ++i) => 11
console.log(5+ (++i)) => 11