15-操作符

1.操作符

1.1.算数运算符

运算符	描述	例子	结果
+	加法	var num = 1 + 2;	3
-	减法	var num = 4 - 3;	1
*	乘法	var num = 4 * 3;	12
/	除法	var num = 6 / 3;	2
%	取余	var num = 7 % 3;	1

正常的数据运算

var num1 = 8;
var num2 = 4;

console.log(num1 + num2); //12
console.log(num1 - num2); //4
console.log(num1 / num2); //2
console.log(num1 * num2); //32
console.log(num1 % num2); //0

进行数据运算时，除‘+’外，其他运算符可以自动将字符串数字隐形转成数字。

var num1 = '8';
var num2 = '4';

console.log(num1 - num2); //4
console.log(num1 / num2); //2
console.log(num1 * num2); //32
console.log(num1 % num2); //0

1.2.一元运算符

JavaScript中有8种常用的一元运算符

运算符	描述
+	将操作数转换成数字，字符串的拼接
-	将操作数转换成数字，同时变为负数
!	逻辑取反运算符
++	递增
–	递减
delete	删除数组或对象中特定索引的值
typeof	操作数放到typeof的后面，会返回当前操作数的类型，对于数值类型可以准确返回，对于引用类型，Function会返回’function’，其他都只会返回’object’
void	void 运算符对任何值返回 undefined。

+（正号）

1.‘+’的第一种用法：进行数据相加

var num1 = 3;
var num2 = 5;
var sum = num1 + num2; //8

2.‘+’放在数据的前面，就是取正数

var num = 6;
console.log(+num); // 6

3.‘+’与字符串运算时，就是字符串连接符

var a = 'hello';
var b = 'world';
console.log(a + b); // helloworld

4.’+'可以将数字字符串或布尔类型等隐式转换成number类型

var a = '123';
var b = true;
console.log(+a, +b); // 123  1

-（负号）

1.正、负号可以对数字进行取正或取负，其他运算符不能转换

var num1 = 6;
var num2 = -6;
console.log(-num1); //-6
console.log(+num1); //6
console.log(-num2); //6
console.log(+num2); //-6

2.正、负号可以将字符串数字隐式转换成数字

var num1 = '20';
var num2 = '-20';
console.log(-num1); //-20
console.log(+num1, typeof +num1); //20 number
console.log(-num2); //20
console.log(+num2, typeof +num2); //-20 number

！（取反）

经常被用作条件判断时的取反操作，类型判断等，还可以用’!'将变量转换为Boolean类型

var a;
if (!a) {}
console.log(!null);  //true
console.log(!undefined);  //true
console.log(!''); //true
console.log(!100);  //false
console.log(!'abc');  //false

++(递增)

++放在前面，并进行赋值：先累加，后赋值

var num = 0;
var a = ++num;
console.log(a); // 1
console.log(num); // 1
//num先自加1，再赋值给a

++放在后面，并进行赋值：先赋值，后累加

var num = 0;
var a = num++;
console.log(a); // 0
console.log(num); // 1
//先把num的值赋值给a，num再自加1

–(递减)

用在循环语句、动画操作。使用方法与++类似。

delete

删除数组或对象中特定索引的值

var obj = {
  name:'zhangsan',
  age: 17
};
delete obj.name;
console.log(obj); // {age: 17}

var arr = [1,2,3,4,5];
delete arr[2];
console.log(arr); //[ 1, 2, <1 empty item>, 4, 5 ]

typeof

操作数放到typeof的后面，会返回当前操作数的类型，对于数值类型可以准确返回，对于引用类型，Function会返回’function’，其他都只会返回’object’

var obj = {
  name:'zhangsan',
  age: 17
};
var arr = [1,2,3,4,5];
console.log(typeof obj, typeof arr); //object object

void

丢弃表达式的返回值，返回underfined

1.3.赋值运算符

运算符	例子	等同于
=	x = y	x = y
+=	x += y	x = x + y
-=	x -= y	x = x - y
*=	x *= y	x = x * y
/=	x /= y	x = x / y
%=	x %= y	x = x % y

= 赋值运算符向变量赋值。

var x = 7;

+= 赋值运算符向变量添加值。

var x = 7;
x += 8; 

-= 赋值运算符从变量中减去一个值。

var x = 7;
x -= 8; 

*= 赋值运算符相乘变量。

var x = 7;
x *= 8; 

/= 赋值运算符对变量相除。

var x = 7;
x /= 8;

%= 赋值运算符把余数赋值给变量。

var x = 7;
x %= 8;

1.4.比较运算符

在逻辑语句中使用，以判定变量或值是否相等，一般用于条件判断语句中。

比较运算符的优先级低于算数运算符，高于赋值运算符，运算结果一般都为布尔。

运算符	描述	比较	返回
==	等于	x == 8	false
		x == 5	true
		x == “5”	true
===	值相等并且类型相等	x === 5	true
		x === “5”	false
!=	不相等	x != 8	true
!==	值不相等或类型不相等	x !== 5	false
		x !== “5”	true
		x !== 8	true
>	大于	x > 8	false
<	小于	x < 8	true
>=	大于或等于	x >= 8	false
<=	小于或等于	x <= 8	true

==

等同的意思，两边值类型不同的时候，先进行类型转换为同一类型，在比较值是否相等。

// 常用于相同类型的值的比较
console.log(123 == 345);  //false
console.log('123' == '345');  //false
// 如果两个值类型不同，也有可能相等，需根据以下规则进行类型转换在比较
// 如果一个是null，一个是undefined，那么相等
console.log(null == undefined); //true
// 如果一个是字符串，一个是数值，把字符串转换成数值之后再进行比较
console.log(123 == '123');  //true
//如果是整数类型和boolean类型的数值进行比较，1和true使用==比较结果为true，0和false使用==比较结果也为true，其它都为false；可以理解记忆为使用==比较整数时将1等同true，将0等同false。
console.log(1 == true); //true
console.log(0 == false);  //true

