一个变量被重新赋值后,它原有的值就会被覆盖,变量值将最后一次赋的值为准。
var name = "古力娜扎";
name = "迪丽热巴";
console.log(name);// 输出结果为 迪丽热巴
1.4.2 声明多个变量
同时声明多个变量时,只需要写一个var,多个变量名之间使用英文逗号隔开。
var name = "小明", age = 18, gender = "男";
1.4.3 声明变量的特殊情况
- 只声明变量不赋值输出的结果是undefined(未定义的),因为程序不知道里面存了什么
var age;
console.log(age); // 结果是undefined
- 不声明、不赋值直接使用变量会报错
console.log(age);
- 不声明直接赋值使用
age = 19;
console.log(age);// 结果为19
1.5 变量命名规范
- 有字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号($)组成
- 严格区分大小写
- 不能以数字开头,18age 是错误的命名方式
- 不能 是关键字、保留字。例如:var、let、for、while
- 变量名必须具有意义
- 遵守驼峰命名法,首字母小写,后面单词首字母需要大写。myName
- 翻译网站:有道、百度翻译
1.6 js输入输出语句
为了方便信息的输入输出,js中提供了一些输入输出语句,常用如下:
- alert:浏览器弹出警示框。
- console.log(msg):浏览器控制台打印输出信息。
- prompt(info):浏览器弹出输入框,用户可以输入。
alert('我爱js'); // 弹出警示框
console.log('Hello,world'); // 控制台打印信息
prompt('请输入密码'); // 弹出输入框
1.7 案例
要求:交换两个变量的值(用一个临时变量 用来做中间存储)
var temp;
var ball1 = '羽毛球';
var ball2 = '篮球';
temp = ball1;
ball1 = ball2;
ball2 = temp;
console.log(ball1);
console.log(ball2);
2. 数据类型
2.1 数据类型简介
2.1.1 为什么需要数据类型
在计算机中,不同的数据类型所占用的数据空间是不同的,所以为了便于把数据分成所需内存大小不同的数据,使空间不被浪费,于是定义了不同的数据类型。
简单说数据类型就是数据的类别型号。如:张三、19、age。
2.1.2 变量的数据类型
变量是一种存储空间,它们有名字和类型,变量的数据类型决定了如何将代表这些值的位存储到计算机的内存中。js是一种弱类型的语言,意味着不需要声明变量的类型,在程序运行过程中,类型会被自动确定
var age = 10;// 数字型
var sayOk = '是的'; // 字符串型
注:在代码运行时,变量的数据类型是由JS引擎根据=右边变量值的数据类型来判断的,运行完毕之后,变量就确定了数据类型
js拥有动态类型,相同的变量可用作不同的类型:
var x = 10; // 数字型
var x = '天将降大任于斯人也'; // 字符串类型
2.1.3 数据类型的分类
JS 把数据分为两类:
- 简单数据类型(Null、Undefined、String、Number、Boolean)
- 复杂数据类型(Object)
2.2 简单数据类型
2.2.1 简单数据类型(基本数据类型)
JavaScript 中的简单数据类型及其说明如下:
2. 2.2 数字型 Number
JavaScript 数字类型既可以用来保存整数值,也可保存小数(浮点数)。
var age = 19; // 整数
var Pi = 3.1415926; // 小数
- 数字型进制
最常见的进制:二进制、八进制、十进制、十六进制。
//1.八进制数字序列范围:0~7
var num1 = 07; // 对应十进制的7
var num2 = 019; // 对应十进制的19
var num3 = 08; // 对应十进制的8
//2.十六进制数字序列范围:0~9以及A~F
var num = 0xA;
- 数字型范围
JavaScript中的数值的最大值和最小值
alert(Number.MAX\_VALUE); // 1.7976931348623157e+308
alert(Number.MIN\_VALUE); // 5e-324
- 数字型三个特殊值
alert(Infinity); // 代表无穷大
alert(-Infinity); // 代表无穷小
alert(NaN); // Not a Number 代表一个非数值
- isNaN()
这个方法是用来判断非数字,并且返回一个值,如果是数字返回的是 false 如果不是数字返回的是true。
console.log(isNaN(555)); // false
2.2.3 字符串型 String
- 字符串引号嵌套
字符串型数据是用来表示文本数据的,有字母、数字、汉字或其他特殊字符构成,在使用过程中必须用单引号或双引号括起来,单双引号可以互相嵌套,但不能交叉使用。
var strMy1 = "我爱中国"; // 使用双引号
var strMy2 = '欢迎来到javascript的世界';// 使用单引号
var strMy3 = "孔子曰:'三人行必有我师焉'"; // 嵌套使用
单引号和双引号交叉使用是错误的:
var strMy = '欢迎来到"javascript'的世界"; // 错误写法
同时双引号与双引号不能互相嵌套使用,单引号与单引号之间同理:
var Str1 = '欢迎来到'javascript'的世界'; // 错误写法
var Str2 = "欢迎来到"javascript"的世界"; // 错误写法
- 字符串长度获取
字符串长度是指组成字符串的若干字符的数量,通过length属性可以获取整个字符串的长度。
var strMy = "我亦无他,唯手熟尔";
alert(strMy.length); // 获取字符串的长度,显示9
- 字符串拼接
多个字符串可以用 + 进行拼接:
console.log('前端' + '程序员'); // 前端程序员
console.log('小明' + 18); // 小明18
注:只要有字符串类型和其他类型拼接,结果都是字符串类型
2.2.4 布尔型 Boolean
布尔型也叫逻辑型,只有两个值,即逻辑真和逻辑假。分别用true和false来表示,程序中也可以用非0数值和数值0表示 true 和 false,当把true 和 false转换为数值时,分别是1 和 0。
布尔型常用于判断语句中
var n = 1;
console.log(n == 1); // true
2.2.5 Undefined和NULL
undefined指的是未定义类型的变量,表示这个变量还没有赋值
var age;
alert("此时的变量类型为" +age);
执行结果如下:
NULL表示空值,用于定义空的或者不存在的引用。
var vari = null;
console.log(19 + vari); // 19
console.log(true + vari); // 1
注:NULL和Undefined的区别是NULL表示一个变量赋予了一个空值,而undefined则表示该变量没有被赋值。
2.3 获取变量数据类型
变量数据类型我们通过typeof来获取:
var num = 18;
console.log(typeof num); // number
var str = '通过typeof获取变量类型';
console.log(typeof str); // string
2.4 字面量
字面量是在源代码中一个固定的表示法,表示如何表达这个值
- 字符串字面量:‘前端’,“程序员”
- 数字字面量:4,9,7
- 布尔字面量:true,false
2.5 数据类型转换
通俗来说就是把一种数据类型的变量转换成另外一种数据类型,通常有3种方式实现转换:
- 转换为字符串类型
// 方法一.把数字型转换为字符串型 变量.toString()
var num = 10;
var str = num.toString();
console.log(str); // 10
console.log(typeof str); // string
// 方法二.利用String(变量)强制转换
console.log(String(num));
// 方法三.利用 + 拼接字符串实现转换(隐式转换)
console.log(num + '');
- 转换为数字型(重点)
var age = prompt('请输入你的年龄'); // 弹出输入框,把输入值赋给 age
// 1.利用 parseInt 函数,可以把字符型的转换为数字型的,得到的是整数
console.log(parseInt(age));
console.log(parseInt('5.20')); // 5 取整
// 2.parseFloat(变量) 可以把 字符型的转换为数字型,得到的是小数 浮点数
console.log(parseFloat('13.14')); // 3.14
console.log(parseFloat('120px')); // 120 会去除px这个单位
console.log(parseFloat('ram120px')); //NaN
// 3. 利用number(变量)
var str = '345';
console.log(Number(str));
// 4. 利用了算术运算 - \* / 隐式转换
console.log('12' - 0);
console.log('134' - '123');
注:parseInt 和 parseFloat单词的大小写,隐式转换是指我们在进行算术运算时,js自动转换了数据类型。
- 转换为布尔型
其他数据类型转换成布尔型利用 Boolean() 函数进行转换
console.log(Boolean('小明')); // true
console.log(Boolean(0)); //false
console.log(Boolean(null)); //false
注意:代表空的、否定的值会被转换为false,如:0、null、undefined,其余的都会转换为true
2.6 简单加法器案例
要求用户前后各输入一个值进行相加,通过弹出窗口显示相加结果,实现代码如下:
var num1 = prompt('请输入第一个数:');
var num2 = prompt('请输入第二个数:');
var result = parseFloat(num1) + parseFloat(num2); // 转换为数字型进行计算
alert('结果为:' + result);
2.7 数组
2.7.1 什么是数组
数组是内存中保存一组数据的集合,其中每个数据称为元素,数组元素的个数称为数组大小,数组可以存放多个任意类型的元素。数组是将一组数据存储在单个变量名下的优雅方式。
// 普通变量一次只能存储一个值
var age = 18;
// 数组一次可以存储多个值
var arr = [3,5,7,8];
2.7.2 创建数组的方式
js中有两种创建数组的方式:
- 利用 new 创建数组
var arr = new Array(); // 创建一个空的数组
- 利用数组字面量创建数组
// 使用数组字面量创建空的数组
var arr = [];
// 使用数组字面量方式创建带初始值的数组
var dog = ['小白','小黑','哈士奇','二哈'];
注意:数组的字面量是方括号[],声明数组并赋值称为数组的初始化,数组内元素之间用逗号隔开
网上学习资料一大堆,但如果学到的知识不成体系,遇到问题时只是浅尝辄止,不再深入研究,那么很难做到真正的技术提升。
一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!
利用数组字面量创建数组
// 使用数组字面量创建空的数组
var arr = [];
// 使用数组字面量方式创建带初始值的数组
var dog = ['小白','小黑','哈士奇','二哈'];
注意:数组的字面量是方括号[],声明数组并赋值称为数组的初始化,数组内元素之间用逗号隔开
[外链图片转存中…(img-lAG90Imc-1714410774329)]
[外链图片转存中…(img-TSyv3F7b-1714410774330)]
网上学习资料一大堆,但如果学到的知识不成体系,遇到问题时只是浅尝辄止,不再深入研究,那么很难做到真正的技术提升。
一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人,都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!