[想试试看JavaScript ] 资料型态 数字 布林 undefined null

资料型态

number 数字

number 就是数字。跟字串需要引号不同,直接输入数字就可以了。

var number=4;
console.log(number); // 印出 4

既然是数字那麽我们可以做一些简单的加减乘除。
也可以将资料放进变数里在做加减乘除。

var n1=4;
var n2=3;
var n3=4-3; // 4-3 等於 1,1 会放进变数 n3里面
var n4=n1+n2; // 将资料放进 n1 n2 作加法,之後将结果放进 n4

console.log(n3); // 印出 1
console.log(n4); // 印出 7

var n5=n3+n4; // 当然我们可以继续将变数拿来做运算,并将结果放在新的变数里
console.log(n5) //印出 8

一开始学可能会觉得怪怪的,因为中文的阅读习惯是从左读到右边。
不过这边的范例会先做加减乘除,再将结果放进变数里。
电脑对程序码的处理顺序跟我们人类平常的阅读习惯不太一样。
有的时候对变数里的资料做很多次不同的计算,程序码运算的顺序会跟我们想的不一样。
所以建议还是写一个段落,就将变数里面的资料印出来看看。确定程序跑的顺序跟我们想的一样。

Javascript 在计算小数的话会有不能预期的结果
例如

var n1=0.1;
var n2=0.2;
var n3=n1+n2;

console.log(n3);  // 印出 0.30000000000000004

0.1+0.2 居然不是 0.3!?
而是0.30000000000000004
因为 Javascript 底层运算的逻辑是用「IEEE754」二进位浮点数算数标准。
虽然你输入 0.1与0.2,其实电脑会先将0.1与0.2先转成二进位数,可是二进位数没办法完美表现十进位,只能取近似值。
两个近似值相加就会产生误差。

那有很多方法可以解决,比较简单的方法,就是先将0.1与0.2个别乘以10,变成1和2再相加为3,最後再除以10,就会是0.3。

平常好像遇不到计算小数的例子,可能会觉得记这个有什麽帮助呢?
其实如果写个很简单的购物车或者记账,要照商品单价与数量来计算总价就会遇到了。
平常新台币不会需要用到小数,不过计算外国货币,像人民币或者美金很常就会用小数。

Boolean

跟数字比 boolean 就比较单纯,boolean 只有两种:true 以及 false
通常用在控制程序的流程或者是比较的时候也会出现。
控制程序流程,也就是说只要符合条件我们就做某事或者做运算,条件符合就会用true表示。
只要条件不符合就不执行程序,用false表示。

var result=4>3;  // 比较 4 有没有比 3 大
console.log(result); // 印出 true 代表 4 比 3 大

boolean 很常用,也很好用,之後再举例它的用法。

null 与 undefined

null 代表这个变数没有给值,也就是没有指定资料到变数,不过我可以指定一个 null 到变数里。
undefined 代表尚未给值,未定义
听起来很像,

var A=null; // 可以指定 null 到变数

那我会怎样使用 null 呢?
例如商品的价格,商品不用钱的话,我就会这样写,将0指定进去

var price=0;

不过有的时候商品的价格并不是0元,只是还没有决定商品要多少钱,我就会输入null来设定。

var price=null;

毕竟0也是一种价格,也具有意义。
所以一些情况必须先指定资料进去,可是还不确定应该要给什麽资料,我就会指定 null 进去。

undefined 代表未定义
例如

var data;
console.log(data); // 印出 undefined

代表我没有指定值进去
还有一种情况可能会跳出 undefined ,就是资料发生错误时

可能还是会很难理解什麽时候会遇到 null 什麽时候会遇到 undefined,毕竟两个都很像都是类似没有的概念。
其实不太能用逻辑去判断,而是随着做越来越多的小程序,要一个一个去记住这两个的使用场景,记住什麽时候会出现 undefined 什麽时候出现 null

有个思维我觉得不错。

学程序,先不要想为什麽,明白他的运作、结果,随者练习的增加再来问为什麽。

毕竟程序是人类做出来的工具,有的只是约定俗成的规定,大家只是遵照一样规定来撰写程序码来沟通而已。
只要放轻松记住这些规定,熟练使用就可以方便我们架构出复杂的功能。


<<:  DAY 3 新增 Git 来为版本进行管控

>>:  < 关於 React: 开始打地基| JSX >

21. React简易实作_购物车清单( 将下层State提升给上层元件 )

今天要解释的是: 如何将下层State提升给上层元件。 但如果没有举例真的太抽象了,所以就乾脆做个功...

【Day 12】- 这页爬完了,爬下一页。PTT 爬好爬满!(实战 PTT 爬虫 2/3)

前情提要 前一篇文章带大家写了能爬取 PTT 当前页面文章的爬虫,且透过携带已满 18 岁的 coo...

资安学习路上-picoCTF 解题(Web)3

10.Some Assembly Required 2 跟Some Assembly Require...

Day13【Web】网路攻击:DDoS 之 DNS 递回查询攻击

递回查询 Recursive Query 『递回查询』(Recursive Query)是指 当某个...

gMSA 设定无密码的工作排程 (上 )

Group Managed ServiceAccounts (gMSA) 用途 AD网域的环境下,要...