码迷,mamicode.com
首页 > Web开发 > 详细

JS基础学习第二天

时间:2021-04-01 13:22:42      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:分支   一段   基础上   也会   执行流程   表达式求值   div   container   定义   

类型转换

类型转换就是指将其他的数据类型,转换为String Number 或 Boolean

转换为String

方式一(强制类型转换):

调用被转换数据的toString()方法
例子:
var a = 123;
a = a.toString();
注意:这个方法不适用于null和undefined
由于这两个类型的数据中没有这个方法,所以调用toString()时会报错

方式二(强制类型转换):

调用String()函数
例子:

1
2
var a = 123;  
a = String(a);

 

原理:对于Number Boolean String都会调用他们的toString()方法来将其转换为字符串,对于null值,直接转换为字符串”null”。对于undefined直接转换为字符串”undefined”

方式三(隐式的类型转换):

为任意的数据类型 +“”
例子:

1
2
var a = true;  
a = a + "";

 

原理:和String()函数一样

转换为Number

方式一(强制类型转换):

调用Number()函数
例子:

1
2
var s = "123";  
s = Number(s);

 

转换的情况:

  1. 字符串 ——> 数字
    如果字符串是一个合法的数字,则直接转换为对应的数字
    如果字符串是一个非法的数字,则转换为NaN
    如果是一个空串或纯空格的字符串,则转换为0
  2. 布尔值 ——> 数字
    true转换为1
    false转换为0
  3. 空值 ——> 数字
    null转换为0
  4. 未定义 ——> 数字
    undefined 转换为NaN

方式二(强制类型转换):

调用parseInt()或parseFloat()
这两个函数专门用来将一个字符串转换为数字的

如果对非String使用parseInt()或parseFloat(),它会先将其转换为String然后在操作 parseInt()
可以将一个字符串中的有效的整数位提取出来,并转换为Number
例子:

1
2
var a = "123.456px";  
a = parseInt(a); //123

 

parseFloat()可以将一个字符串中的有效的小数位提取出来,并转换为Number
例子:

1
2
var a = "123.456px";  
a = parseFloat(a); //123.456

 

方式三(隐式的类型转换):

使用一元的 +来进行隐式的类型转换
例子:

1
2
var a = "123";  
a = +a;

转换为布尔值

方式一(强制类型转换):

使用Boolean()函数
例子:

1
2
var s = "false";  
s = Boolean(s); //true

 

转换的情况
字符串 ——> 布尔
除了空串其余全是true

数值 ——> 布尔
除了0和NaN其余的全是true

null、undefined—— > 布尔
都是false

对象 ——> 布尔
都是true

方式二(隐式类型转换):

为任意的数据类型做两次非运算,即可将其转换为布尔值
例子:

1
2
var a = "hello";  
a = !!a; //true

基础语法

运算符

运算符也称为操作符
通过运算符可以对一个或多个值进行运算或操作

typeof运算符

用来检查一个变量的数据类型
语法:typeof 变量
它会返回一个用于描述类型的字符串作为结果

算数运算符

+?对两个值进行加法运算并返回结果
-?对两个值进行减法运算并返回结果
*?对两个值进行乘法运算并返回结果
/?对两个值进行除法运算并返回结果
%?对两个值进行取余运算并返回结果

除了加法以外,对非Number类型的值进行运算时,都会先转换为Number然后在做运算。
而做加法运算时,如果是两个字符串进行相加,则会做拼串操作,将两个字符连接为一个字符串。
任何值和字符串做加法,都会先转换为字符串,然后再拼串。

一元运算符

一元运算符只需要一个操作数

一元的+

就是正号,不会对值产生任何影响,但是可以将一个非数字转换为数字
例子:

1
2
var a = true;  
a = +a;

 

一元的-

就是负号,可以对一个数字进行符号位取反
例子:

1
2
var a = 10;  
a = a;

 

自增

自增可以使变量在原值的基础上自增1
自增使用 ++
自增可以使用 前++(++a)后++(a++)
无论是++a 还是 a++都会立即使原变量自增1
不同的是++a和a++的值是不同的,
++a的值是变量的新值(自增后的值)
a++的值是变量的原值(自增前的值)

自减

自减可以使变量在原值的基础上自减1
自减使用
自减可以使用 前(a)后(a)
无论是a 还是 a都会立即使原变量自减1
不同的是a和a的值是不同的,
a的值是变量的新值(自减后的值)
a的值是变量的原值(自减前的值)

逻辑运算符

!
非运算可以对一个布尔值进行取反,true变false false边true
当对非布尔值使用!时,会先将其转换为布尔值然后再取反
我们可以利用!来将其他的数据类型转换为布尔值

