JavaScript基本语法
1、变量
1.1、简介
在 JavaScript 中声明一个新变量的方法是使用关键字
let
、const
和var
,如下:
var:
// var可以重复定义同一个变量,没有块级作用域,但是有函数作用域,变量类型由最近一次对变量赋值的数据类型决定
// 注意:变量作用域是在ES6才有的。通过 var 声明的变量会提升到顶端,而let不会
// myVar 在这里能被引用
for (var myVar = 0; myVar < 5; myVar++) {
// myVar 整个函数中都能被引用
}
// myVar 在这里能被引用
let:
// 类似于var定义变量,区别是let不能重复定义同一个变量,且let有块级作用域
// myLet 在这里不能被引用
for (let myLet = 0; myLet < 5; myLet++) {
// myLet 只能在这里引用
}
// myLet 在这里不能被引用
const:
// 定义了对值的常量引用,不能更改常量原始值,但我们可以更改常量对象的属性,有块级作用域
// 注:必须在声明时赋值
const PI = 3.14; // 设置 PI 的值
PI = 1; // 将会抛出一个错误因为你改变了一个常量的值。
const MY_OBJECT = {"key": "value"};
MY_OBJECT.key = "otherValue"; // 成功修改属性值
const MY_ARRAY = ['HTML','CSS'];
MY_ARRAY.push('JAVASCRIPT'); // 成功添加元素 ['HTML','CSS','JAVASCRIPT']
1.2、变量命名规则
- 只能由数字、字母、下划线和 $ 组成,但不能以数字开头;
- 不建议使用关键字和保留字;
- 严格区分大小写,A 和 a 是两个不同的变量。
1.3、JS的关键字和保留字
- 切记:自己定义的变量名不得使用JS中的关键字和保留字。
- 常用关键字:
typeof
检测数据类型,var
定义变量,debugger
调试,eval
计算值的函数。
1.4、声明提升
JavaScript 中,函数及变量的声明都将被提升到函数的最顶部,但函数表达式并不会提升;
/* 函数声明 */
foo(); // "bar"
function foo() {
console.log("bar");
}
/* 函数表达式 */
baz(); // 类型错误:baz 不是一个函数
var baz = function() {
console.log("bar2");
};
- JavaScript 中,变量可以先使用后声明;
- 由于存在变量提升,一个函数中所有的 var 语句应尽可能地放在接近函数顶部的地方,提高代码清晰度;
- 在ES6中,let 和 const 同样 会被提升 变量到代码块的顶部但是不会被赋予初始值;
- 全局变量是 全局对象 的属性。在网页中默认的全局对象是
window
,所以我们可以用形如window.
*variable
*的语法来设置和访问全局变量。
2、JavaScript数据类型
JavaScript数据类型分为:基本类型和引用类型。
2.1、基本类型
类型名称 | 描述 |
---|---|
Number | 数值类型,所有的数字不分大小、不分整浮、不分正负,都是数值类型。 |
String | 字符串类型,使用双引号或者单引号包裹的值。 |
Boolean | 布尔类型(true & false)。 |
Undefined | 1、表示定义了变量没有赋值,默认值为 undefined; 2、变量声明提升时,变量的值也为 undefined; 3、undefined 的类型也为 undefined; 4、undefined 值在布尔类型环境中会被当作 false。 |
Null | 表示变量赋了个空值,用 typeof 检测 null,结果为 object; undefined派生于null,undefined和null的值相等; 对一个 null 变量求值时,空值 null 在数值类型环境中会被当作 0 来对待,而布尔类型环境中会被当作 false。 |
Symbol | Symbol 是 ES6 引入的一种新的原始数据类型,表示独一无二的值。 |
2.2、引用类型
类型名称 | 描述 |
---|---|
Object | 存储的是对象属性集合,每个属性都是一个"键-值"对。 |
Array | Array 对象支持在单个变量名下存储多个元素,大小可变,数据类型不限。 |
Function | Function 对象,调用它的构造函数可以动态创建函数。 |
2.3、两种类型的区别
类型 | 基本类型 | 引用类型 |
---|---|---|
值 | 不可改变 | 可以改变 |
属性和方法 | 不能添加 | 能添加 |
存储值 | 值 | 地址(指针) |
比较 | 值的比较 | 地址的比较 |
2.4、字符串常用方法
方法名称 | 描述 |
---|---|
charAt() | 获取指定位置的字符 |
substring() | 提取字符串中,介于两个指定下标之间的字符 |
substr() | 在字符串中指定的位置处,提取指定数目的字符 |
slice() | 提取字符串的某个部分,类似于 substring() ,不同之处: 1、substring() 可以自动交换参数的位置,而 slice()不行 2、slice()的第一个参数可以是负数,而 substring()不行 |
toUpperCase() | 把字符串转换为大写 |
toLowerCase() | 把字符串转换为小写 |
indexOf | 返回字符串中指定字符首次出现的索引 |
split() | 将字符串转成数组 |
整数字面量:
0, 117 and -345 (十进制,基数为 10)
015, 0001 and -0o77 (八进制,基数为 8)
0x1123, 0x00111 and -0xF1A7 (十六进制,基数为 16 或"hex")
0b11, 0b0011 and -0b11 (二进制,基数为 2)
浮点数字面量:
3.14
-.2345789 // -0.23456789
-3.12e+12 // -3.12*10^12
.1e-23 // 0.1*10^(-23)=10^(-24)=1e-24
模板字面量:
//模板字面量使用反引号 `` 来定义字符串
let text = `Hello World!`;
//可以在字符串中同时使用单引号和双引号
let text = `He's often called "Johnny"`;
//允许多行字符串
let text =
`The quick
brown fox
the lazy dog`;
字符串插值:${...}
,用真实值自动替换表达式就叫字符串插值,允许字符串中的变量与表达式
let firstName = "Bill"; let lastName = "Gates";
let text = `Welcome ${firstName}, ${lastName}!`;
let price = 10; let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;
3、数据类型转换
方法名称 | 描述 |
---|---|
Number() | 将其他类型的值转换为数字 强制类型转换 |
parseInt() | 可以将参数转成整数 |
parseFloat() | 可以将参数转成浮点数 |
String() | 将其他类型的值转换成字符串 强制类型转换 |
toString() | 将其他类型的值转换成字符串。 .toString() 和 String()的区别: 1、toString()无法转换 null 和 undefined,String()可以转换 null 和 undefined 2、toString()可增加进制参数,将字符串进行进制转换,String()不能转换进制 3、写法不同,可参考上述例子 |
Boolean() | 将其他类型的值转换为布尔值 强制类型转换 |
注意:
parseInt()函数,对其参数是进行除法操作时,其结果为整除值,参数是浮点数会丢失精度;
如果字符串不能转换为数值,则返回结果NaN(Not a Number);
字符串以数字开头,转换为数值的过程中碰到第一个非数字字符时停止转换;
在转换字符为含有小数的数值中,第一个小数点有效,其后的其他小数点就无效;
把字符串转换为boolean类型,空字符串转换后结果为false,其他非空字符串,转换后结果为true;
把number类型转换为boolean时,数值0转换后结果为false,非零值(正负均可)转换后的值为true。
扩展:
toFixed(m)
:指定数值型数据保留m位小数,对m位后进行四舍五入;isNaN()
:用来检测一个值是否为 NaN ,返回布尔值。
上一篇文章 | 下一篇文章 |
---|---|
JavaScript入门须知(一) | JavaScript运算符(三) |