[JavaScript知识库]javascript学习笔记

JS基础

一、javascript组成

? ? ? ? 1.ECMAScript

? ? ? ? 2.DOM? ? ? ?指文档（html标签的内容）

? ? ? ? 3.BOM? ? ? ? 游览器

注意点：

? ? ? ? ①.可以有多个script标签，多个script标签是自上而下顺序执行

? ? ? ? ②.一个script标签只能专心的做一件事

向页面中输出内容：

? ? ? ? 1.document.write('这是一些内容')；

? ? ? ? <script>

? ? ? ? ? ? ? ? document.write('<h1>Hello Word </h1>')

? ? ? ? </script>

这将会直接显示Hello Word为标题1字体大小

<script>

? ? ? ? ? ? ? ? document.write('&lt;?h1&gt;??Hello?Word?&lt;?/h1&gt;')

? </script>

通过转义符将会在游览器显示为<h1>Hello Word </h1>

? ? ? ? 2.alert('这是一些内容'); ????????在页面上弹出警告框

? ? ? ? 3. console.log('这是一些内容');? ? ? ? 在游览器调试面板控制台输出内容

二、常量和变量

? ? ? ? 常量：值不可以改变的叫做常量

? ? ? ? 数据类型：

? ? ? ? ? ? ? ? 基本数据类型

? ? ? ? ? ? ? ? ? ? ? ? 数字

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 类型：number

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 例子：100、-20、3.14

? ? ? ? ? ? ? ? ? ? ? ? 布尔值

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 类型：boolean

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 例子：ture、false

? ? ? ? ? ? ? ? ? ? ? ? 字符串

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 类型：所有带双引号和单引号的都叫字符串（必须成对出现，单引号和双引号没区别）

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 例子："100"、"Hello"

? ? ? ? ? ? ? ? 复合/引用数据类型

? ? ? ? ? ? ? ? 特殊数据类型：

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? null：空

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? undefined：表一种状态（未定义）

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? NaN（not a number）

? ? ? ? 变量：值可以被修改的叫做变量? ? ? ?

? ? ? ? ? ? ? ? 1.声明变量（必须声明以后才能使用）?

? ? ? ? ? ? ? ? ? ? ? ? 关键字（系统征用的有特殊功能的单词叫做关键字）：var? 声明变量

? ? ? ? ? ? ? ? var num = 10;

????????????????alert(num) ;

? ? ? ? ? ? ? ? ?2. 初始化：声明变量的时候，直接给这个变量赋值叫做初始化。

? ? ? ? ? ? ? ? ?3.如果我们声明变量的时候，没有值赋给这个变量，系统默认值为undefined。

? ? ? ? ? ? ? ? ?4.提高整个程序运行的效率，我们可以将声明变量，没有值赋值给这个变量的时候，我们可以设置为null

? ? ? ? 变量命名：

? ? ? ? ? ? ? ? 标识符: 所有用户自定义的名字叫做标识符（变量名也是标识符）

? ? ? ? ? ? ? ? 命名规则：

? ? ? ? ? ? ? ? ? ? ? ? 1.只能由数字、字母、下划线和美元符号（💲）组成

? ? ? ? ? ? ? ? ? ? ? ? 2.不能以数字开头

? ? ? ? ? ? ? ? ? ? ? ? 3.不能使用保留字和关键字

? ? ? ? ? ? ? ? ? ? ? ? 4.大小写敏感 age Age这是两个完全不同的变量

? ? ? ? ? ? ? ? ? ? ? ? 5.见名思意（尽量用英文全称）

? ? ? ? ? ? ? ? ? ? ? ? 3.如果命名变量时单词个数超过2个以上时：

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ①驼峰命名法：className

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ②用下划线隔开：class_name

? ? ? ? ? ? ? ? ? ? ? ? 关键字

???????????????????????????????????typeof

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 格式：typeof 常量/变量

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 功能：输出当前常量或者变量的数据类型

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 例子：alert（typeof "Hello"); 为string（字符串类型）

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 注：alert(typeof typeof 100);为string（字符串类型）

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 先通过typeof判断100为number类型，再通过typeof判断number的类型是字符串

????????????????????????????????

三、运算符

? ? ? ? 运算符：

? ? ? ? ? ? ? ? 1.算术运算符? ? ? ? + - * / %（取余运算符）

? ? ? ? ? ? ? ? 2.关系运算符? ? ? ? > < >= <= == != === !==

? ? ? ? ? ? ? ? 3.逻辑运算符? ? ? ? && || ！

? ? ? ? ? ? ? ? 4.一元运算符? ? ? ? ?++ --

? ? ? ? ? ? ? ? ? ? ? ? a++

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 值：++后置，先取a的值作为a++表达式的值，然后再对a进行+1

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 功能：对原有的变量进行+1操作

? ? ? ? ? ? ? ? ? ? ? ? ++a

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 值：++前置，先对a进行+1，再取a的值作为a++表达式的值

????????????????????????????????功能：对原有的变量进行+1操作

? ? ? ? ? ? ? ? ? ? ? ? a--

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 值：--后置，先取a的值作为a--表达式的值，然后再对a进行-1.

????????????????????????????????功能：对原有的变量进行-1操作

????????????????????????

? ? ? ? ? ? ? ? ? ? ? ? --a

? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 值：--后置，先对a进行-1，再取a的值作为a--表达式的值

????????????????????????????????功能：对原有的变量进行-1操作

? ? ? ? ? ? ? ? 5.赋值运算符

? ? ? ? ? ? ? ? ? ? ? ? ①基本赋值运算符 =

? ? ? ? ? ? ? ? ? ? ? ? ②复合赋值运算符 += -=...x=

? ? ? ? 注：

? ? ? ? ? ? ? ? ①将不同数据类型进行算术运算

? ? ? ? ? ? ? ? 自动数据类型转换：不同数据类型直接是没有办法进行运算 ，将数据转成同一数据类型，再进行计算。

? ? ? ? ? ? ? ? 1.其中有一个字符必须是字符串，运算符必须是＋号，别的数据类型会转成字符串，进行字符串拼接。

alert("Hello" + 100);    显示为Hell100
alert("Hello" + "Word");    显示为HelloWord

? ? ? ? ? ? ? ? ?2.任何数据和字符串做+加法以外的操作，那么字符串先转换为数字再去进行运算

? ? ? ? ? ? ? ? ? ? ? ? ①如果字符串是一个纯数字字符组成的字符串，转成对应的数字。

? ? ? ? ? ? ? ? ? ? ? ? ②如果字符串不是一个纯数字字符组成的字符串，转成NaN,NaN和任何数据运算都是NaN（除了和字符串拼接）

alert(100 - "20");    显示为80
alert(100 - "20a");    显示为NaN

? ? ? ? ? ? ? ? 3.除字符串以外的数据，在进行算术运算的时候，先转成数字，再进行运算。

alert(10 - null);    显示为10（null//0）
alert(10 - undefined);    显示为NaN（undefined//NaN）