文章目录
JavaScript 概述
1.1 JavaScript 是什么
- 运行环境：是一种运行在客户端（浏览器）的脚本语言。
- 解释性脚本语言：不需要编译，一行一行解析，解析一行执行一行。
- 功能：主要增加页面的交互效果。
- 面对对象和基于事件驱动的脚本语言。
- 是一种弱类型语言。
- JS区分大小写。
1.2 JavaScript 的组成
1.3 BOM(浏览器对象模型)
1.4 DOM(文档对象模型)
JavaScript 基础
2.1 JavaScript 的 使用
2.1.1 内嵌使用
JS代码写在script标签内，script标签可以写在html的任意位置
<head>
<!-- 可以写在head中 -->
<!-- 如果需要在网页预处理之前运行的脚本，写在head中 -->
<script>
script标签中遵循是JS的语法规范，不适用HTML的语法规范。
比如在script标签里面使用html标签是错误的
</script>
</head>
<body>
<!-- 可以写在body中 -->
<!-- 如果网页加载完成后才运行的脚本，写在body的最后面 -->
<script></script>
</body>
2.1.2 外部使用
<!-- 如果引入的是外部的JS文件，script标签之内的代码是无效的，一般不允许写 -->
<script src="js/index.js">
// 不要在引入外部文件的script标签内写代码，是无效的
</script>
在开发中推荐使用该方法
2.1.3 标签指定属性
<body>
<button onclick="alert('点我干嘛')"></button>
<!-- 超链接不会跳转而是弹出警告框显示括号里的内容 -->
<a href="javascript:alert('点我干嘛')">我是一个超链接</a>
</body>
2.2 JavaScript 的 Hello world
<body>
<script>
//alert() 用来在窗口弹出一个警告框
alert("Hello World");
//console.log() 用来在控制台输出一个日志
console.log("Hello World");
//document.write() 在当前页面中输出一个内容
document.write("Hello World");
</script>
</body>
document是文档的意思，在我们的网页里，一个网页就是一个文档，一个网页就是一个document，所以这里表示当前网页。write表示写，组合起来就是在当前页面写
效果：
2.3 JavaScript 基本语法
- JS中每一个语句都应该以分号（;）结尾
- 在JS中有自动添加分号机制，所以即使不写也不会报错（有可能报错）
- JS严格区分大小写
- JS会忽略多个空格和换行，所以我们可以通过空格和换行来对我们的代码进行格式化
2.3.1 注释
单行注释
双斜杠之前无效 // 只在双斜杠之后生效
跨行无效
多行注释
/*
多行注释
通过注释可以对代码进行注释说明
也可以禁止一些代码的执行
*/
2.3.2 字面量和变量
- 字面量
- 字面量就表示的是一个值，它所表示的意思就是它的字面意思
- 比如：1，2，3，“hello”，true …
- 字面量可以在 js 中直接使用，但是通常不会这么做 - 变量
- 可以用来存储字面量，一个变量可以存储任意类型的字面量
- 我们一般都是通过变量去存储字面量，而不是直接使用字面量
1.声明没有赋值
var a; //声明了一个变量
//这个时候的a的没有值的
console.log(a);
//undefined
2.没有声明变量
console.log(a);
//这个时候就会报错 a is not defined 这个a没有定义
1.变量使用步骤：
//第一步:利用var定义全局变量(会自动添加全局window对象的属性)
var a; // 创建一个变量
//var a,b,c,d; 可同时创建多个变量
//第二步：给变量赋值(初始化变量)
a = 1; // 为变量赋值
//var a=1,b=2,c=3,d=4; 可同时多个变量赋值
//第三步：使用变量
console.log(a); // 打印 a 这个变量
// 1
2.JS是一个动态类型的语言 变量是没有类型概念的
var a;
a = 1;
console.log(a); // 1
a = "哈哈"; // 字符串哈哈把1给覆盖了
console.log(a); // 哈哈
变量命名规范
- 变量可以使用短名称（比如 x和 y），也可以使用描述性更好的名称（比如 age, sum, totalvolume）
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
- 变量名称对大小写敏感（y 和 Y 是不同的变量）
- 不能为关键字
- 驼峰命名法: 第一个单词首字母小写, 后面的单词首字母大写（varAgeShu 或 var_age_shu）
//在开发中我们一般声明和赋值同时进行
var a = 33;
console.log(a);
// 33
2.3.3 标识符
所谓的标识符，就是指变量、函数、属性的名字，或者函数的参数。标识符可以是按照下列格式规则组合起来的一个或多个字符：
- 第一个字符必需是一个字母或下划线（ _ ）或一个美元符号（$）
- 其他字符可以是字母、下划线、美元符号或数字。
- 也一样遵循驼峰命名法
例子：
正确：abc_$123 abc123 $123
错误：123 abc
不能把关键字、保留字、true、false、null作为标识符，如：var true = 1;
2.3.4 数据类型
基本数据类型
- 字符串（string）
- 数值（number）
- 布尔值（Boolean）
- 空值（null）
- 未定义（undefined）
复杂数据类型
- object
字符串（string）
JS中的字符串由双引号（" "）或单引号（ ’ ’ ）表示，双引号开头必需双引号结尾，单引号开头单引号结尾。
var str = "hello"; //双引号写法
var name = '张三'; //单引号写法
var name = '李四"; //语法错误（左右引号必需匹配）
模板字符串(``)
- 使用反单引号（Tab键上面，按键1的前面）来创建模板
- 特点：
1.可以换行，并保留字符串中的格式
2.可以直接嵌入变量
特点1:
var a = ` hello
hello
hello
hello`;
特点2:
var name = "张三";
var str = `我好喜欢${name},因为他好帅！`;
任何字符串的长度都可以使用 length 属性获取
var a = "This is JS";
console.log(a.length); // 输出10; (空格也算)
在JS中我们使用反斜杠（ \ ）作为转义字符
| 字面量 | 含义 |
|---|---|
| \n | 换行 |
| \t | Tab（制表） |
| \b | 退格 |
| \r | 回车 |
| \f | 进纸 |
| \ \ | 斜杠 |
| ’ | 单引号 |
| " | 双引号 |
数值（number）
在JS中，所有数值包含整数和浮点数（小数）都属于number 类型
var num1 = 10;
var num2 = 3.5;
var num3 = 10;
var num4 ="10";
console.log(num3); //10
console.log(num4); //10
两个输出都是10,但是他们的类型不一样
/*
* typeof 运算符
* -用来检查一个值的类型
* -检查一个字符串时，会返回一个string
* -检查一个数值时，会返回一个number
* -检查一个布尔时，会返回一个boolean
* -检查一个null时，会返回 "object"
* -检查一个undefined时，会返回一个 "undefined"
*/
console.log(typeof num3); // number
console.log(typeof num4); // string
在JS中可以确保大部分的整数运算得到一个精准的结果
var num5 = 100 + 10;
console.log(num5); // 110
//如果运算的数值太大,就得不到精准的结果,会使用科学计数法
var num6 = 1254658456542565256546+10;
console.log(num6); //1.2546584565425654e+21
超过了JS的运算那么会得到一个 Infinity(正无穷)或-Infinity(负无穷),该值无法继续参与下一次的运算。
var num6 = Infinity; // 可以给变量直接赋值Infinity
console.log(typeof num6); // number Infinity也是number类型
在JS中，小数运算有可能得到一个不精准的结果
var num7 = 0.1 + 0.2;
consolelog(num7); //0.30000000000000004
所以，在JS中不要直接对精度要求特别高的运算（尤其是涉及到钱的），尽量放在后台算。
var num9 = 10 - "hello";
console.log(num9); // NaN
//NaN（Not a Number）非数值,避免出现。
var num10 = NaN;
console.log(typeof num10); //number
布尔值（Boolean）
布尔值用来进行逻辑判断
// 布尔值只有两个值：true(真)和false(假)
var a = true;
var b = false;
conso.log(a); //true
conso.log(b); //false
conso.log(typeof a); //boolean
//使用typeof检查一个布尔值后返回 boolean
null
null 通常表示一个空的对象，一个不存在的东西
null 类型只有一个值 就是 null
//使用typeof检查一个null后返回 "object"
var a = null;
console.log(typeof a); // "object"
undefined
表示未定义，当我们定义一个变量但是不赋值是它就是undefined。
var a;
console.log(a); // undefined
console.log(typeof a); // "undefined"
//使用typeof检查一个undefined后返回 "undefined"
当你想把一个值设为空时
var a = null; //可以这样使用
var a = undefined; //不要这样做
var a = NaN; //不要这样做
123
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