&&
&&可以对符号两侧的值进行与运算
只有两端的值都为true时,才会返回true。只要有一个false就会返回false。
与是一个短路的与,如果第一个值是false,则不再检查第二个值
对于非布尔值,它会将其转换为布尔值然后做运算,并返回原值
规则:
1.如果第一个值为false,则返回第一个值
2.如果第一个值为true,则返回第二个值

||
||可以对符号两侧的值进行或运算
只有两端都是false时,才会返回false。只要有一个true,就会返回true。
或是一个短路的或,如果第一个值是true,则不再检查第二个值
对于非布尔值,它会将其转换为布尔值然后做运算,并返回原值
规则:
1.如果第一个值为true,则返回第一个值
2.如果第一个值为false,则返回第二个值

赋值运算符

=
可以将符号右侧的值赋值给左侧变量
+=

1
2
a += 5 相当于 a = a+5    
var str = "hello"; str += "world";

 

 

-=

1
a -= 5  相当于 a = a-5

 

 

*=

1
a *= 5 相当于 a = a*5

 

 

/=

1
a /= 5 相当于 a = a/5

 

 

%=

1
a %= 5 相当于 a = a%5

 

关系运算符

关系运算符用来比较两个值之间的大小关系的
>
>=
<
<=
关系运算符的规则和数学中一致,用来比较两个值之间的关系,
如果关系成立则返回true,关系不成立则返回false。
如果比较的两个值是非数值,会将其转换为Number然后再比较。
如果比较的两个值都是字符串,此时会比较字符串的Unicode编码,而不会转换为Number。

相等运算符

==

相等,判断左右两个值是否相等,如果相等返回true,如果不等返回false
相等会自动对两个值进行类型转换,如果对不同的类型进行比较,会将其转换为相同的类型然后再比较,转换后相等它也会返回true,null == undifined

!=
不等,判断左右两个值是否不等,如果不等则返回true,如果相等则返回false
不等也会做自动的类型转换。

===
全等,判断左右两个值是否全等,它和相等类似,只不过它不会进行自动的类型转换,
如果两个值的类型不同,则直接返回false

!==
不全等,和不等类似,但是它不会进行自动的类型转换,如果两个值的类型不同,它会直接返回true

特殊的值:
null和undefined
由于undefined衍生自null,所以null == undefined 会返回true。
但是 null === undefined 会返回false。
NaN
NaN不与任何值相等,报告它自身 NaN == NaN //false

判断一个值是否是NaN
使用isNaN()函数

三元运算符:

?:
语法:条件表达式?语句1:语句2;
执行流程:
先对条件表达式求值判断,
如果判断结果为true,则执行语句1,并返回执行结果
如果判断结果为false,则执行语句2,并返回执行结果

优先级:
和数学中一样,JS中的运算符也是具有优先级的,
比如 先乘除 后加减 先与 后或
具体的优先级可以参考优先级的表格,在表格中越靠上的优先级越高,
优先级越高的越优先计算,优先级相同的,从左往右计算。
优先级不需要记忆,如果越到拿不准的,使用()来改变优先级。

流程控制语句

程序都是自上向下的顺序执行的,
通过流程控制语句可以改变程序执行的顺序,或者反复的执行某一段的程序。

条件分支语句

条件判断语句也称为if语句
语法一:

1
2
3
if(条件表达式){  
语句...
}

 

1
2
3
4
执行流程:  
if语句执行时,会先对条件表达式进行求值判断,
如果值为true,则执行if后的语句
如果值为false,则不执行

 

语法二:

1
2
3
4
5
if(条件表达式){  
语句...
}else{
语句...
}

 

1
2
3
4
执行流程:  
if...else语句执行时,会对条件表达式进行求值判断,
如果值为true,则执行if后的语句
如果值为false,则执行else后的语句

 

语法三:

1
2
3
4
5
6
7
8
9
10
11
if(条件表达式){  
语句...
}else if(条件表达式){
语句...
}else if(条件表达式){
语句...
}else if(条件表达式){
语句...
}else{
语句...
}

 

1
2
3
4
5
执行流程  
if...else if...else语句执行时,会自上至下依次对条件表达式进行求值判断,
如果判断结果为true,则执行当前if后的语句,执行完成后语句结束。
如果判断结果为false,则继续向下判断,直到找到为true的为止。
如果所有的条件表达式都是false,则执行else后的语句

 

学识浅薄,如有错误,恳请斧正,在下不胜感激。

JS基础学习第二天

标签:分支   一段   基础上   也会   执行流程   表达式求值   div   container   定义   

原文地址:https://www.cnblogs.com/yin-jie/p/14603934.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!