前言

写着 TypeScript 学习笔记, 顺便也写点 JS 的呗.

参考

JS数据类型分类和判断

阮一峰 – 数据类型

JS 数据类型

string

number

boolan

undefined

null

object

symbol (es6)

bigint (es2020)

其中 symbol 和 bigint 是后来加进去的

另外还有一些很常见但其实它们不能说是类型. array, function, class, arrow function, NaN, Regex, Date

typeof

typeof 是用来判断类型的.

console.log('string', typeof 'string');
console.log('number', typeof 1);
console.log('boolean', typeof true);
console.log('undefined', typeof undefined);
console.log('null', typeof null);
console.log('object', typeof {});
console.log('symbol', typeof Symbol('v'));
console.log('bigint', typeof (100n));

结果

只有一个奇葩, null = object. 这个是历史原因.

另一组

console.log('array', typeof []);
console.log('function', typeof function() {});
console.log('arrow function', typeof (() => {}));
console.log('date', typeof new Date());
console.log('reg', typeof /\d/gi);
console.log('NaN', typeof NaN);
console.log('class', typeof class{});

结果

我们先讲好理解的, function, arraw function 都是 function, JS 的 class 只是语法糖其实也是 function, 所有它们三都是 function, 没问题.

reg, date 都是 new 出来的对象, 没问题

最后只剩下 array = object, NaN (not a number) = number 比较乱水了. (背起来呗)

类型判断方式

除了用 typeof 还有一些常用的技巧

判断 null

null === null

判断 NaN

isNaN(NaN)

判断 Array

Array.isArray([])

判断 Date, Regex

(new Date()) instanceof Date

黑魔法 typeof

console.log('string', Object.prototype.toString.call('string').slice(8, -1).toLowerCase());

效果

类型转换

参考: 阮一峰 – 数据类型转换

所有类型都可以被强制转换成 boolean, string, number

转 boolean

Boolean(variable) 或者 !!variable 2 种写法都可以把 variable 强制转换成 boolean

它的规则是除以下 5 个值转成 false, 其余都转成 true

转 number

Number(variable) 或者 +(variable) 2 种写法都可以把 variable 强制转换成 number

'324' = 324
'' = 0
true = 1
false = 0
'324abc' = NaN
undefined = NaN
null = 0

几个记忆点

1. boolean true = 1, false = 0 (好记)

2. empty string = 0 (可以记)

3. full number string = number 和 partial number string = NaN (这个和 parseInt, parseFloat 有时会搞乱, parse 会自动过滤掉不是 number 的 string, 比如 parseInt('100px') = 100, Number('100px') = NaN) (可以记, 但要记得和 parse 不同)

4. undefined = NaN, null = 0 (不好记...为什么这 2 个不同...乱水)

当强转对象

三个步骤

valueOf > toString > Number(variable)

概念是先把对象转成普通类型

首先是调用 valueOf, 如果返回的依然是对象就再调用 toString, 如果依然是对象就报错

只要 valueOf 或 toString 返回的不是对象, 那么就 Number(variable)

转 string

转换规则是

123 = '123' (好记)

true = 'true' (好记)

undefined = 'undefned'  (好记)

null = 'null'  (好记)

当强转对象

toString > valueOf  > String(variable)

概念和 Number 一样, 只是顺序不同, 它先调用 toString 如果依然返回对象就调用 valueOf

自动类型转换

if (variable) 会把 variable 强行转成 boolean

!!(variable) 会把 varable 强行转成 boolean

+(variable) 会把 varable 强行转成 number

string + variable 会把 varable 强行转成 string e.g. '123' + 3 = '1233'

variable -*/ variable 会把 variable 变成 number e.g. '123' - '3' = 120

variable == variable 双等号在对比时, 也会自动类型转换.

双等号 ==

参考: JavaScript中双等号(==)的比较机制

这个规则挺多的, 真实开发中已经被禁用了. 其实没有必要学.

首先是

1. null 和 undefned 是相等的

2. null 和 undefined 不可以被转换类型

3. NaN 和谁都不相等, 包括 NaN... 所以 NaN == NaN 是 false, NaN != NaN 是 true

4. string == string, number == number, bool == bool, object == object 这些都不会有自动转换

5. 类型不同的情况下, 比如 string == number, bool == string, object == number, 先把他们转成 Number(string) == Number(boolean). Number 是老大就对了.

我日常会用的类型转换

+(new Date()) 把日期转成 number, 表示 1970 到日期的 milliseconds

true = 1 和 false = 0 (number 和 boolean 间的转换)

if(object|array) 判断空 null or undefined (我只会判断 object 和 array, string, number 我不会这样做)

'abc' + 123 把 number 拼接到 string 里.

其它的我都不会去记也不会去用.

