目录

1. JS基础

1.1 JS 组成

1.2 JS的几种书写形式

1.3 输入输出

2. 变量的使用

 3. 基本数据类型

 4. 运算符

5. 数组

6. 函数（function）

7. 对象

---

1. JS基础

1.1 JS 组成

渲染引擎（解析html和CSS，也叫做“内核”）+JS引擎（JS解释器，比如Chrome中的V8，JS引擎逐行读取JS代码，解析为二进制指令，然后再执行）

需要注意的是

JS引擎都需要遵守这个标准来实现：ECMAScript

对于在浏览器上执行的JS来说，可以视作3部分

1.JS核心语法

2.DOM API: 页面文档对象模型, 对页面中的元素进行操作

3.BOM API: 浏览器对象模型, 对浏览器窗口进行操作

JS语法，只能写一些基础的逻辑

而要想完成更复杂的任务，比如完成和浏览器以及页面进行交互，就需要DOM API和BOM API；如果是运行在服务器端的JS，就需要使用node.js的API了。

1.2 JS的几种书写形式

（1） 内嵌式，把JS写到script标签中

（2）行内式，把JS写到html元素的内部

（3）外部式，把JS写到单独的.js文件中,在html里面通过script来引入

  

1.3 输入输出

（1）输入：prompt 弹出一个输入框

（2）输出：alert 弹出一个警示对话框, 输出结果

 （3）输出: console.log 在控制台打印一个日志(供程序员看)

2. 变量的使用

（1）基本用法

a） 定义一个变量：

var 变量名 = 初始值;

 不论创建的变量是啥类型，此时统一都是使用var这个关键字来表示的

至于想要创建变量具体的类型，这取决于初始化的值，是啥类型 

 也可以不初始化，不初始化的时候，变量的值是一个特殊的值 undefined

类型也就是undefined

b）使用变量： 读取/修改

（2）动态类型

如果本来a是一个数字类型，在赋值的时候可以给它赋一个数字类型，也可以赋一个字符串类型，也可以是赋任意类型，这个时候a变量的类型，也就是随之改变

 变量的类型，可以在运行过程中，随着赋值而发生改变，这种行为称为“动态类型”

而现在更倾向于使用let，来代替var，因为var不受作用域约束

 3. 基本数据类型

number: 数字. 不区分整数和小数.

boolean: true 真, false 假.

string: 字符串类型.

undefined: 只有唯一的值 undefined. 表示未定义的值.

null: 只有唯一的值 null. 表示空值

（1）数字类型：number

var a = 07;      // 八进制整数, 以 0 开头
var b = 0xa;     // 十六进制整数, 以 0x 开头
var c = 0b10;    // 二进制整数, 以 0b 开头

特殊的数字值

Infinity：无穷大，大于任何数字，表示数字已经超过了JS能表示的范围

-Infinity：负无穷大，小于任何数字、表示数字已经超过了JS能表示的范围

NaN：表示当前的结果不是一个数字

1. 负无穷大 和 无穷小 不是一回事. 无穷小指无限趋近与 0, 值为 1 / Infinity

2. 'hehe' + 10 得到的不是 NaN, 而是 'hehe10', 会把数字隐式转成字符串 , 再进行字符串拼接 .

3. 可以使用 isNaN 函数判定是不是一个非数字.

（2）字符串类型：String

string基本使用和java一样，这里再说明一下

如果 字符串中本来已经包含引号，那就可以使用转义字符或者单双引号搭配使用

求字符串长度，使用 String 的 length 属性即可

 需要注意这里的长度单位是“字符”，"hehe"是4个字符；"你好"是2个字符

（3）布尔类型：Boolean

Boolean 参与运算时当做 1 和 0 来看待

（4）未定义数据类型：undefined

如果一个变量没有被初始化过, 结果就是 undefined, 是 undefined 类型（非法情况）

JS是一个（动态类型+弱类型）

（5）空值类型：null

null表示当前这个值属于“没有值”这个概念，属于合法的情况

 4. 运算符

JS运算符用法和Java运算符基本一样

需要注意的有：

（1）比较运算符中

== 和 !=（只是比较两个变量的值，而不是比较两个变量的类型，如果两个变量能够通过隐式类型转换，转成相同的值，此时就认为，也是相等的）

