一、javascript组成
- 核心（ECMAScript）
ECMAScript规定了JS基础语法核心知识，比如：
语法
类型
语句
关键字
保留字
操作符
全局对象
- 文档对象模型（DOM）
使用 DOM API 可以轻松地删除、添加、替换、修改节点
- 浏览器对象模型（BOM）
弹出新浏览器窗口的能力；
移动、缩放和关闭浏览器窗口的能力；
navigator 对象，提供关于浏览器的详尽信息；
location 对象，提供浏览器加载页面的详尽信息；
screen 对象，提供关于用户屏幕分辨率的详尽信息；
performance 对象，提供浏览器内存占用、导航行为和时间统计的详尽信息；
对 cookie 的支持；
其他自定义对象，如 XMLHttpRequest 和 IE 的 ActiveXObject。
二、标签位置
- 内部javascript
<button onclick="alert('hangnei')">点我一下</button>
<script>
//在此编写代码
</script>
- 外部javascript
<script src="./index.js"></script>
如果应用外部的JS文件同时在< script >标签中写了代码，那么< script >标签中的代码是不会被执行的，举个例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="../js/app.js">
console.log('我是内部的JS文件')
</script>
</body>
</html>
三、注释
注释分为两大类
1、单行注释以两个斜杠字符开头，如：
// 单行注释
2、块注释以一个斜杠和一个星号（/ *）开头，以它们的反向组合（ * /）结尾
/* 这是多行注释 */
四、语法
1、输出语句
- douument.write（可以向body标签内插入内容，能识别html标签语义）
document.write('你好')
document.write('你好 <h1>我很好</h1>')
- alert（页面弹出提示框或者警告框）
alert('你好')
- console.log（控制台输出语法，调试时使用得多）
console.log('你好')
2、输入语句
- prompt（显示一个对话框，框中包含一条文字 提示用户输入的文字）
prompt('请输入内容')
五、字面量
[ ] 代表的是数组的字面量
{ } 代表的是对象的字面量
六、变量
3 个关键字可以声明变量：var、const 和 let，
var 在ECMAScript 的所有版本中都可以使用，而 const 和 let 只能在 ECMAScript 6 及更晚的版本中使用
要想使用变量，首先得先创建一个变量，声明变量由两部分组成：关键字、变量名（标识符）
let 变量名
举个例子：
首先声明一个name变量，给name这个变量用赋值号" = "赋值， " = " 右边为字符串
let name = '金小子'
//通过变量名来获取变量里面的数据
console.log = name
- 更新变量
变量赋值后还可以再给他一个新的值来更新他，一次只能存一个值
//声明变量name并赋值为'金小子'
let name = ' 金小子 '
// 变量name中数据改为' 小吒 '
name = ' 小吒 '
- 声明多个变量
多个变量之间用逗号隔开
let name,age
name = ' 小吒 '
age = 18
// 可以进行同时声明及赋值 （不推荐）
let name = ' 小吒 ', age = 18
// 为了更好的可读性，请一行只声明一个变量
let name = ' 小吒 '
let age = 18
这里就不一一介绍var 、const的使用了 有不会的可以私信问博主啦！
七、变量命名规则
- 关键字及保留字
有特殊含义的字符，例如：let 、var、if、for、function等
- 变量组成
只能用下划线、字母、数字 、$组成 且不能以数字开头
八、数据类型
- number
在JS中Number类型包含了整数、小数、正数、负数全部使用Number类型，举个例子：
let n=1
let m=1.23
算数运算符：+加（求和）、-减（求差）、*乘（求积）、/ 除（求商）、%取余（又叫取模）等，所以Number类型经常和算数一起使用，举个例子
console.log( 1 +1 )//2
console.log( 1 -1 )//0
console.log( 1 *1 )//1
console.log( 1 / 1 )//1
console.log( 5 % 2 )//1
运算规则：先乘除后加减有括号先算括号里面的
- NaN
NaN（Not a number）代表一个计算错误，它是一个不正确的或者一个未定义的数学所得的结果，举个例子
console.log('金小子' - 1) //NaN
NaN是粘性的，任何有关于NaN的操作都会返回NaN
console.log(NaN + 1) //NaN
console.log(NaN - 1) //NaN
- String
- 字符串基础
通过单引号（‘’）、双引号（“”）、反引号（``）包裹的数据都叫做字符串，单引号和双引号没有区别，因此推荐使用单引号
console.log('金小子' )
console.log("金小子" )
console.log(`金小子` )
引号使用注意：1、无论是哪一种引号必须成对出现、2、单引号/双引号可以互相嵌套，如果外面是单引号里面就得使用双引号外面是双引号里面就得使用单引号、3、可以通过转义字符()进行转义
console.log('你好，'金小子·)//报错
console.log('hello，\'金小子\'')// 当看到了\就不会把\后面的字符进行编译了而是原模原样的输出了 结果就是:hello，'金小子·
- 字符串拼接
加号（+）运算符可以实现字符串拼接
遵循规则一般是：数字相加，字符相连
console.log(1+2)//3
console.log('熊大' + ‘熊二’)
let age=18
console.log('我是金小子,今年'+ age +'岁')
以上的字符串和变量的拼接方式容易出现问题且不便于理解
- 超级字符串
超级字符串又叫模板字符串，可以使用反引号(、)结合$包住变量实现，字符串和变量的拼接
let name ='金小子'
let age = 18
console.log(`我叫${name}，今年我${age}岁了!、)
- Boolean
布尔类型，表示肯定或否定在计算机中对应的类型就叫做布尔类型，它有两个固定的值true和false，表示肯定的数据用true(真)，表示否定的数据用false(假)
let isFlag =true
console.log(isFlag)
- Undefined
Undefined 类型只有一个值，就是特殊值 undefined。当使用 var 或 let 声明了变量但没有初始化时，就相当于给变量赋予了 undefined 值：
let message;
console.log(message == undefined); // true
在这个例子中，变量 message 在声明的时候并未初始化。而在比较它和 undefined 的字面值时，两者是相等的。这个例子等同于如下示例：
let message=undefined;
console.log(message == undefined); // true
这里，变量 message 显式地以 undefined 来初始化。但这是不必要的,因为默认情况下，任何未经初始化的变量都会取得 undefined 值。
- Null
JavaScript中的nul仅仅是一个代表“无”、“空”或“值未知”的特殊值
let name = null
console.log(name)
- Symbol
ES6 引入了一种新的原始(基本)数据类型 Symbol表示独一无二的值，最大的用法是用来定义对象的唯一属性名
let sy= Symbol("key1");
// 写法1
NM寸Llet syobject ={};syObject[sy]=“mm";console.log(syObject[sy]);//"mm"
// 写法2
let syobject ={[sy]:"mm"
9
10
};console.log(syobject);//{Symbol(key1):"mm"}
- bigint
BigInt 类型是 JavaScript 中的一个基础的数值类型，可以用任意精度表示整数。使用 BigInt，您可以安全地存储和操作大整数，甚至可以超过数BigInt 数据类型的目的是比 Number 数据类型支持的字的安全整数限制。范围更大的整数值，使用 BigInt ，整数溢出将不再是问题。此外，可以安全地使用更加准确时间戳，大整数 ID 等，而无需使用变通方法。BigInt是通过在整数未尾附加 n或调用构造函数来创建的。
//创建BigInt的方法，第一种:只需在整数的末尾追加n即可
let m1 = 7n;
//第二种:BigInt()构造函数
let m2 = BigInt(7);
// 这俩货是相等的
console.log(m1 === m2);// true
使用typeof测试时，BigInt返回"bigint"
let ml = 7n;
console.log(typeof m1)// bigint
let m2 = BigInt(7);
console.log(typeof m2)//bigint
- 数组
数组是一种将一组数据存储在单个变量名下的一种数据类型
let arr =[]// arr叫做变量 []数组字面量（一看到[]就知道是一个数组类型）
let arr =['乐迪'，'小爱'，'多多"]
console.log(arr)
在JS中这些数组的编号从0开始，例如 乐迪 - 0，小爱 - 1，多多 - 2，其次这些编号有个更加专业的名字叫做下标或索引
数组中可以存储任意类型的数据不仅仅限于以上例子中的字符串
let arr=['乐迪',123123]
console.log(arr)
数组中的专业术语
1.元素指的是数组中保存的每一个数据叫做数组的元素
金小子’、’小爱’等就是元素
2.下标指的是数组中数据的编号
金小子’、’小爱’对应的编号就是下标
3.长度指的是数组中元素的数量，可以通过变量名.length 获取数组中:
let arr = [‘乐迪’，‘小爱’,‘花花’]
console.log(arr.length)
九、typeof操作符
对一个值使用 typeof 操作符会返回下列字符串之一：
"undefined"表示值未定义；
"boolean"表示值为布尔值；
"string"表示值为字符串；
"number"表示值为数值；
"object"表示值为对象（而不是函数）或 null；
"function"表示值为函数；
"symbol"表示值为符号。
下面是使用 typeof 操作符的例子：
let message = “some string”;
console.log(typeof message); // “string”
console.log(typeof(message)); // “string”
console.log(typeof 95); // “number”
十、数据类型转换
- 隐式类型转换
+号两边只要有一个字符串，就会把另一个也转成字符串2，举个例子：
console.log('你好' + 123)//你好123
console.log(123+'4')//1234
除了+号以外的算数运算符比如，-、*、/、%等都会把数据转成数字类型
console.log(123-'4')// 119
console.log(123-'123')//0
console.log(123/'123')// 1
console.log(123*'2')//1
小技巧：
1.+作为正号解析可以把数据转为数字类型
console.log(+'123')//123
console.log(+123)
2.任何数据和字符串相加都是字符串
- 显示类型转换
- Number（转为数字类型）
let str ='123
console.log(Number(str))//123
let str ='金小子console.log(Number(str))// NaN这样当然是不行的，本身就不是一个数字
let baseSalary = prompt('请输入你的基本工资')let bonus = prompt('请输入你的奖金')console.log(`这个月你的工资一共是:${Number(baseSalary)+Number(bonus)})//12000结果就正确了
- ParseInt（转为数字,但是保留整数部分的数字）
console.log(ParseInt('123px'))//123
console.log(ParseInt('3.14px'))//3
- ParseFloat（转为数字,可以保留小数部分）
console.log(ParseFloat('123px'))//123
console.log(ParseFloat('3.14px'))//3.14
小伙伴们快来思考一下这个题吧，我们下一章再讲解
案例：
需求：用户输入商品名称、商品价格、商品数量、收货地址，实现自动打印订单信息
思路分析：
1.需要输入三个数据，所以需要三个变量来存储对应的数据price、count、address
2.还需要计算总价，total
3.页面打印生成表格，里面填充数据即可
扫一扫
5093
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
