JavaScript基本概念
前言
原本我学习JavaScript是从B站开始学习的基本概念,主要用来快速上手,但在后期发现学的网课是用于快速上手,而理论知识和理解并没有扎实稳固。因此我查看知乎购买了红宝书(全称为《JavaScript高级程序设计(第三版)》)来完善我的理论知识,而接下来我写的博客也主要是根据红宝书学习并总结的知识点,如有不足之处欢迎评论。
标识符
标识符指变量、函数、属性的名字,或者函数的参数。命名时遵循以下2点:
- 第一个字符必须是字母、下划线(_)或一个美元符号($),其他字符可以是字母、下划线、美元符号或数字。
- 标识符区分大小写,命名通常采用驼峰法。
注: 由于ECMAScrip变量是松散类型(即可用来保存任何类型数据),即便相同变量名存储的数据类型不同,前者也会被覆盖。
var eg = "string";
eg = 100; //有效,但不推荐
数据类型
ECMAScript有五种基本数据类型(也称为简单数据类型)和一种复杂数据类型。
基本数据类型: Undefined、Null、Number、String、Boolean
复杂数据类型: Object
所有值最终都是上述六种数据类型之一。
数据类型检测方法
数据类型检测方法有两种:typeof操作符和instanceof操作符
typeof操作符返回结果:undefined、number、string、boolean、object、function
typeof操作符主要用于检测基本类型数据
var s = "Hello";
var i = 10;
var b = true;
var o = new Object();
var f = new Function();
var n = null;
var u;
alert(typeof s); //"string"
alert(typeof i); //"number"
alert(typeof b); //"boolean"
alert(typeof o); //"object"
alert(typeof f); //"function"
alert(typeof n); //"object"
alert(typeof u); //undefined
注:从逻辑角度来讲,null表示一个空对象指针,因此typeof null返回object。
instanceof操作符返回结果:true、false
instanceof操作符用于检测引用类型数据
var person = new Object();
var pens = new Array();
var pattern = new Function();
alert(person instanceof Object); //true
alert(pens instanceof Array); //true
alert(pattern instanceof RegExp); //false
基本数据类型和引用数据类型的区别
为了便于记忆,我将区别做成了一个表格,能够直观地看出其区别。
基本数据类型 | 引用数据类型 | |
---|---|---|
访问类型 | 按值访问 | 按引用访问 |
能否操作变量实际值/内存 | 可以 | 不允许 |
能否添、改、删属性和方法 | 不能,不报错但无效 | 可以 |
复制变量值,原变量是否不受影响 | 是,两者保持相互独立,互不影响 | 不是,新变量复制指针,改变其一则一起改变 |
检测方法 | typeof操作符 | instanceof操作符 |
访问类型是依照第二行判断的。
按值访问:可以操作保存在变量中的实际值
按引用访问: 保存在内存中的对象,由于JavaScript不允许直接访问内存中的位置即不能直接操作对象的内存空间,因此操作对象实际是操作对象的引用。
关于基本数据类型一些“故事”
Null和Undefined
Undefined —— 在使用var声明变量但未对其加以初始化时,其值就是undefined,也可手动赋值为undefined
var eg;
//var hi 该变量没有声明
alert(typeof eg); //undefined
alert(typeof hi); //undefined
alert(eg); //undefined
alert(hi); //产生错误
null —— 仅能手动初始化变量为null值
alert(null == undefined); //true
alert(null === undefined); //false
产生这样的原因是相等操作符(==)会转换操作数类型,而全等操作符(===)不会转换操作数类型。而null和undefined是类似的值,它们实际上是不同类型的值。
Number类型不得不说的“故事”
数值范围表示
含义 | 用法 | 实际值 (大多数浏览器) |
---|---|---|
最小数值 | Number.MIN_VALUE | 5e-324 |
最大数值 | Number.MAX_VALUE | 1.7976931348623157e+308 |
正无穷 | Number.NEGATIVE_INFINITY | Infinity |
负无穷 | Number.POSITIVE_INFINITY | -Infinity |
检测范围方法: isFinite() ——— 确定数值是否在最大最小值之间
var value = Number.MAX_VALUE + Number.MIN_VALUE;
alert(isFinite(value)); //true
特殊成员NaN
NaN —— 非数值,是一个特殊的数值。用于表示本应返回数值的操作数未返回数值。
NaN有以下两个特点:
- 任何涉及NaN的操作(如NaN + 1)都会返回NaN
- NaN和任何值都不相等,包括其本身
判断方法:isNaN() —— 判断参数是否不是数值,会尝试是否能转换为数值
alert(isNaN(10)); //false
alert(isNaN("10")); //false
alert(isNaN("hi")); //true
alert(isNaN(NaN)); //true
数值转换
非数值转数值函数 | 空字符串"" | 八进制字符串(例:070) | 十六进制字符串(例:0xA) | 可用类型 |
---|---|---|---|---|
Number() 转成数值 | 返回0 | 转为十进制数字(例:56) | 转为十进制数字(例:10) | 任何数据类型 |
parseInt() 转成整数型数值 | 返回NaN | 转为十进制数字(例:56) | 转为十进制数字(例:10) | 字符串转数字与处理数字 |
parseFloat() 转成浮点数 | 返回NaN | 忽略前导0,直接为十进制数字(例:70) | 返回0 | 字符串转数字与处理数字 |
基本包装类型
在看基本数据类型时,我曾疑惑过既然基本数据类型是一个实际值,那么关于基本数据类型的操作方法是怎么来的呢?从逻辑上来讲,基本数据类型不应该有方法。当我阅读到“基本包装类型”这小结内容时,这个疑惑得到了 回答。
为了便于操作基本数据类型,ECMAScript提供了3个特殊的引用类型(称为基本包装类型):Boolean、String、Number
而每当读取一个基本类型值时,后台就会创建一个对应的基本包装类型对象,从而能够调用一些方法操作这些数据。
而基本包装类型和引用类型有很明显的区别,具体区别如下表格:
创建方法 | 对象生存期 | |
---|---|---|
引用类型 | 使用new操作符创建 | 执行流离开当前作用域之前 一直保存在内存中 |
基本包装类型 | 自动创建 | 只存在于一行代码执行的瞬间,然后被立即销毁 |
由于基本包装类型的生存期只在代码执行一瞬间,因此在运行时不能为基本数据类型添加属性和方法。这也是之前讲的基本数据类型特征之一。例子如下:
var eg = "hello";
eg.name = "huahua";
alert(eg.name); //undefined
那看到以上区别,另一个问题来了:基本包装类型是否只能自动创建?并不是的,可以显式调用Boolean、Number和String来创建基本包装类型。但应在绝对必要的情况下这样做,一般情况不推荐。原因是基本包装类型的实例为引用类型,而非基本数据类型。来看实际代码,能更明显的感受。
var value = "25";
var num = Number(value); //转型函数
alert(typeof value); //"string"
alert(typeof num); //"number"
var obj = new Number(value); //构造函数
alert(typeof obj); //"object"
alert(obj instanceof Number); //true
由上述代码也可以看出,使用new调用的基本包装类型的构造函数与直接调用同名的转型函数是不一样的。