1. 进制
在js中,如果需要表示16进制的数字,则需要以0x开头
如果需要表示8进制的数字,则需要以0开头
如果要要表示2进制的数字,则需要以0b开头,但是不是所有的浏览器都支持
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var a = 123; //十六进制 a = 0x10; //十进制输出:16 a = 0xCafe; //十进制输出:51966 //八进制数字 a = 070; //十进制输出:56 //像"070"这种字符串,有些浏览器会当成8进制解析,有些会当成10进制解析 //二进制数字 a = 0b10; //十进制输出:2(很多浏览器不支持) //可以在parseInt()中传递一个第二个参数,来指定数字的进制 a = parseInt(a,10); //10进制 console.log(typeof a); console.log(a); </script> </head> <body> </body> </html>2. 运算符 (1)运算符也叫操作符
(2)通过运算符可以对一个或多个值进行运算,并获取运算结果 比如:typeof就是运算符,可以来获得一个值的类型 它会将该值的类型以字符串的形式返回。如:number string boolean undefined object
(3)包括:算数运算符、逻辑运算符、关系运算符、条件运算符等。
补充 • 使用逗号可以在一条语句中执行多次操作。
var num1=1, num2=2, num3=3; //可以同时声明多个变量并赋值 var a, b,c;//使用,运算符同时声明多个变量• 使用逗号运算符分隔的语句会从左到右顺序依次执行。
3. 算数运算符 算术运算符: 进行算数操作的运算符。
(1)+ 可对两个值进行加法运算,并将结果返回 如果对两个字符串进行加法运算,则会做拼串,会将两个字符串拼接为一个字符串并返回; 任何的值和字符串做加法运算,都会先转换为字符串,然后再和字符串做拼串的操作。
(2) - 可对两个值进行减法运算,并将结果返回
(3) * 可对两个值进行乘法运算
(4) / 可对两个值进行除法运算
(5) % 取模运算(取余数)
(6) ++ - - 自增和自减
A. 自增 ++
通过自增可以使变量在自身的基础上增加1
对于一个变量自增以后,原变量的值会立即自增1
自增分成两种:后++(a++) 和 前++(++a)
无论是a++ 还是 ++a,都会立即使原变量的值自增1
不同的是a++ 和 ++a的值不同
a++的值等于原变量的值(自增前的值) ++a的值等于新值 (自增后的值)
B.自减 - -
通过自减可以使变量在自身的基础上减1自减分成两种:后- -(a- -) 和 前- -(- -a)无论是a- - 还是 - -a 都会立即使原变量的值自减1不同的是a- - 和 - -a的值不同 a- - 是变量的原值 (自减前的值) .- -a 是变量的新值 (自减以后的值)(7)一元运算符
一元运算符只需要一个操作数.+ 正号:不会对数字产生任何影响.- 负号:可以对数字进行负号的取反对于非Number类型的值,它会将先转换为Number,然后在运算 可以对一个其他的数据类型使用+,来将其转换为number。它的原理和Number()函数一样 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>算术运算符</title> <script type="text/javascript"> /* 当对非Number类型的值进行运算时,会将这些值转换为Number然后在运算。 任何值和NaN做运算都得NaN var a = 123; var result = typeof a; //console.log(typeof result); //String result = a + 1; //124 result = 111 + 222; //333 result = true + 1; //2 result = true + false; //1 result = 2 + null; //2 result = 2 + NaN; //NaN result = "你好" + "世界"; //“你好世界” var str = "锄禾日当午," + "汗滴禾下土。" //“锄禾日当午,汗滴禾下土。” result = 123 + "1"; //“1231” result = true + "hello"; //“truehello” /* * 任何值和字符串相加都会转换为字符串,并做拼串操作 * 我们可以利用这一特点,来将一个任意的数据类型转换为String * 我们只需要为任意的数据类型 + 一个 "" 即可将其转换为String * 这是一种隐式的类型转换,由浏览器自动完成,实际上它也是调用String()函数 */ var c = 123; c = c + ""; //将c的数据类型转换成String //c = null; //c = c + ""; //console.log(typeof c); //console.log("c = "+c); //"c=123" //console.log(result); result = 1 + 2 + "3"; //33 result = "1" + 2 + 3; //123 result = 100 - 5; //95 result = 100 - true; //99 result = 100 - "1"; //99 result = 2 * 2; //4 result = 2 * "8"; //16 result = 2 * undefined; //NaN result = 2 * null; //0 result = 4 / 2; //2 result = 3 / 2; //1.5 /* * 任何值做- * /运算时都会自动转换为Number * 我们可以利用这一特点做隐式的类型转换,可通过为一个值-0、*1、/1 * 来将其转换为Number,原理和Number()函数一样,使用起来更加简单 */ var d = "123"; //console.log("result = "+result); d = d - 0; /*console.log(typeof d); console.log(d);*/ result = 9 % 3; //0 result = 9 % 5; //4 console.log("result = "+result); </script> </head> <body> </body> </html> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>自增和自减</title> <script type="text/javascript"> var num = 10; //num--; //9 //--num; //9 //console.log(num--); console.log(--num); console.log("num = "+num); var a = 1; //使a自增1 // a++; //2 // ++a; //2 //console.log(a++); //console.log("++a = " + ++a); /*console.log("a++ = " + a++); console.log("a = "+a);*/ var c = 10; //第一次c++,是在10的基础上自增 //console.log(c++); //第二次c++,是在11的基础上自增 c++; var d = 20; //console.log(++d); //21 //console.log(++d); //22 = //var result = d++ + ++d + d ; //20 + 22 + 22=64 //d = 20 d = d++; // var e = d++; //20 // d = e; //console.log("d = "+d); </script> </head> <body> </body> </html> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>一元运算符</title> <script type="text/javascript"> var a = 123; a = +a; //123 a = -a; //-123 a = true; a=-a; //-1 a = "18"; a=+a; //18 var result = 1 + +"2" + 3; //123 var result = 1 + +"2" + 3; //6 console.log("result = "+result); </script> </head> <body> </body> </html>4. 逻辑运算符 JS中为我们提供了三种逻辑运算符
(1)! 非:可以用来对一个值进行非运算
所谓非运算就是值对一个布尔值进行取反操作,true变false,false变true如果对一个值进行两次取反,它不会变化如果对非布尔值进行元素,则会将其转换为布尔值,然后取反。所以我们可以利用该特点,来将一个其他的数据类型转换为布尔值。可以为一个任意数据类型取两次反,来将其转换为布尔值,原理和Boolean()函数一样(2) && 与:可以对符号两侧的值进行与运算并返回结果
运算规则两个值中只要有一个值为false就返回false, 只有两个值都为true时,才会返回trueJS中的“与”属于短路的与,如果第一个值为false,则不会看第二个值(3) || 或:可以对符号两侧的值进行或运算并返回结果
运算规则:两个值中只要有一个true,就返回true;如果两个值都为false,才返回falseJS中的“或”属于短路的或,如果第一个值为true,则不会检查第二个值(4)&& || 非布尔值的情况
对于非布尔值进行与或运算时,会先将其转换为布尔值,然后再运算,并且返回原值
与运算: 如果第一个值为true,则必然返回第二个值 如果第一个值为false,则直接返回第一个值
或运算 如果第一个值为true,则直接返回第一个值 如果第一个值为false,则返回第二个值
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> //如果两个值都是true则返回true var result = true && true; //true //只要有一个false,就返回false result = true && false; //false result = false && true; //false result = false && false; //false //true && true //与运算:如果两个值都为true,则返回后边的 var result = 5 && 6; //6 //与运算:如果两个值中有false,则返回靠前的false //false && true result = 0 && 2; //0 result = 2 && 0; //2 //false && false result = NaN && 0; //Na result = 0 && NaN; //0 //console.log("result = "+result); //第一个值为true,会检查第二个值 //true && alert("true!!"); //第一个值为false,不会检查第二个值 //false && alert("false!!"); //两个都是false,则返回false result = false || false; //false //只有有一个true,就返回true result = true || false; result = false || true ; result = true || true ; //console.log("result = "+result); //第一个值为false,则会检查第二个值 //false || alert("123"); //第一个值为true,则不再检查第二个值 //true || alert("123"); //true || true //如果第一个值为true,则直接返回第一个值 result = 2 || 1; //2 result = 2 || NaN; //2 result = 2 || 0; //2 //如果第一个值为false,则直接返回第二个值 result = NaN || 1; //1 result = NaN || 0; //0 result = "" || "hello"; //“hello” result = -1 || "你好"; //“你好” console.log("result = "+result); var a = false; //对a进行非运算 a = !a; //true //console.log("a = "+a); var b = 10; b = !!b; //true //console.log("b = "+b); //console.log(typeof b); </script> </head> <body> </body> </html>5.赋值运算符
• 简单的赋值操作符由等于号 ( = ) 表示,其作用就是把右侧的值赋给左侧的变量。 • 如果在等于号左边添加加减乘除等运算符,就可以完成复合赋值操作。 • +=、*=、-=、/=、%= • 比如:a+=10和a=a+10是一样的。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var a = 10; a += 5; //等价于 a = a + 5 a -= 5; //等价于 a = a - 5 a *= 5; //等价于 a = a * 5 a /= 2; //等价于 a = a / 5 a = a%3; //等价于 a = a % 5 console.log("a = "+a); </script> </head> <body> </body> </html>6. 关系运算符
通过关系运算符可以比较两个值之间的大小关系,如果关系成立它会返回true,如果关系不成立则返回false 非数值的情况 对于非数值进行比较时,会将其转换为数字然后在比较如果符号两侧的值都是字符串时,不会将其转换为数字进行比较,而会分别比较字符串中字符的Unicode编码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var result = 5 > 10; //false result = 5 > 4; //true result = 5 > 5; //false result = 5 >= 5; //true result = 5 >= 4; //true result = 5 < 4; //false result = 4 <= 4; //true //console.log("result = "+result); console.log(1 > true); //false console.log(1 >= true); //true console.log(1 > "0"); //true console.log(10 > null); //true //任何值和NaN做任何比较都是false console.log(10 <= "hello"); //false console.log(true > false); //true console.log("1" < "5"); //true console.log("11" < "5"); //true //比较两个字符串时,比较的是字符串的字符编码 //console.log("a" < "b"); //true //比较字符编码时是一位一位进行比较 //如果两位一样,则比较下一位,所以借用它来对英文进行排序 //console.log("abc" < "bcd"); //true //比较中文时没有意义 //console.log("戒" > "我"); //true //如果比较的两个字符串型的数字,可能会得到不可预期的结果 //注意:在比较两个字符串型的数字时,一定一定一定要转型 console.log("11123" < +"5"); //true </script> </head> <body> </body> </html>补充
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> /* * 在字符串中使用转义字符输入Unicode编码 * \u四位编码 */ console.log("\u2620"); </script> </head> <body> //在网页中使用Unicode编码,&#编码; 这里的编码需要的是10进制 <h1 style="font-size: 200px;">☠</h1> </body> </html>7. 相等运算符
相等运算符用来比较两个值是否相等,如果相等会返回true,否则返回false== 来做相等运算 当使用==来比较两个值时,如果值的类型不同,则会自动进行类型转换,将其转换为相同的类型,然后在比较
!= 来做不相等运算 * 不相等 不相等用来判断两个值是否不相等,如果不相等返回true,否则返回false 不相等也会对变量进行自动的类型转换,如果转换后相等它也会返回false
=== 用来判断两个值是否全等 它和相等类似,不同的是它不会做自动的类型转换 如果两个值的类型不同,直接返回false
!== 用来判断两个值是否不全等 和不等类似,不同的是它不会做自动的类型转换 如果两个值的类型不同,直接返回true
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> //console.log(1 == 1); //true var a = 10; console.log(a == 4); //false console.log("1" == 1); //true console.log(true == "1"); //true console.log(null == 0); //false // undefined 衍生自 null,所以这两个值做相等判断时,会返回true console.log(undefined == null); //true //NaN不和任何值相等,包括他本身 console.log(NaN == NaN); //false var b = NaN; //判断b的值是否是NaN console.log(b == NaN); //可以通过isNaN()函数来判断一个值是否是NaN,如果该值是NaN则返回true,否则返回false console.log(isNaN(b)); console.log(10 != 5); //true console.log(10 != 10); //false console.log("abcd" != "abcd"); //false console.log("1" != 1); //false console.log("123" === 123); //false console.log(null === undefined); //false console.log(1 !== "1"); //true </script> </head> <body> </body> </html>8. 条件运算符
条件运算符也叫三元运算符语法: 条件表达式?语句1:语句2;执行的流程: 条件运算符在执行时,首先对条件表达式进行求值, 如果该值为true,则执行语句1,并返回执行结果 如果该值为false,则执行语句2,并返回执行结果 如果条件的表达式的求值结果是一个非布尔值,会将其转换为布尔值然后在运算 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> //false?alert("语句1"):alert("语句2"); var a = 300; var b = 143; var c = 50; //a > b ? alert("a大"):alert("b大"); //获取a和b中的最大值 //var max = a > b ? a : b; //获取a b c 中的大值 //max = max > c ? max : c; //这种写法不推荐使用,不方便阅读 var max = a > b ? (a > c ? a :c) : (b > c ? b : c); //console.log("max = "+max); //"hello"?alert("语句1"):alert("语句2"); </script> </head> <body> </body> </html>9. 运算符的优先级
在JS中有一个运算符优先级的表,在表中越靠上优先级越高,优先级越高越优先计算, 如果优先级一样,则从左往右计算。可以使用()来改变优先级