01 初识 JavaScript

作为在码农圈混迹了 四五年的老码畜来说,学习一门新的语言,就仿佛是老司机开新车一样 轻车熟路。

为什么会这么快呢?

因为各种套路啊~

任何一种计算机语言的最开始都是和 数据类型 这个东西分不开,那么今天,我们就从 JavaScript 的数据类型开始

一、JavaScript 的数据类型

   因为对于很多的 jser 的初学者而言,或者说说对于很多代码初学者而言,数据类型是让人疑惑的地方。那么一定要解除这个疑虑。

JavaScript 一共有 八种数据类型。其中包含了 基本数据类型 和 引用数据类型

其中基础数据类型有: string 、 number 、 Boolean 、 null、 undefined

其中 引用类型有: array 、 function 、 object

一共就这么8种数据类型,每一种类型都会有各自的属性或者方法,从而构建了这个丰富多彩的 JavaScript 世界。

那我们常常需要判断 这个参数的数据类型从而进行下一步的操作。 那么这个时候 typeOf 就是一个不错的选择,但是也有一些问题,咱们下面接着聊。
const strA = 'xxx==='
const numberB = 123
const boolC = false const nullD = null
const undedfinE = undefined const arrayF = [1,2,3]
const funcG = function() {
let a = '123'
console.log(a)
}
const objH = {
a: 1,
getName: function() {
console.log(this.a)
}
} const result = function(x) {
return typeof x
}
console.log(result(strA)) // string
console.log(result(numberB)) // number
console.log(result(boolC)) // boolean
console.log(result(nullD)) // object
console.log(result(undedfinE)) // undefined
console.log(result(arrayF)) // object
console.log(result(funcG)) // function
console.log(result(objH)) // object

二、 区分容易混淆的 数据类型

TIPS: 看完上面的八种 数据类型的 读取。是不是发现有三种数据还是让人有点迷糊,分别就是 null、array、Object 。 这三个数据类型的 typeof 都是 object。 那如何再次区分呢?

typeof null  		// object
typeof [123,133] // object
typeof {a:1} // object // 这个时候就无法判断了, 如何操作了? const testArray = [11,22,33,44]
const testNull = null
const testObj = {a:1} const testObjectFun = function(x) {
return Object.prototype.toString.call(x)
} console.log( testObjectFun(testArray)) // [object Array]
console.log( testObjectFun(testNull)) // [object Null]
console.log( testObjectFun(testObj)) // [object Object]

TIPS: 目前来看,Object.prototype.toString.call(xxx) 是一个很好判断当前对象为 什么的方法。

三、 判断 当前对象为 数组的方法


const arr = [1,2,3] // es6
Array.isArray(arr)
arr instanceof Array
arr.constructor === Array
// es5
Object.prototype.toString.call(arr) === '[object Array]'
在 ES5、6 中提供了一系列的 判断当前对象为 数组的方法. 可以作为一个炫技的存在了。

四、章节总结

在 JS 这门语言中,常见的数据类型在上文中已经作出了 展示,而且也展示了一些判断当前数据类型的方法,由于 JS 是一门弱类型语言,所谓弱类型语言其实是指 数据的类型可以根据上下文的变化 发生改变。 在下一个章节 我们会介绍下 数据类型的改变方法。

Github 地址,欢迎Star

