目录
null和undefined都表示取值非法的情况,但是侧重点不同
一、初始JavaScript
1.1 概念
JS是一个解释型的语言。和JAVA类似,都需要运行在一个虚拟机上。
Java运行的虚拟机称为JVM,当前用的JVM是0racle的官方版本hotspot.
JS运行的虚拟机称为JS引擎,当前最主流的版本Google开发的V8Worker.
V8 worker性能好,也方便和其他语言如c+ +进行联动,Chrome浏 器、NodeJS都是基于V8 Worker 的程序。
1.2 JS能做的事情
网页开发(更复杂的特效和用户交互)、网页游戏开发、服务器开发(node.js)、桌面程序开发(Electron, VSCode就是这么来的)、手机app开发
1.3 JS之父
布兰登·艾奇
1.4 JS和HTML、CSS之间的关系
HTML:网页的结构(骨)
CSS:网页的表现(皮)
JS:网页的行为(灵魂)
1.5 JS运行过程
编写的代码是保存在文件中的,即存储在硬盘(外存上).
双击.html文件浏览器应用程序就会读取文件,把文件内容加载到内存中(数据流向:硬盘=>内存)
浏览器会解析用户编写的代码把代码翻译成二进制的,能让计算机识别的指令(解释器的工作)
得到的二进制指令会被CPU加载并执行(数据流向:内存=> CPU)
1.6 浏览器的组成
浏览器分为渲染引擎+JS引擎.
渲染引擎:解析htm1+CSS. 俗称“内核”
JS引擎:也就是JS解释器,典型的就是Chrome中内置的V8.
JS引擎逐行读取JS代码内容,然后解析称为二进制指令,再执行
1.7JS的组成
ECMAScript(ES):语法核心
DOM:页面文档对象模型,对页面中的元素进行操作。页面上的每个HTML元素(标签),都在JS中对应到一个对象,通过JS控制这些对象,就能达到控制页面表现形式的效果
BOM:浏览器对象模型,对浏览器窗口进行操作。浏览器也提供了一些对象,JS通过控制这些对象就可以控制浏览器的一些行为。 例如:刷新页面、控制浏览器窗口大小,前进、后退、右键菜单等等
DOM和BOM都是和语言相关的库,在某些运行环境下(浏览器)会有DOM和BOM。有些运行环境下(NodeJS) 就没有DOM和BOM,需提供另外一组API。进行系统级操作。
二、基础知识
2.1 JS的书写形式(3种)
①内嵌式:在script标签里面写代码
②行内式:在html标签的一些属性里面写JS代码
③外部式:把JS写到单独的文件中,使用script标签引入。 (实际开发中最常用)
在这种情况下,script标签中间不能写代码,必须空着,写了也不会执行。
2.2 注释
单行注释 // ,ctrl+/
多行注释 /**/ ,多行注释不能嵌套
2.3 输入输出
2.3.1 输入:prompt
2.3.2 输出:alert
弹出一个警示对话框,输出结果。
2.3.3 输出:console.log
在控制台打印一个日志,供程序员查看。
需要打开浏览器的开发者工具(F12) => Console标签页才能看到结果.
console是一个js中的"对象”,.表示取对象中的某个属性或者方法.可以直观理解成"的"
console.log就可以理解成:使用"控制台"对象"的log方法.
三、语法概况
3.1 变量的使用
var: 表示这是一个变量
name:变量名(要求和java一样,数字字母下划线)
在创建变量的时候并不需要指定变量的类型。虽然没有显示的写出name变量的类型,但是并不意味name没有类型。name的类型就是和赋值操作相关的,=后面赋的值是啥类型,name就是啥类型
用var定义变量的时候,一个变量名可以被重复定义,不会报错。
使用1et进行变量定义,变量的特性更接近于java这样的规则。因此,后面尽量使用let定义变量。
3.2 理解动态类型
JS的变量类型是动态的。即变量的类型可以在程序运行过程中发生变化。
①JS的变量类型是程序运行过程中才确定的。运行到=才会确定类型。
②随着程序的运行,变量的类型可能会发生改变。
动态类型自带泛型效果,也不需要重载这样的机制。
静态类型语言:c、c++、Java、Go等都是静态类型语言。一个变量在创建的时候类型就确定了,不能再运行时改变。如果尝试改变,就会直接编译报错。
对于前端和后端都是静态语言更好,因为更严谨。
3.3 基本数据类型
3.3.1 JS中内置的几种类型
number:数字。不区分整数和小数.
boolean: true真, false假.
string:字符串类型.
undefined:只有唯一的值undefined.表示未定义的值.
null:只有唯一的值null. 表示空值.
3.3.2 特殊的数字值
Infinity:无穷大,大于任何数字.表示数字已经超过了JS能表示的范围.
-Infinity:负无穷大,于任何数字.表示数字已经超过了JS能表示的范围.
NaN:表示当前的结果不是一个数字.
注意:
①负穷大和无穷小不是一回事.无穷小指无限趋近与0,值为1/Infinity
②'hello' + 10得到的不是NaN,而是"hello10',会把数字隐式转成字符串,再进行字符串拼接.
③可以使用isNaN函数判定是不是一个非数字
3.3.3 String字符串类型、求长度
字符串字面值需要使用引号引起来,单引号双引号均可。
如果字符串中本来已经包含引号咋办?
求长度使用String的length属性即可,单位为字符的数量。
3.3.4 转义字符
\n \\ \' \" \t
3.3.5 字符串拼接
使用+进行拼接
注意,数字和字符串也可以进行拼接
注意,要认准相加的变量到底是字符串还是数字
3.3.6 boolean类型
java中的布尔类型是单独的类型,不能和其他类型进行混合运算。
JS中的布尔类型是可以和其他类型混合运算,运算时,会把true隐式转为1,把false隐式转为0.
这样的操作时不科学的,实际开发中不应该这样写。
类型的强弱和类型的动态静态
JS将true和false隐式转为1和0,认为其是一个弱类型的开发语言。
一个语言越支持隐式类型转换,类型就越弱.一个语言越不支持隐式类型转换,类型就越强.
类型的强弱,和类型的动态静态,是完全不同的事情(正交)
3.3.7 undefined未定义数据类型
如果一个变量没有被初始化过,结果就是undefined,是undefined类型
undefined和字符串进行相加,结果进行字符串拼接
undefined和数字进行相加,结果为NaN
3.3.8 null空值异常
null表示当前的变量是一个"空值".

