初识 JS 变量, 简单数据类型,typeof,数据类型转换
初识 JavaScript
JavaScript 是什么
- JavaScript 是世界上最流行的编程语言之一,是一种运行在客户端的脚本语言;
- 脚本语言:不需要编译,运行过程中由 js 解释器逐行来进行解释并执行;
- 现在也可以基于 Node.js 技术进行服务器端编程。
浏览器执行 JS 简介
浏览器分成两部分:渲染引擎和 JS 引擎;
- 渲染引擎: 用来解析HTML与CSS,俗称内核,比如 Chrome 的 blink,老版本的 webkit;
- JS 引擎: 也称为 JS 解释器,用来读取网页中的 JavaScript 代码,对其进行处理,比如 Chrome 浏览器的 V8;
浏览器本身并不会去执行 JS 代码,而是通过内置的 JavaScript 引擎(解释器)来执行 JS 代码,JS 引擎执行代码时逐行解释每一句源码(转为机器语言),然后由计算机去执行,所以 JavaScript 语言归为脚本语言,会逐行解释执行;
JS 的组成
- ECMAScript:规定了 JS 的编程预发和基础核心内容,是所有浏览器厂商共同遵守的一套 JS 语法工业标准;
- DOM:(Document Object Model)是 W3C 组织推荐的处理可扩展标记语言的标准编程接口;通过 DOM 提供的接口可以对页面上的元素进行操作(大小,位置,颜色等);
- BOM:(Borwser Object Model)是指浏览器对象模型,提供了独立于内容的,可以与浏览器窗口进行交互的对象结构,通过 BOM 可以操作浏览器窗口,比如弹窗,控制浏览器跳转等;
JS 书写方式
1,行内式
<input type="button" onclick="alert('hello world');"
2,内嵌式
<script>
alert('hello world');
</script>
3,引入式
<script src="./main.js"></script>
输入输出语句
方法 | 说明 |
---|---|
alert(msg) | 浏览器弹出警示框 |
console.log(msg) | 控制台打印信息 |
prompt(msg) | 浏览器弹出输入框 |
变量
变量是用于存放数据的容器,我们通过变量名获取数据,是指数据可以修改;变量是程序在内存中申请的一块用来存放数据的空间
声明变量
// 声明变量
var variable; // 只声明不赋值,结果为 undefined 未定义的
// 声明多个变量
var age, Name, sex;
// 声明变量并赋值
var age = 19;
变量更新
一个变量被重新赋值后,它原有的值就会被覆盖,变量值以最后一次赋值为准
var age = 19;
age = 21; // 此时 age 为 21
变量命名规范
- 由字母,数字(不能以数字开头),下划线,美元符号($)组成
- 按个区分大小写,不能是关键字或者保留字
- 遵守驼峰命名;
数据类型
js 的数据类型只有在程序运行的时候才能确定;
数据类型的分类
简单数据类型(number,boolean,string,undefined,null)
简单数据类型 | 说明 | 默认值 |
---|---|---|
Number | 数字型,包含整形和浮点型 | 0 |
Boolean | 布尔类型,true false 等价于 1 和 0 | false |
String | 字符串类型 | "" |
Undefined | 声明变量未赋值 | undefined |
Null | 空 | null |
Number
Number.MAX_VALUE; // 获取最大值
Number.MIN_VALUE; // 获取最小值
console.log(Number.MAX_VALUE * 2); // Infinity 无穷大
console.log(Number.MAX_VALUE * -2); // -Infinity 负无穷大
console.log('string' * 2); // NaN 非数字
isNaN(Variable); // 判断这个变量是不是数字,如果是返回 false 如果不是返回 true
八进制:数字前面加 0 代表为 八进制 例如 var num1 = 010;
此时 num1 的值为 8;逢 7 进 1 前面加个 0;
十六进制: 数字前面加 0x 代表 十六进制 0 - 9 a - f;
String
字符串长度:字符串是由若干字符组成的,这些字符的数量就是字符串的长度,通过字符串的length属性可以获取整个字符串的长度;
String.length;
字符串拼接: 多个字符串可以使用 +
进行拼接,其拼接方式为 字符串 + 任何类型 = 拼接后的新字符串; 拼接前会把与字符串相加的任何类型转换成字符串,再拼接成一个新的字符串;
Undefined
undefined 与数字相加 NaN;undefined 与 字符串相加 会拼接字符串
判断数据类型
typeof variable;
数据类型转换
转换为字符串
方式 | 说明 | 案例 |
---|---|---|
toString() | 转换成字符串 | var num = 1; alert(num.toString()); |
String() | 强制转换为字符串 | var num = 1; alert(String(num)); |
字符串拼接(隐式转换) | 和字符串拼接的结果都是字符串 | var num = 1; alert(num + ''); |
转换为数字
方式 | 说明 | 案例 |
---|---|---|
parseInt(string) | 将string类型转换为整数(只取整数) | parseInt('19'); |
parseFloat(string) | 将string类型转换为浮点数 | parseFloat('19'); |
Number() | 将string类型转换为数值型 | Number('19'); |
隐式转换 | 利用算术运算转换为数值型 | '12' - 0 |
parseInt() 和 parseFloat() 在转换的时候,只要第一个字符是数字就可以成功转换
parseInt('12px') + parseFloat('22.3px')
结果为 12 + 22.3
转换为Boolean
方式 | 说明 | 案例 |
---|---|---|
Boolean() | 其他类型转换为Boolean类型 | Boolean(null); |
代表空,否定的值会被转换成 flase 如 0 NaN null undefined
其余的值会被转换为 true