# Variable 变量
相信任意一门编程语言的入门都会是变量。这个来源于数学的概念,使得计算机有了无限的可能。
一句话:变量是用于存储信息的"容器"。
也就是说,变量里面装的东西不是固定的,是可变的,可以被赋值的。
# JavaScript的标识符
# 1、什么是标识符?
变量、函数、属性的名字,或者函数的参数。
# 2、标识符的命名规则:
(1)、由字母、数字、下划线(_ )或美元符号( $ )组成
(2)、不能以数字开头
(3)、不能使用关键字、保留字等作为标识符
# 变量命名规范
1.只允许使用 数字、字母、下划线、$ (不能使用数字开头)
2.严格区分大小写
3.不要重复定义/声明
4.关键词/保留词 不能用来做变量名
5.语义化驼峰命名
6.见名知意
- 关键字 => js已经赋予特殊功能的单词
- 保留字 => js预订可能未来要使用的字
//以下都是合法的变量名
let a;
let A;
let b333;
let _abc;
let $;
let $o0_0o$;
let 中文名; // 中文作变量名也是允许的,尽管不建议这样做。
let ________;
let _;
// 以下都是非法的变量名
let 123a;
let 12_a;
let abc@163;
let abc¥;
let let;
let class;
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
注意:
关键字,保留字不用可以的去记忆, 在未来学习的过程中会接触到一大部分关键字保留字,
# 定义变量的多个写法
使用 var
ES5
、letES6
关键字定义变量ES6标准实施后,更建议使用 let 定义变量,降低变量污染的风险,在块作用域中使用let来代替var,这样不会污染块作用域的外部作用域,使代码更安全。详细可以查看
var-let-const
的笔记。
# 1. 定义时赋值(常用)
赋值运算符,通过等号来赋值。
let x = 10; //变量可以理解为一个容器,用来存储一个值。
//上面先声明变量a,然后在变量a与数值10之间建立引用关系,称为将数值1"赋值"给变量a
let y = 20; //JavaScript 的变量名区分大小写,x和X是两个不同的变量。
2
3
# 2. 先定义后赋值
let x;
x = 10;
2
# 3. 同时定义多个变量,用逗号隔开
let x, y;
x = 10;
y = 20;
//等价于
let x = 10,
y = 20;
2
3
4
5
6
7
如果一个变量没有声明就直接使用,JavaScript 会报错,告诉你变量未定义。
console.log(x); // ReferenceError: x is not defined
# 4.定义常量
//const 定义的变量称之为常量,是不允许重新赋值的.
//开发约定俗成 常量名字全大写
const ABC = 3.1315927;
2
3
# 语句
JavaScript 程序的执行单位为行,一行一行地执行,一般情况,一行就是一个语句。
语句是为了完成某种任务而进行的操作。
语句和表达式的区别
语句主要为了进行某种操作,一般情况下不需要返回值
表达式则是为了得到返回值,一定会返回一个值。 JavaScript 语言中预期为值的地方,都可以使用表达式。
将同类型的数据(如常量、变量、函数等) , 用运算符号按一定的规则连接起来的、有意义的式子称为表达式
比如,赋值语句的等号右边,预期是一个值,因此可以放置各种表达式。
JavaScript 是一种动态类型语言,也就是说,变量的类型没有限制,变量可以随时更改类型。
let a = 100;
a = "一百";
//上面代码中,变量a先被赋值为一个数值,又被重新赋值为一个字符串
2
3
# 数据类型
在一门语言里,会存在各种各样的值。
各种各种的数据都是用来解决不同的应用场景的需求。
基本数据类型:
number 数值
string 字符串
boolean 布尔值
undefined 未定义
null 空指针
复杂/引用数据类型:
Object 对象
Array 数组
Function 函数
RegExp 正则
Date 日期
ES6新增
symbol 表示独一无二的值。
bigint 大整数
# 基本数据类型
关于基本数据类型和引用数据类型的区别会在后面的笔记里介绍。
# number
# 整数
JavaScript中,数字的整数字面量可以有三种进制:
10进制: 普通的数字就是十进制
8进制:如果以0、0o、0O开头数字字面量是八进制,八进制只包括数字0~7
16进制:如果以0x,0X开头数字字面量是十六进制。十六进制整数可以包含(0-9)和字母 a-f 或 A-F
// 十六进制:
console.log(0xff);
2
# 浮点数
JavaScript 内部,所有数字都是以64位浮点数形式储存小数或指数
计算机世界中,小数称为“浮点数”
指数就是:允许使用e来表示乘以10的几次幂
注意:
只有十进制有小数的字面量,八进制、十六进制没有小数的字面量。所以小数没有进制之分
由于浮点数不是精确的值,所以涉及小数的比较和运算要特别小心
console.log(0.1+0.2);
//0.30000000000000004
2
# string
基本介绍
字符串是由0或是多个字符组成的字符序列,即字符串;
字符串可以用双引号(“”)或是单引号(‘’)或模板字符串(``)包裹起来,
如果一个数字,用引号引起来,那么就是字符串了。
console.log("2333");
正常情况
引号内部可以有不同种的引号,比如双引号里面可以有单引号:
// 双引号中夹杂单引号
console.log("abc'd'efg");
2
**如果要在该引号表示的字符串里使用同种引号,添加转义符号\
let doubleQuote = "这是两个双引号\"\"";
//使用\将特殊符号进行转义,又或者将普通的符号转义为特殊意义的符号
2
# boolean
布尔(逻辑)只能有两个值:true 或 false。
let a = true; // true
let b = 20 > 30; //false
2
JS会在需要布尔值的时候自动将变量转化为布尔值。
除了下面六个值被转为false
,其他值都视为true
。
undefined
null
false
0
NaN
""或''或 ``(空字符串)
2
3
4
5
6
console.log(Boolean(" ") ); //true 空格字符串转化为布尔值true
console.log(Boolean({}) ); //true
2
布尔值往往用于程序流程的控制
if(true) {
代码块
}
// if函数中,括号里为逻辑表达式,如果为true则执行里面的代码块,false则不执行跳过
2
3
4
# Infinity
Infinity
表示“无穷”,用来表示两种场景一种是一个正的数值太大,或一个负的数值太小无法表示
另一种是非0数值除以0,得到
Infinity
。
Infinity
大于一切数值(除了NaN
),-Infinity
小于一切数值(除了NaN
)。
console.log(Infinity > 88888); // true
console.log(-Infinity < 88888); //true
//Infinity与NaN比较,总是返回false。
2
3
# NaN
NaN
是 JavaScript 的特殊值,英语全名叫做not a number,表示“非数字“主要出现在将字符串解析成数字出错的场合。
NaN
不等于任何值,包括它本身。
console.log(1 - 'abc'); // NaN
console.log(0/0);// NaN
//注意的是,NaN不是独立的数据类型,而是一个特殊数值,它的数据类型依然属于Number
2
3
# isNaN()
isNaN
方法可以用来判断一个值是否为NaN
。但isNaN()也不好用,
它的机理是:只要该变量传入Number()的执行结果是NaN,则isNaN()函数都会得到true
isNaN(NaN) //true
isNaN(5) //true
isNaN(undefined);//true
isNaN('3天');//true
isNaN(null);//false
2
3
4
5
console.log(isNaN(NaN)); // true
console.log(isNaN(123)); // false
2
isNaN
只对数值有效,如果传入其他值,会先被先转成数值。
比如,传入字符串的时候,字符串会被先转成NaN
,所以最后返回true
console.log(isNaN('Hello')); // true
对于空数组和只有一个数值成员的数组,isNaN
返回false
。
console.log(isNaN([]));// false
console.log(isNaN([123]));// false
console.log(isNaN(['123'])); // false
2
3
上面代码之所以返回false
,原因是这些数组能被Number
函数转成数值
# isFinite()
isFinite
方法返回一个布尔值,表示某个值是否为正常的数值。如果 number 是 NaN(非数字),或者是正、负无穷大的数,则返回 false。
console.log(isFinite(Infinity)); // false
console.log(isFinite(-Infinity)); // false
console.log(isFinite(NaN)); // false
console.log(isFinite(undefined)); // false
//除了Infinity、-Infinity、NaN和undefined这几个值会返回false
//isFinite对于其他的数值都会返回true。
console.log(isFinite(null)); // true
console.log(isFinite(666)); // true
2
3
4
5
6
7
8
9
10
# Undefined
undefined 表示这个值未被定义
undefined 出现的场景:
(1)变量被声明了,但没有赋值时,就等于undefined。
下面3条先不讲
(2) 调用函数时,应该提供的参数没有提供,该参数等于undefined。
(3)对象没有赋值的属性,该属性的值为undefined。
(4)函数没有返回值时,默认返回undefined。
let a;//未定义
console.log(address);//表示这个变量未被赋值
//提前定义变量,不清楚数据类型,后续赋值。
2
3
4
5
# Null
null 表示空,与undefined不同的是,
null它表示一个空对象指针,undefined则表示未定义
let p = null;
//提前定义变量,指向一个空的内存地址,知道这个变量即将存储对象数据。
//当我们需要将对象销毁、数组销毁或者删除事件监听时,通常将它们设置为null。
box.onclick = null;
2
3
4
5
如果一个需要保存对象的变量没有真正保存对象,就应该明确的让该变量保存 null 值,这样做不仅可以体现 null 作为空对象指针的惯例,而且有助于进一步区分 null 和 undefined
说明:
undefined值是派生自null值的,所以undefined == null的返回结果是true
# 引用数据类型
最为常见的引用数据类型有以下几种:
- 狭义的对象(Object)
- 数组(Array)
- 函数(Function)
# Array 数组
数组(array)是一个占据一片连续存储空间的变量,有一连串的元素。每个元素都含有一个下标值,整个数组用方括号表示。
数组的作用是用来存储一组数据,里面每个元素可以是任意类型。既可以是字面量,也可以是基本类型变量,还可以是引用类型变量。
// 还可以嵌套数组,
let arr = [ "铁人", function(){alert(1)}, 200, true, [1, null], {}]
2
取值
console.log( "下标1的数据:" , a[1] );
console.log("数组的长度", a.length ); // 数组长度
2
重新赋值
a[0] = 100;//给某一项重新赋值
console.log(a);
2
3
人为设置length
当前数组长度,多出则会用undefined占位,少了则会将多余的数据剔除。
var arr = [1,2,3];
arr[10] = 100; // arr[3]到arr[9] 的值为 empty (留了空位) 读取新增的位置都会返回undefined。
console.log(arr[4])//undefined
2
3
var arr = [ 'a', 'b', 'c' ];
arr.length // 3
2
清空数组的一个有效方法,就是将length
属性设为0。
arr.length = 0;
console.log(arr)//[]
2
# 数组的嵌套取值
如果数组的元素还是数组,就形成了多维数组
// 二维数组 ---> 数组里面嵌套数组
let a = [
"绿巨人",
"钢铁侠",
[
"超人",
"蝙蝠侠",
"小丑",
],
];
console.log(a[2][0]); // 超人
2
3
4
5
6
7
8
9
10
11
12
# Object 对象数据(狭义的对象)
Js核心概念
对象是一组键值对的集合 , 是一种无序的复合数据集合
let andyLau = {
name : "Andy",
sex : "Male",
age : 60 ,
weight : "60kg",
height : "170cm",
marry : true,
};
console.log(AndyLau);
// 对象的键名都是字符串,不需要再额外添加引号,除非不符合标识符的规则
// 属性值可以是任何数据类型
// 一个对应值为函数的键是方法
// 属性名不能相同,属性值能相同
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
取值
//取值,不通过序号下标去获取
console.log(andyLau.name);
console.log(andyLau['age']); // 通过下标形式取值需要用字符串形式,不带引号会被当做变量处理(这种方式在某些需要动态修改属性的场景很常用)
console.log(andyLau.songs);//取一个对象不存在的属性返回undefined
2
3
4
添加属性
lindaiyu.hobby = "怼人";
console.log(lindaiyu);
//属性可以动态的创建和添加 不必在对象声明时全部指定
2
3
对象删除
通过delete
关键字删除对象的某个属性或方法。
# Function 函数
函数是一段可以反复调用的代码块。
function fn() {
console.log("I'm a function.");
}
// 函数调用,执行该函数名里面的代码块
fn();
2
3
4
5
# typeof 操作符
检测一个变量或数据的数据类型,返回结果为字符串。
undefined 类型
只let了一个变量,没有赋初值,它的默认值是undefined;
这个undefined是自成一家,类型和值都是undefined。这种类型的值页只有一个。
var u; // 定义但未赋初值,值为undefined,类型也为undefined
console.log(u, typeof u); // undefined, undefined
2
console.log(typeof null); //object
console.log(typeof []); //object
console.log(typeof {}); //object
2
3
特殊 :
null 在使用typeof检测时 ,数据类型为Object
console.log(typeof null); // object
console.log(typeof function fun(){})
//function 更好区分普通对象和函数对象
2
3