null和undefined都表示取值非法的情况,但是侧重点不同
null表示当前的值为空. (相当于有一个空的盒子)
undefined表示当前的变量未定义. (相当于连盒子都没有)
四、运算符
4.1 算术运算符
+ - * / %
4.2 赋值运算符&复合赋值运算符
= += -= *= /= %=
4.3 自增自减运算符
++ --
4.4 位运算
& 按位与 |按位或 ~按位取反 ^按位异或
JS的位运算.不区分整数和小数的.但是一般来说,整数才能位运算.JS中的数据在进行位运算之前会先隐式转成一个4个字节的整数,然后再进行运算
4.5 移位运算
<< 左移
>>有符号右移(算数右移)
>>>无符号右移(逻辑右移)
4.6 比较运算符
< > <= >=
== 和===
==:只比较值,不比较类型。(会触发隐式类型转换,比较的是转换后的结果)
===:同时比较值和类型(不会触发隐式类型转换,如果类型不同,直接返回false),也是JS独有的
!= 和 !==:比较方法和==与===一样。
条件不一定是Boolean类型,也可以是其他类型:
number类型:非0为真,0为假
string类型:''为假,非空字符串为真.
undefined和null都是假
4.7 逻辑运算符
&& 与:一假则假
|| 或:一真则真
!:非
Java:&&和返回的是true或者false
JS:
a&&b:a为真(非0),表达式的值就是b的值;a为假,表达式的值就是a的值
a||b:a为真(非0), 表达式的值就是a的值;a为假,表达式的值就是b的值
x=x||0:万一x是nu11或者undefined,就设为0,如果是其他值,就不变。
五、数组
5.1 创建数组
①使用new关键字,Array要大写
②使用字面意思创建(常用)
注意:
注意:js的数组不要求元素是相同类型。这一点和C、java等静态语言差别很大,但是python、php
等动态语言和js一样
Java中的数组:表示一组相同类型的变量
JS中的数组:批量表示一组变量,对类型相同不做要求。
5.2 获取数组元素
使用下标的方式访问数组元素(从0开始),如果下标超出范围读取元素,则结果为undefined
注意:不要给数组名直接赋值此时数组中的所有元素都没了.
相当于本来array3 是一个数组,重新赋值后变成字符串了.
java中数组取下标:下标必须在0-length-1这个范围里,超出范围,就会抛出一个数组下标越界异常
js:下标超出范围,就会得到undefined
5.3 新增数组元素
5.3.1 通过修改length新增
相当于在末尾新增元素。新增元素的默认值是undefined。
5.3.2 通过下标新增
如果下标超出范围,就会给指定位置插入新元素。
5.3.3 使用push追加元素
JS中的数组,并不是一个单纯的数组,而是一个类似于键值对结构的数据。
JS的数组,本质上是一个对象,JS作为动态语言,“一个对象在运行过程中可以动态的新增属性或者删除属性”
5.4 使用splice方法删除数组中的元素
六、函数
6.1 语法格式
同一个函数,就能支持不同类型的参数。所以在js这种动态类型语言中,不需要“泛型”这样的语法。(和泛型相比,少了一些编译期的类型检查)
6.2 参数个数(实参和形参的个数可以不匹配)
实参和形参的个数可以不匹配,但在实际开发中一般要求匹配。
实参个数 > 形参个数 多的参数不参与函数运算
实参个数 < 形参个数 多出来的形参值为undefined
6.3 函数表达式
函数是可以像一个变量一样赋值的。函数可以作为另一个函数的参数或者返回值。
七、对象
7.1 和Java中对象的区别
java:认为先有类,才有对象。类是对象的模板,得先约定好类里面有啥属性,才能实例化。类同时也表示这是一种自定义的类型。String和ArrayList是两 个不同的类,虽然他们都继承自0bject
js:对象是不依赖类存在的,js的对象是单独存在的。js中的类也是ES6开始有的之前都没有。
7.2 使用字面量创建对象(常用)
使用{}创建对象
属性和方法使用键值对的形式来组织.
键值对之间使用,分割.最后一个属性后面的,可有可无。
键和值之间使用:分割,
方法的值是一个匿名函数.
没有public、private之类的修饰,所有的属性都可以认为是public。
7.3 使用构造函数创建对象
有时候,需要批量创建出一组‘同类型’的对象,对象的属性和方法等都相同。可以使用构造函数来完成这个工作,此处的构造函数,就扮演了java中“类”这样的角色。在JS中,使用构造函数作为对象的模板。
八、JAVA和JS的区别总结
JAVA | JS | |
boolean | 布尔类型是单独的类型,不能和其他类型进行混合运算。 | 可以和其他类型混合运算,运算时,会把true隐式转为1,把false隐式转为0. |
== | 比较的是引用 | 比较的是值 |
=== | JS特有,比较的是值和类型 | |
&&和II | 返回的值是true或者false | a&&b:a为真(非0),表达式的值就是b的值;a为假,表达式的值就是a的值 |
数组 | 表示一组相同类型的变量 | 批量表示一组变量,对类型相同不做要求。 |
数组取下标 | 下标必须在0-length-1这个范围里,超出范围,就会抛出一个数组下标越界异常 | 下标超出范围,就会得到undefined |
对象 | 先有类,才有对象 | 对象是不依赖类存在的,js的对象是单独存在的 |
强弱 | 强类型 | 弱类型 |
静态动态 | 静态 | 动态 |