javaScript 基础知识汇总(二)
1、运算符
术语或者叫法:一元运算符、二元运算符、运算元(参数)
let x=0; x=5+2; //5和2为运算元,“+” 为二元运算符; x=-x; //"-" 为一元运算符
字符串连接功能,二元运算符 +
示例:
1 let s = "my" + "string"; 2 alert(s); // mystring 3 4 5 alert( '1' + 2 ); // "12" 6 alert( 2 + '1' ); // "21" 7 8 //运算符的运算方向是由左至右。如果是两个数字,后面再跟一个字符串,那么两个数字会先相加,再转化为字符串 9 alert(2 + 2 + '1' ); // "41" 而不是 "221" 10 11 字符串连接和转化是二元运算符加号 + 的一个特性。其它的数学运算符都只对数字有效。通常,他们会转化运算元为数字。 12 13 alert( 2 - '1' ); // 1 14 alert( '6' / '2' ); // 3
数字转化功能,一元运算符 +
1 //对数字无效 2 let x = 1; 3 alert(+x);//1 4 5 let y = -2; 6 alert(+y);//-2 7 8 //转化非数字 9 alert(+true); //1 10 alert(+""); //0 11 //这种方式和Number(...)相同,但是更加简短 12 13 let apples = "5" 14 let oranges = "3" 15 alert(+apples+ +oranges);//5 16 //或者 17 alert( Number(apples) + Number(oranges) );//5
运算符优先级
赋值运算符
1 let x= 3*7+9-3 2 alert(x)
求余运算符 %
1 alert(5%2);//1是5/2的余数 2 alert( 8 % 3 ); // 2 是 8 / 3 的余数 3 alert( 6 % 3 ); // 0 是 6 / 3 的余数
幂运算符 **
1 alert( 2 ** 2 ); // 4 (2 * 2) 2 alert( 2 ** 3 ); // 8 (2 * 2 * 2) 3 alert( 2 ** 4 ); // 16 (2 * 2 * 2 * 2) 4 5 alert( 4 ** (1/2) ); // 2 (1 / 2 幂相当于开方,这是数学常识) 6 alert( 8 ** (1/3) ); // 2 (1 / 3 幂相当于开三次方)
自相加/自相减
//自相加
let counter = 2;
counter++; // 和 counter = counter + 1 效果一样,但是更加简洁
alert( counter ); // 3
//自相减
let counter = 2;
counter--; // 和 counter = counter - 1 效果一样,但是更加简洁
alert( counter ); // 1
1 //符号前置 与后置 2 3 let counter = 1; 4 let a = ++counter; // 返回自增完之后的值 5 alert(a); // 2 6 7 let counter = 1; 8 let a = counter++;// 返回未自增时的值 9 alert(a)
位运算符
- 按位与 (
&
) - 按位或 (
|
) - 按位异或 (
^
) - 按位非 (
~
) - 左移 (
<<
) - 右移 (
>>
) - 无符号右移 (
>>>
)
修改并替换
1 let n = 2; 2 n += 5; // now n = 7 (同 n = n + 5) 3 n *= 2; // now n = 14 (同n = n * 2) 4 alert( n ); // 14
逗号运算符
1 let a = (1 + 2, 3 + 4); 2 alert( a ); // 7 (3 + 4 的结果) 第一个语句 1 + 2 运行了,但是它的结果被丢弃了,然后 3 + 4 运行,计算结果被返回
2、值的比较
比较方式:
- 大于 / 小于:
a > b
,a < b
。 - 大于等于 / 小于等于:
a >= b
,a <= b
。 - 检测两个值的相等写为
a == b
(注意表达式中是两个等号=
,若写为单个等号a = b
则表示赋值)。 - 检测两个值的不等,在数学中使用
≠
符号,而在 JavaScript 中则通过在赋值符号前增加叹号表示:a != b
。
比较逻辑:
- 比较操作符始终返回逻辑值。
- 字符串间按“词典”顺序逐字符比较大小。
- 当待比较的值类型不同时,它们会被转为数字(不包括严格相等检测)进行比较。
- 在非严格相等
==
下,null
和undefined
相等且各自不等于任何其他的值。 - 在使用
>
或<
进行比较时,需要注意变量可能为null/undefined
的情况。比较好的方法是单独检查变量是否等于null/undefined
。
注意事项:
//严格相等 比如区分0和false
alert( 0 == false ); // true
alert( '' == false ); // true
alert( 0 === false ); // false,这种方式可以区分出来,上面两种不可以
1 null 和 0 的比较 2 alert(null > 0) ;//false 3 alert(null < 0 );//false 4 alert(null >=0);//true 5 //原因:因为 “==” 比较是独立的,当判断null > 0 时已经返回了false 所以再进行“==”比较叫返回的为true 6 7 undefined 和 0 8 alert( undefined > 0 ); // false (1) 9 alert( undefined < 0 ); // false (2) 10 alert( undefined == 0 ); // false (3) 11 原因: 12 (1) 和 (2) 中返回 false 是因为 undefined 在比较中被转换为了 NaN,而 NaN 是一个特殊的数值型取值,它与任何值进行比较都会返回 false。 13 (3) 中返回 false 是因为这是一个相等性检测,而 undefined 只与 null 相等,不会与其他值相等。
3、交互 alert prompt confirm
alert
- 显示信息。
-
1 alert("Hello");
prompt
- 显示信息要求用户输入文本。点击确定返回文本,点击取消或按下 Esc 键返回
null
-
1 let age = prompt('How old are you?', 100); 2 3 alert(`You are ${age} years old!`); // You are 100 years old!
confirm
- 显示信息等待用户点击确定或取消。点击确定返回
true
,点击取消或 Esc 键返回false
。 -
1 let isBoss = confirm("Are you the boss?"); 2 3 alert( isBoss ); // true 如果“确定”被按下
这些方法都是模态的:它们暂停脚本执行,并且不允许用户与该页面的其余部分交互,直到窗口被解除。
上述所有方法共有两个限制:
- 模态窗口的确切位置由浏览器决定。通常在页面中心。
- 窗口的确切外观还取决于浏览器。我们不能修改它。
4、条件运算符 if ?
if 的使用
1 let year = prompt('In which year was ECMAScript-2015 specification published?', ''); 2 3 if (year < 2015) { 4 alert( 'Too early...' ); 5 } else if (year > 2015) { 6 alert( 'Too late' ); 7 } else { 8 alert( 'Exactly!' ); 9 }
?的使用
1 let age = prompt('age?', 18); 2 3 let message = (age < 3) ? 'Hi, baby!' : 4 (age < 18) ? 'Hello!' : 5 (age < 100) ? 'Greetings!' : 6 'What an unusual age!'; 7 8 alert( message );
5、逻辑运算符
JavaScript 里有三个逻辑运算符:||
(或), &&
(与), !
(非)。
或运算符寻找第一个真值
3 alert( 1 || 0 ); // 1(1 是真值) 4 alert( true || 'no matter what' ); //(true 是真值) 5 6 alert( null || 1 ); // 1(1 是第一个真值) 7 alert( null || 0 || 1 ); // 1(第一个真值) 8 alert( undefined || null || 0 ); // 0(所有的转化结果都是 false,返回最后一个值)
与操作寻找第一个假值
1 // 如果第一个操作符是真值, 2 // 与操作返回第二个操作数: 3 alert( 1 && 0 ); // 0 4 alert( 1 && 5 ); // 5 5 6 // 如果第一个操作符是假值, 7 // 与操作直接返回它。第二个操作数被忽略 8 alert( null && 5 ); // null 9 alert( 0 && "no matter what" ); // 0
!(非)
操作符接受一个参数,并按如下运作:
- 将操作数转化为布尔类型:
true/false
。 - 返回相反的值。
- 将操作数转化为布尔类型:
1 alert( !true ); // false 2 alert( !0 ); // true
1 //两个非运算 !! 有时候用来将某个值转化为布尔类型: 2 alert( !!"non-empty string" ); // true 3 alert( !!null ); // false 4 //更详细方式 5 alert( Boolean("non-empty string") ); // true 6 alert( Boolean(null) ); // false