===

恒等的意思，不用做类型转换，类型不同的结果一定不等。

// 如果类型不同，就一定不相等
console.log(123 === '123'); //false
// 如果两个都是数值，并且是同一个值，那么相等；如果其中至少一个是NaN，那么不相等。（判断一个值是否是NaN，只能使用isNaN() 来判断）
console.log(123 === 123); //true
console.log(123 === 10 / 'a');  //false
// 如果两个都是字符串，每个位置的字符都一样，那么相等，否则不相等。
console.log('hello' === 'hello'); //true
// 如果两个值都是true，或是false，那么相等
console.log(true === true); //true
console.log(1 === true);  //false
// 如果两个值都是null，或是undefined，那么相等
console.log(null === null); //true
console.log(null === undefined);  //false

双等和三等的区别

双等表示只要值相等即可为真，而三等则要求不仅值相等并且还要要求类型相等。

建议：尽量使用三等，因为二等不严谨。

注意点：

1. 对于string、number等基础类型，双等和三等是有区别的。
2. 对于Array、Object等高级类型，双等和三等是没有区别的。
3. 基础类型与高级类型，双等和三等是有区别的。

!=

!=和!==用法相似，若比较类型不同，先转换类型再做值的比较，最后返回值比较结果。

!==

!=和===用法类似，只有在相同类型下才会比较其值。

‘>‘和’<’

var a = 10;
var b = 20;
console.log(a > b); //false
console.log(a < b); //true

‘>=‘和’<=’

var a = 10;
var b = 20;
console.log(a >= b); //false
console.log(a <= b); //true

非数值的情况下使用’>’’<’’>=’’<=’

对于非数值进行比较时，先转换为数值在进行比较。

// true转换为数值是1 false转换为数值是0
console.log(1 > true); // 结果为false
console.log(1 >= true); // 结果为true
console.log(1 > '0'); // 结果为true
console.log(1 > null); // 结果为true
//任何值和NaN作比较结果都是false
console.log(1 > 'hello'); // 结果为false 任何值和NaN作比较结果都是false

若符号两边都是字符串，不用转换为数值再比较，应比较Unicode编码。

注意点：若在比较两个字符串型的数字时，一定要先转型。

console.log('134545353' > '5'); // 不转型则返回false
console.log('134545353' > +'5');// 这样结果才返回true

若在比较字符编码时，是一位一位比较的，若符号两侧第一位一样，则比较下一位。

console.log('1' < '5'); // 结果为true
console.log('11' < '5'); // 结果也为true
console.log('be' > 'b'); // 结果为true 先比较第一位b的字符编码是一样的，再比较第二位，由于be有e，而b只有一位，所以be>b
console.log('be' < 'b'); // 结果为false

1.5.逻辑运算符

运算符	描述	例子
&&	and	(x < 10 && y > 1) 为 true
||	or	````(x==5
!	not	!(x==y) 为 true

&&与（同真才真，有假则假）

如果第一个操作数是null,NaN,undefined,false,0,""可被转换为false的值的时候返回该值。

console.log(null && 'world'); //null

当第一个表达式为真，整个表达式的结果取决于第二个表达式，返回第二个表达式。

console.log('hello' && 'world'); //world

当第一个表达式为假，整个表达式的结果就可以确定，返回第一个表达式。

console.log(false && 'world'); //false

[null,NaN,undefined,false,0,""]直接返回该操作数

console.log(''&&123);  //''  空字符串
console.log(0&&null);  //0
console.log(123&&345); //345
console.log(123&&undefined); //undefined

||（有真才真，同假则假）

如果两个或多个操作数都是null,NaN,undefined,false,0,""可被转换为false的值的时候返回该值。

console.log(null || false); //false

如果第一个操作数是null,NaN,undefined,false,0,"" 则返回第二个操作数。

console.log(null || 'hello'); //'hello'

如果第一个操作数是真，直接返回第一个操作数。

console.log(123||345);   //123

当第一个表达式为真，整个表达式的结果就可以确定，返回第一个表达式

当第一个表达式为假，整个表达式的结果取决于第二个表达式，返回第二个表达式

有一个为true结果就为true

同时为false结果才为false

!(NOT)

经常被用作条件判断时的取反操作，类型判断等，还可以用’!'将变量转换为Boolean类型。

var a;
if (!a) {}
console.log(!null);  //true
console.log(!undefined);  //true
console.log(!''); //true
console.log(!100);  //false
console.log(!'abc');  //false

1.6.三目运算符

基本语法为: expression ? sentence1 : sentence2

当expression的值为真时执行sentence1，否则执行 sentence2

var age = 19;
var result = age > 16 ? "成年人":"未成年人";
// 当age大于16岁时，条件为真，执行sentence1，其次反之

!(NOT)

经常被用作条件判断时的取反操作，类型判断等，还可以用’!'将变量转换为Boolean类型。

var a;
if (!a) {}
console.log(!null);  //true
console.log(!undefined);  //true
console.log(!''); //true
console.log(!100);  //false
console.log(!'abc');  //false

1.6.三目运算符

基本语法为: expression ? sentence1 : sentence2

当expression的值为真时执行sentence1，否则执行 sentence2

var age = 19;
var result = age > 16 ? "成年人":"未成年人";
// 当age大于16岁时，条件为真，执行sentence1，其次反之