=== 和 !==（既要比较变量的值，也要比较类型，如果类型不相同，就直接认为不相等）

（2）逻辑运算符 && ll，JS中逻辑运算后返回的是 其中的一个表达式

c = a||b，

如果a的值，为真，此时c的值，就是表达式a的值

如果b的值，为假，此时c的值，就是表达式b的值

c = a&&b也类似

所以根据JS逻辑运算符这样的特性，就可以用来

判断变量是否为“空值”，如果是空值，则赋予一个默认值

（3）算术运算符：/   

JS中不区分整数和小数，都是number

5. 数组

（1）创建数组，两种方法

a）使用new关键字创建

b）使用字面量方式创建（JS 的数组不要求元素是相同类型.）

 （2）打印数组

 （3）获取数组元素

使用下标的方式访问数组元素(从 0 开始）

 如果下标超出范围读取元素, 则结果为 undefined

可以看到arr长度变为了101，然后数组的内容，前5个元素还是1,2,3,4,5

下标为100的元素是10，中间的空属性*95，意思就是中间的这些元素仍然是undefined

 此时-1的下标就是10，也可以说-1这里是一个属性（键值对），它并没有影响到数组长度，

 

 JS中的数组，还可以有map的作用（表示键值对）。

数组是一个map，也可以说是一个“对象”

在JS里，是可以在运行时，给对象新增属性的

下面的这两种写法都是一样的效果

arr['hello']就是给arr这个对象，新增一个属性，属性的名字是hello，属性的值是10；

 

（4）获取数组长度

 通过.length

JS中，length属性是可以修改的

 （5）给数组中新增元素

最常见的插入操作，push方法，能够给数组末尾追加一个元素

（6）删除数组中的元素

使用 splice 方法删除元素

splice方法也可以替换元素

6. 函数（function）

（1）语法格式

 

 

 （2）函数参数个数

实参和形参之间的个数可以不匹配 . 但是实际开发一般要求形参和实参个数要匹配

a）当实参个数比形参多时，多出来的参数不参与函数运算

b）当形参个数比实参多时，多出的形参值为undefined

 如果想让代码，既能支持数组相加，又能支持字符串相加，这个时候就肯定要判断，判定第一个参数，是字符串还是数字

（3）函数表达式

函数表达式，就是把一个函数赋值给另一个变量了

也可以这样，合并上面的操作(既定义了hello这个函数，又把hello赋值给了f)

再进一步，就可以把hello省略，此时就是完全依赖f来找到该函数

定义了一个没有名字的函数，并且把这个函数赋值给了f变量，后面就可以基于f来调用这个函数了

 而这个也叫做“匿名函数”，也叫做lambda表达式

（4）作用域 & 作用域链

在ES6之前，只是有全局作用域和函数作用域

在ES6之后，引入了let，也就有了块级作用域，一个变量在{}内部定义，是无法被{}访问的

在JS中，{}内部的代码，是可以访问到{}外部的变量的

函数可以定义在函数内部

内层函数可以访问外层函数的局部变量 .

内部函数可以访问外部函数的变量 . 采取的是链式查找的方式 . 从内到外依次进行查找，一层一层往上找，如果还没找到 , 就去全局作用域查找，这个也叫做 “作用域链”

如果在作用域链的不同结点上，存在多个同名的变量上怎么办

那就从里往外走，先找到谁就用谁

7. 对象

对象，就是一些属性和方法的集合

java中，对象是需要现有类的，然后针对这个类进行实例化才能产生对象

JS中，对象是不依托于类的，在JS中所有的对象，都只有一个类型Object

在JS中，直接通过{}的方式，就可以创建对象（最常用）

每个属性和方法，都是通过“键值对”，这样的方式来表达出来

{}表示这个是个对象，后续就可以通过student这个属性名 方式来访问了

        let student = {
            name:'张三',
            age:20,
            height:180,
            weight:120,

            sing: function() {
                console.log("1111");
            },

            jump: function() {
                console.log("2222");
            },
        };

对象的使用 

 也可以通过new Object 创建对象

 前面的创建对象方式只能创建一个对象. 而使用构造函数可以创建多个对象

function 构造函数名(形参) {
    this.属性 = 值;
    this.方法 = function...
}
    
var obj = new 构造函数名(实参);

new后面的名字，是构造函数的名字，不是“类”的名字