JavaScript – 数据类型的更多相关文章

  1. Javascript:Javascript数据类型详解

    要成为一个优秀的前端工程师,系统的学习Javascript,有夯实的Javascript基础,以及对语言本身的深刻的理解,是基本功.从Javascript数据类型开始,我将对Javascript知识体 ...

  2. JavaScript数据类型 typeof, null, 和 undefined

    JavaScript 数据类型 在 JavaScript 中有 5 种不同的数据类型: string number boolean object function 3 种对象类型: Object Da ...

  3. 网页、JavaScript 数据类型

    JavaScript 数据类型 一.基本数据类型: 字符串.数字.布尔.日期和时间 JavaScript 拥有动态类型 JavaScript 拥有动态类型.这意味着相同的变量可用作不同的类型: 1 v ...

  4. javascript数据类型、初始化

    Javascript数据类型有6种: 数值型数据类型(Number): 字符串(String): 布尔型数据(Boolean): 对象数据(Object): 空(Null): 未定义(Undefine ...

  5. 第九十九节,JavaScript数据类型

    JavaScript数据类型 学习要点: 1.typeof操作符 2.Undefined类型 3.Null类型 4.Boolean类型 5.Number类型 6.String类型 7.Object类型 ...

  6. Javascript数据类型共有六种

    Javascript数据类型共有六种 /* var box; alert(typeof box); // box是Undefined类型,值是undefined,类型返回的字符串是undefined ...

  7. JavaScript复习之--javascript数据类型隐式转换

    JavaScript数据类型隐式转换.一,函数类    isNaN()    该函数会对参数进行隐式的Number()转换,如果转换不成功则返回true.    alert()    输出的内容隐式的 ...

  8. 数据的分类-JavaScript数据类型

    JavaScript数据类型 1.数据类型是什么? 我们接触的绝大多数程序语言来说,把数据都进行了分类,包括数字.字符.逻辑真假:int,long,string,boolean....等等:我们都知道 ...

  9. js基础--javaScript数据类型你都弄明白了吗?绝对干货

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 数据类型的分类 JavaScript的数据类型分为两大类,基本数据类型和复杂数据类型. 基本数据类型:Null.Undefine ...

  10. 每天五分钟-javascript数据类型

    javascript数据类型分为基本数据类型与复杂数据类型 基本数据类型包括:string,number,boolean,null,undefined,symbol(es6) 复杂数据类型包括:obj ...

随机推荐

  1. vue3+elementplus 去除小数点后多余的0公用函数

    vue3+elementplus 去除小数点后多余的0公用函数 export function removeTrailingZeros(value) { // 尝试将值转换为数字 const nume ...

  2. [oeasy]python0072_自定义小动物变色_cowsay_color_boxes_asciiart

    修改颜色 回忆上次内容 上次搞的是 颜色 前景颜色 总共有 7 种基本色 还有什么 好玩的 么? 可以 给小动物 上色 吗? 配合 先将cowsay结果 输出重定向 sudo apt install ...

  3. NSSCTF———Web(sql注入)

    [LitCTF 2023]这是什么?SQL !注一下 ! [SWPUCTF 2022 新生赛]ez_sql [GXYCTF 2019]BabySqli 点击右下角文章可跳转 [LitCTF 2023] ...

  4. C# 推荐一种开机自启动的方式

    概述(Overview) 网上多数搜索结果以注册表设置为优先,这个方法需要管理员权限,实际工作中可能并不适用.这个方法是直接写到用户开机自启动目录里,系统开机会带着一起启动.(Most search ...

  5. [rCore学习笔记 020]第二章作业

    写在前面 本随笔是非常菜的菜鸡写的.如有问题请及时提出. 可以联系:1160712160@qq.com GitHhub:https://github.com/WindDevil (目前啥也没有 编程题 ...

  6. java 使用openoffice将doc、docx、ppt、pptx等转换pdf格式文件

    软件的安装与配置 链接: 官网 / C**N / 毒盘:提取码k47b 有能力的大佬可以选择c**n下载支持支持,官网下载可能有点慢 Windows下安装配置 下载安装包,安装到硬盘(这个就不截图了吧 ...

  7. 【Windows】开放共享目录

    在项目里面做数据迁移时发现,WindowsServer的多个主机可以进行磁盘共享访问 但是自己设置是灰白无法点击的 文件目录共享还是可以进行设置的 1.找到自己需要共享的目录,右键选择[属性],并找到 ...

  8. 【Hibernate】Re01.6 HQL

    一.支持的查询方式 Hibernate的查询支持三种方式: 1.HQL查询 2.Criteria查询 3.NativeSQL 原生SQL查询 二.HQL查询语言 全称 Hibernate Query ...

  9. 【Docker】03 基础操作

    [Docker 本体操作相关] 检查Docker版本: docker -v 检查Docker当前状态: systemctl status docker 停止Docker与开启Docker system ...

  10. 暑假自学Java进度总结04

    一.今日所学: 1.下载并使用idea开发工具 1>了解idea的发展历史 2>尝试用idea编写代码 3>学习idea中的项目和模块操作 2.学习赋值运算符 加后赋值:" ...