编程语言前端javaScript
Source
Edit
History

undefined

JavaScript 是一门世界上最流行的脚本语言

ECMAScript 是 JavaScript 的一个标准，最新版本已经有 es6 版本，但是大部分浏览器只停留在支持 es5 代码上

一、快速入门

1. 引入 JavaScript

  1. 内部标签

    1
    2
    3
    <script>
    	// ...
    </script>

  2. 外部引入

    abs.js

    1
    <script src="abs.js"></script>

测试

index.html 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!-- script标签内，写JavaScript代码 -->
<!--    <script>-->
<!--        alert('hello world')-->
<!--    </script>-->

    <!-- 外部引入
    注意：script 标签必须成对出现
    -->
    <script src="js/qj.js"></script>

    <!-- 不用显示定义 type，默认就是javascript -->
    <script type="text/javascript"></script>

</head>
<body>

<!-- 也可以在这里放 JavaScript 代码 -->
</body>
</html>

abs.js

1
alert('hello world')

二、基本语法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
    <!-- javaScript 严格区分大小写 -->
    <script>
        // 1. 定义变量 var 变量名 = 变量值
        var score = 1;
        // alert(num);
        // 2. 条件控制
        if (score < 60) {
            alert("不及格");
        } else if (score < 90 && score >= 60) {
            alert("及格")
        } else {
            alert("优秀")
        }
        // console.log(num) 在浏览器的控制台打印变量
        /*
         * 注释
         */
    </script>

<!-- 流程控制
while  for  do-while
-->
for-in 是迭代索引，for-of 是迭代值
<script>
	var age = [1,2,3];
    age.forEach(function (value) {
        console.log(value);
    })
    for (let num in age) {
        console.log(age[num]); 
    } 
    for (let num of age) {
        console.log(num) 
    }
</script>

数据类型

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
// js 不区分小数和整数，Number 
123 // 整数123
123.1 // 浮点数
1.123e3 // 科学计数法
-99 // 负数
NaN // not a number 不是一个数字
Infinity // 无限大 

// 字符串
'abc'  "abc"
1. 正常字符串使用单引号或者双引号包裹
2. 注意转义字符 \  
3. 其他 \u4e2d (unicode字符)   \x41 (ascii字符) 
4. 反引号 可以一次写多行
5. let msg = `你好呀 ${name}`; 
6. 字符串方法 console.log(str.length)
7. 字符串是不可变的 str[0] = 1; 不能改变其值 

// 布尔值
true, false 

// 逻辑运算
&&  ||   !

// 比较运算
= 
== 等于（类型不一样，值一样，也会判断为true）不要使用
=== 绝对等于（类型一样，值一样，结果为true）
1. 特殊 NaN === NaN 这个是false，NaN 与所有的数值都不想等，包括自己。
2. 只能通过 isNaN(NaN) 来判断这个数是否是NaN 
3. console.log((1/3) === (1-2/3)) 是false，尽量避免浮点数运算，存在精度问题
4. console.log(Math.abs(1/3-(1-2/3)) < 0.00000001) 可以采用如此来计算

null 空 
undefined 未定义

// 数组，可以包含任意的数据类型 
var arr = [1,2,'hello',null,true]
取数组下标，如果越界了，就会 undefined 
1. 截取数组的一部分 slice()方法 
2. push、pop 尾部插入、弹出。 unshift、shift 头部插入、弹出
3. concat、join、reverse、多维数组

javaScript 中所有的键都是字符串，值都是任意对象 
// 对象
对象是大括号，数组是中括号 
var person = {
    name: "noahyzhang",
    age: 17,
    tags: ['js','python']
}
1. 使用一个不存在的对象属性，不会报错，undefined
2. 动态的添加删减属性，通过 直接赋值/delete 删除对象的属性  delete person.name 
3. 判断属性值是否在这个对象中 (1) 'age' in person  (2)'toString' in person 继承的父类
4. 判断一个属性是否是这个对象自身拥有的 person.hasOwnProperty('toString') 

// map set 是 es6 的新特性
let map = new Map(['tom',12],['jack',23]);
for (let x of map) {
    console.log(x);
}

严格检查模式

1
2
3
4
5
6
7
8
9
<!--
前提：IDEA 需要设置支持 ES6 语法
'use strict'; 严格检查模式，预防 JavaScript 的随机性导致产生的问题
 局部变量建议都是用 let 去定义
 -->
<script>
    'use strict'
    let i = 1;
</script>