初识JavaScript

JavaScript是一门脚本语言。

快速入门

引入JS：

JS可以写在HTML中
写在单独的JS文件中，在HTML通过script标签的src属性引入文件<script src="Introduce.js"></script>

严格检查模式：在JS文件的首行添加'use strict'来使编译器进行语法的严格检查

基本语法

变量

定义变量：变量等级变量名 = 变量值
变量等级有：

var 全局变量
let 局部变量
const 常量

数据类型

number：数值类型，JS不区分小数和整数，number可以有整数、小数、负数、科学计数法、NaN、Infinity等。

boolean：布尔值，true/false

null：值为空
undifined：未定义

string

string可以表示字符及字符串

使用''或""包裹字符/字符串
使用\t等表示转义字符
使用``包裹，可以书写多行文本
模板字符串，可以在字符串中添加变量：let str = ˋhello ${name} // name为变量名ˋ，模板字符串必须用反引号包裹

string特性：

string[n]，可以访问字符串中n位字符
字符串内容不可变

string常用属性：

通过string.length访问长度属性

string常用方法：

string.toUpperCase()字符串转换为大写
string.toLowerCase()字符串转换为大写
string.indexOf()查找字符串中某字符/字符串的下标
string.subString()截取字符串，区间为前开后闭

数组

JS的数组Array中可以包含不同类型的数据。let arr = [12,34,"s",'qwer',true]
数组的长度可变，通过给数组的长度赋值，赋值过小时会导致元素丢失。

多维数组：let arr = [[1, 2], ["s", 'a']]

Array常用方法：

arr.indexOf()，获取数组中某个元素的下标
arr.slice()截取数组的一部分，前开后闭
arr.push()在数组尾部添加元素
arr.pop()返回并删除数组尾部的元素
arr.unshift()在数组头部添加元素
arr.shift()返回并删除数组头部的元素
arr.sort()将数组排序
arr.reverse()反转数组
arr.concat()连接数组，返回连接的结果，但不会改变原数组
arr.join()打印拼接的字符，使用输入的字符连接

arr = [1,2,3]
arr.join(0)    // 10203

Map

Map类似Python的dict

创建方式：let map = new Map([["Tom", 100], ["Jerry", 60], ["Jack", 99]])
获取key对应的value：map.get('Tom')
添加或修改键值对：map.set('June', 101)
删除键值对：map.delete('June')

Set

Set为无序不重复的集合

创建方式：let s = new Set([1,23,1,23])
添加值：s.add(20)
删除值：s.delete(23)
判断Set中是否含有某个值：set.has(23)

迭代器

ES6规定，默认的Iterator接口部署在数据结构的Symbol.iterator属性上

迭代器的创建方法：let m = map[Symbol.iterator]()
通过next().value获取下一个的值：m.next().value

示例代码：

let m = map[Symbol.iterator]()
console.log(m.next().value);    // [ 'Tom', 100 ]
console.log(m.next().value);    // [ 'Jerry', 99 ]
console.log(m.next());    // { value: [ 'Jack', 70 ], done: false }
console.log(m.next());    // { value: undefined, done: true }

运算

逻辑运算符：&&、||、!

比较运算符：==(类型不一样，值一样也为true)、===(绝对等于，类型和值均一致才为true)；特殊的NaN与所有数值都不相等，NaN===NaN为false。

避免浮点数运算，存在精度问题。

对象

定义对象使用var关键字，属性使用属性名:属性值键值对(JS中所有的键都用字符串表示，值可以是任意类型)来定义，属性间用,隔开，整体用{}包裹

let person = {
    age: 10,
    name:'Je',
    tags:['js','code']
}

操作对象：

修改对象属性：person.sex = 'man'
使用不存在的对象属性并不会报错，为undefined
动态的删减对象属性delete person.sex
动态的添加对象属性，直接给对象的属性赋值即可person.sex = 'male'
判断对象是否有某个属性（包含继承的属性），使用in运算符：'toString' in person
判断对象自身拥有的属性（不包含继承的属性），使用hasOwnProperty()方法：person.hasOwnProperty('age')

流程控制

分支结构

if判断

let age = 3;
if (age > 3) {
    console.log('haha');
} else if (age > 2) {
    console.log('walk');
} else console.log('cry');

循环结构

while循环

while (age < 100) {
    if (age % 20 === 0) {
        console.log(age);
    }
    age++
}
console.log('die');

do-while循环

let i = -1
do {
    console.log('hello')
} while (i > 0)

for循环

for (let i = 0; i < 10; i++) {
    console.log(i);
}

for...in循环

for (let i in arr) {
    console.log(arr[i]);    // i为下标
}

for...of循环，可以遍历数组、Map、Set等

for (let i of arr) {
    console.log(i);    // i为数组元素
}

forEach循环

arr.forEach(function (value) {
    console.log('value:' + value);
})

JavaScript01