阅读 236

JavaScript修炼之路 --- 练气段、js的相关语法

JavaScript 基础介绍 --- 了解js大陆


书接上文,上文讲到变量的命名规范等等,下面接着变量来扩充一下

数据类型之间的转换
注:
补充上文漏掉的一个函数:typeof();可以用来获取变量的数据类型

  • 数据类型之间是可以相互转换的

    • 这里涉及到两种转换类型:显式(强制)转换、隐式转换

  • 转换成字符串:

    • 变量名.toString(); --- 显式(强制)转换

    • String(变量名); --- 显式(强制)转换

    • 加号 + 拼接字符串 --- 隐式转换(使用情况详见后文)

  • 转换成数字型:

    • Number(变量名); --- 显式(强制)转换

    • 算数运算符(- * / %)运算转换 --- 隐式转换(使用情况详见后文)

  • 转换成布尔值:

    • 这个情况目前较少,后续常见于if、switch等条件判断语句中,后续讲if判断时再续杯

此处的重点是字符串和数字类型的隐式转换,尤其是 + 号的拼接,使用的颇为频繁

分类讨论几种数据类型之间的转换以及特殊值的转换情况:

  • 字符串转数字(结论先行):

    • 转换为NaN的有两种:字符串(非纯数字(例如'12')的字符串)为非数字、undefined类型

    • 转换为0的有三种:''、' '(空格字符串)、null

    • 分析:
      字符串为纯数字时,可以直接转换为数字
      字符串包含有非数字时,会得到NaN(not a number 即非数字的意思)
      ''/' '(空字符串与空格字符串) 均会解析会0
      ' 1'(1前面有空格) 会解析为1
      null(空对象基本也等同于空值)会转化为0
      undefined(即不明确的数据类型)会转化为NaN

    • 此处重点注意:NaN是number类型的一种!!!

  • 数字转化为布尔值时,只有0或者是NaN为false,其余数字包括负数均为true-综上所述,其余转换为布尔值时,其逻辑是,判断内容是否为空或者是否为NaN,若为空或者为NaN将会得到false,若盒子中盛有内容(此处有个很简单的例子能解释清楚这里的逻辑就是:'   '空格字符串转换为布尔值是true!!!原因就是空格实际是占有内存的!而''空字符串转换为布尔值就是false,因为空字符串实际是没有内容占用内存空间的!

    • 此处这一句话每个地方都是重点!!!

    • 只有0或者是NaN为false:也就是说上文讲到的其他数据类型转换成数字类型能得到0或者NaN的五种情况再转换为布尔值时,将会得到false

    • 转换为布尔值得到false得有五种情况:0、NaN、''、null、undefined

    • 其余数字包括负数均为true:这个地方有一个误区,我们包括一些有编程基础的同学一般都会认为负数应该是false,但是实际上在js中并非如此

扩展知识点:

图片.png
这里想介绍一点关于数据存储的内容:

  • 数据存储单位...

    • 位(bit):1bit可以保存一个0或者一个1(是最小的存储单位)

    • 字节(Byte):1B=8b

    • 千字节(KB):1KB=1024B

    • 兆字节(MB):1MB=1024KB

    • 吉字节(GB):1GB=1024MB

    • 太字节(TB):1TB=1024GB

我们经常使用电脑的都知道,一般文件都会有一个大小,在传输时,常见的有KB、MB、GB等等
但是作为一个合格的编程人员,了解电脑其实际的一些存储单位及原理我认为还是很有必要的。
我们知道,电脑是机器,它的一切活动都是通过0和1进行的,上文讲到的布尔值其实也就是电脑的0,1的一种体现。而存储一个0 或者一个1 的内存大小,就是电脑的最小存储单位即bit,像我们在电脑上进行打字,英文、中文等等,都是通过一种人为方法将其转换成二进制使电脑能够识别(例如ASCII码值就是很好的体现,每一种符号对应一个编号,电脑只需要根据编号的数字大小讲编号转换成二进制即可实现与字符的联系),能够装一个这样的字符的存储单位我们称为字节Byte,一个字节等同于8位bit也就是一个8位二进制的数值。

算数运算符

  • 算数运算符有5个,过程中只有数字参与(这个规则也就是数字隐式转换的来由)

    • +:加运算(字符串通过+号拼接并不能称为算数运算,只能理解为是 + 的一种功能体现)

    • -:减运算

    • *:乘运算

    • /:除运算

    • %:模(取余)运算(即得到的是余数)

注意:区分+号的两种不同的使用方法!这里经常会出现一些问题,栗子如下:

  var a = 1;
  var b = 2;
  var c = '3';
  console.log(a + b + c);
  //输出结果为:33(a + b 先进行了数值运算,再与c进行字符串的拼接)
  console.log(c + b + a);
  //输出结果为:321(c + b + a c先和b拼接成了'32',再和a拼接成了'321')复制代码

Ps:这里还有一个重点需要提前说明:就是任何变量在赋值的时候就已经确定了,除非再次通过赋值进行改变其变量类型,否则其经过任何运算或者隐式转换,只会改变其在当前运算过程中的类型,并不会改变变量本身的数据类型!!!!!

JS的三种输出语句

  • alert(单个参数): 在页面上输出一个弹窗

  • console.log(可以输出多个参数): 在控制台输出

  • document.write(可以输出多个参数): 在页面(文档)上输出

逻辑判断运算符

逻辑运算符是用来进行布尔值运算的运算符,其返回值也是布尔值。后面开发经常用于多个条件的判断

  &&	与 
  ||	或
  !	非复制代码

逻辑运算符中的重点:

短路运算(逻辑中断) 原理:当有多个表达式(值)时,左边的表达式值可以确定结果时,就不再继续运算右边的表达式的值

  	1.逻辑与:
  		表达式1 && 表达式2

  		如果第一个表达式的值为真,则返回表达式2

  		如果第一个表达式的值为假,则返回表达式1

          说人话:逻辑与 --- 遇假则假

  	2.逻辑或:
  		表达式1 || 表达式2

  		如果第一个表达式的值为真,则返回表达式1

  		如果第一个表达式的值为假,则返回表达式2

          说人话:逻辑或 --- 遇真则真复制代码

短路运算的作用:为了提高系统运算的速度。

比较运算符:

  < 小于
  > 大于
  <= 小于等于
  >= 大于等于
  == 等于(默认会转换数据类型为数字型)
  != 不等于
  === !== 全等(要求值和数据类型都一致)复制代码

总结:

  =	赋值 把右边的值给左边
  ==	判断 判断两边值是否相等(注意此时有隐式转换)
  ===	全等 判断两边的值和数据类型是否完全相同复制代码

李氏口诀秘籍:单等赋值,双等判断,三等全等

递增和递减运算符

  ++
  --
  递增递减运算符可以放在变量前面也可以放在变量后面
  
  前置递增运算符: ++写在变量的前面
  	++age //类似于age=age+1

  	先加一后返回值

  后置递增运算符
  	num++ //类似于age=age+1

  区别:
  	1.前置递增运算符和后置递增运算符如果单独使用 效果是一样的
  	
  	2.与其他代码结合使用时,执行结果会不同

  	3.后置自增 口诀:先返回原值,后自增加1

  	4.开发时,我们大部分使用的是后置递增运算符复制代码

赋值运算符

  =
  +=、-=
  *=、/=、%=复制代码

运算符的优先级

注意:这里只列举了部分运算符

  1	小括号	()
  2	一元运算符	++、--、!
  3	算数运算符	先* / % 后加减
  4	关系运算符	> >= < <=
  5	相等运算符	== != === !==
  6	逻辑运算符	先&& 后 ||
  7	赋值运算符	=
  8	逗号运算符	,复制代码

李氏口诀秘籍: 括一算运关系符, 相等逻辑赋逗号。

留一个悬念问题:上文讲到有一目运算符 后置自增运算为先调用值再自增,后述运算符中又提到有运算符的优先级的问题(++运算符优先级高于赋值运算符),那么请问:
var i = 10,j; j = i++ ;console(j)为何输出的结果是10而不是11,这个结果不是与运算符的优先级顺序相违背吗?

答案下周二或者下周三附在Blog中,敬请关注!


作者:coding_ke
链接:https://juejin.cn/post/7040736240022323213


文章分类
代码人生
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