《前端之路》之 初识 JavaScript的更多相关文章

  1. 《前端之路》之 Javascript 模块化管理的来世今生

    目录 第二章 - 04: Javascript 模块化管理的来世今生 一.什么是模块化开发 1-1.模块化第一阶段 1-2.封装到对象 1-3. 对象的优化 二.模块化管理的发展历程 2-1.Comm ...

  2. 《前端之路》之 JavaScript 进阶技巧之高阶函数(下)

    目录 第二章 - 03: 前端 进阶技巧之高阶函数 一.防篡改对象 1-1:Configurable 和 Writable 1-2:Enumerable 1-3:get .set 2-1:不可扩展对象 ...

  3. 《前端之路》之 JavaScript 高级技巧、高阶函数(一)

    目录 一.高级函数 1-1 安全的类型检测 1-2 作用域安全的构造函数 1-3 惰性载入函数 1-4 函数绑定 1-5 函数柯里化 1-6 反函数柯里化 一.高级函数 1-1 安全的类型检测 想到类 ...

  4. 《前端之路》之 JavaScript原型及原型链详解

    05:JS 原型链 在 JavaScript 的世界中,万物皆对象! 但是这各种各样的对象其实具体来划分的话就 2 种. 一种是 函数对象,剩下的就是 普通对象.其中 Function 和 Objec ...

  5. 《前端之路》之四 JavaScript 的闭包、作用域、作用域链

    04:JavaScript 的闭包 一.定义: 常规定义: 闭包的定义: 有权利访问外部函数作用域的函数. 通俗定义: 1.函数内部包含了函数.然后内部函数可以访问外部函数的作用域. 2.内部函数可以 ...

  6. 初识JavaScript(一)

    初识JavaScript(一) 最近由于工作的需要的原因,我从一个写后台的现在让我转到写前端,再加上我的js部分特别的差,所以我现在开始学习js部分的知识. 我的第一篇博文就这样开始写了.俗话说,千里 ...

  7. 《前端之路》之二:数据类型转换 && 隐式转换 || 显式转换

    目录 02:数据类型转换 && 隐式转换 || 显式转换 02:数据类型转换 && 隐式转换 || 显式转换 在上一个章节中,我们介绍了 JavaScript 的基本的 ...

  8. 《前端之路》- TypeScript(二) 函数篇

    目录 一.定义函数方法 二.定义函数传参 三.可选传参 四.默认传参 五.传递剩余参数 六.函数重载 七.箭头函数 八.总结 一.定义函数方法 在 es5 中定时函数的方法有 命名函数和函数表达式(匿 ...

  9. 《前端之路》- TypeScript (三) ES5 中实现继承、类以及原理

    目录 一.先讲讲 ES5 中构造函数(类)静态方法和多态 1-1 JS 中原型以及原型链 例子一 1-2 JS 中原型以及原型链中,我们常见的 constructor.prototype.**prot ...

随机推荐

  1. java 自定义的注解有什么作用

    转自https://zhidao.baidu.com/question/1668622526729638507.html 自定义注解,可以应用到反射中,比如自己写个小框架. 如实现实体类某些属性不自动 ...

  2. BZOJ_3524_[Poi2014]Couriers_主席树

    BZOJ_3524_[Poi2014]Couriers_主席树 题意:给一个长度为n的序列a.1≤a[i]≤n. m组询问,每次询问一个区间[l,r],是否存在一个数在[l,r]中出现的次数大于(r- ...

  3. struts2 上传与下载

    1.Struts.xml <action name="addfileAction" class="Action.addfileAction"> &l ...

  4. QTTabBar

    出处:https://www.mokeyjay.com/archives/1811

  5. 谈谈surging引擎的tcp、http、ws协议和如何容器化部署

    1.前言 分布式已经成为了当前最热门的话题,分布式框架也百花齐放,群雄逐鹿.从中心化服务治理框架,到去中心化分布式服务框架,再到分布式微服务引擎,这都是通过技术不断积累改进而形成的结果.esb,网关, ...

  6. python中字符串拆分与合并——split()、join()、strip()和replace()

    Python3 split()方法 描述split()通过指定分隔符对字符串进行切片,如果参数num 有指定值,则仅分隔 num 个子字符串 语法split()方法语法: str.split(str= ...

  7. 一个Java程序猿眼中的前后端分离以及Vue.js入门

    松哥的书里边,其实有涉及到 Vue,但是并没有详细说过,原因很简单,Vue 的资料都是中文的,把 Vue.js 官网的资料从头到尾浏览一遍该懂的基本就懂了,个人感觉这个是最好的 Vue.js 学习资料 ...

  8. 学习 JavaScript (八) 引用类型之 Object

    在JavaScript中,引用类型是一种数据结构.包括对象(Obejct).数组(Array).日期(Date).正则表达式(RegExp).函数(Function).基本包装类型(new Boole ...

  9. 解放程序员双手之Supervisor

      前言 对于大部分程序员来说,主要工作都是进行编码以及一些简单的中间件安装,这就导致了很多人对于“运维”相关的工作会比较生疏.例如当我们拥有一台自己的服务器以后,可能会在上面跑一跑自己blog程序, ...

  10. 深入理解Linux内核 学习笔记(4)

    第四章 中断和异常 中断通常被分为同步中断和异步中断,同步中断是当指令执行时由CPU控制单元产生的,之所以称为同步,是因为只有在一条指令终止执行后CPU才会发出中断异步中断是由其他硬件设备依照CPU时 ...