前端学习第三天笔记 JavaScript JavaScript的引入 数据类型 运算符 条件语句 字符串
这里写自定义目录标题
- JavaScript
- JavaScript引入到文件
- 嵌入到HTML文件中
- 引入本地独立js文件
- 引入网络来源文件
- JavaScript的注释方式
- 嵌入在HTML文件中的注释
- JavaScript的输出方式
- 数据类型
- 原始类型（基础类型）
- 合成类型（复合类型）
- 运算符
- typeof运算符
- 算术运算符
- 赋值运算符
- 比较运算符
- 布尔运算符
- 条件语句
- if语句
- if-else条件语句
- Switch语句
- 三元运算符
- 字符串
- length属性
- 字符串方法：charAt()
- 字符串方法：concat()
- concat和+的区别
- 字符串方法：substring()
- 字符串方法：substr()
- 字符串方法：indexOf()
- 字符串方法：trim()
- 字符串方法：split()
JavaScript
JavaScript引入到文件
嵌入到HTML文件中
<body><script>var age = 20;</script>
</body>
引入本地独立js文件
<body><script type="text/javascript" src="./hello.js"
</body>
引入网络来源文件
<body><script scr="https://xxxxxxxxxxxxxxxxxxxxxxxxxxxx"></script>
</body>
JavaScript的注释方式
- 单行：//
- 多行：/* 内容*/
嵌入在HTML文件中的注释
<!-- 注释 -->
温馨提示
注释快捷键：ctrl+/
JavaScript的输出方式
数据类型
- JavaScript的数据类型一共有6种，分别是：数值、字符串、布尔值、null、undefined、对象
- ES6又新增了两种数据类型，分别是：Symbol类型的值和BigInt类型
原始类型（基础类型）
- 数值、字符串、布尔值
合成类型（复合类型）
- 对象：因为一个对象往往是多个原始类型的值的合成，可以看作是一个存放各种值的容器
var user{name:"复合类型",age:20,learn:true
}
运算符
typeof运算符
- 用来判断一个变量的类型
var num = 20;
console.log(typeof num);
//会打印“number”
算术运算符
赋值运算符
比较运算符
布尔运算符
条件语句
if语句
if-else条件语句
Switch语句
三元运算符
字符串
- 可以单引号嵌套双引号，也可以双引号嵌套单引号，但是注意不可以双引号中嵌套双引号，单引号中嵌套单引号。
- 如果要在单引号字符串的内部，使用单引号，就必须在内部的单引号前面加上反斜杠，用来转义，双引号字符串内部使用双引号，也是如此。
var str = "我们知道\"阅读\"是很重要的";
- 字符串默认只能一行显示，如果要换行，需要转义。
length属性
- length属性返回字符串的长度，该属性也是无法改变的。
- 注意：length后不用加小括号
var str = '123456';
console.log(str.length)
//会打印出来6
字符串方法：charAt()
charAt方法返回指定位置的字符，参数是从0开始编号的。- 如果参数为负数，或者大于等于字符串的长度,
charAt返回空字符串。
字符串方法：concat()
concat方法用于连接两个字符串，返回一个新的字符串，不改变原字符串。- 该方法可以接收多个参数
<script>
var str1 = "hello";
var str2 = "world";
var str3 = "!";
console.log(str1.concat(str2,str3));
//会打印出"helloworld!"
</script>
- 做字符串相加时，是不需要使用concat的，可以使用+连接字符串。
concat和+的区别
concat不管什么类型直接合并成字符串+是遇到数字类型直接做运算，遇到字符串和字符串相连接。
字符串方法：substring()
substring方法用于从原字符串取出子字符串并返回，不改变原字符串，它的第一个参数表示子字符串的开始位置，第二个位置表示结束位置（返回结果不含该位置）- (左闭右开区间)
- 如果省略第二个参数，则表示子字符串一直到原字符串的结束。
- 如果第一个参数大于第二个参数，
substring方法会自动更换两个参数的位置
"itbaizhan".substring(8,2);
//等同于
"itbaizhan".substring(2,8);
- 如果参数是负数，
substring方法会自动将负数转为0
字符串方法：substr()
substr方法用于从原字符串取出子字符串并返回，不改变原字符串，跟substring方法的作用相同substr方法的第一个参数是子字符串的开始位置（从0开始计算），第二个参数是子字符串的长度。
"itbaizhan".substr(2,7)//baizhan
- 如果省略第二个参数，则表示子字符串一直到原字符串的结束
"itbaizhan".substr(2)//baizhan
- 如果第一个参数是负数，表示倒数计算的字符位置，如果第二个参数是负数，将被自动转为0，因此会返回空字符串。
"itbaizhan".substr(-7)//baizhan
"itbaizhan".substr(4,-1)//""
字符串方法：indexOf()
indexOf方法用于确定一个字符串在另一个字符串中第一次出现的位置，返回结果是匹配开始的位置，如果返回-1，就表示不匹配。indexOf方法还可以接受第二个参数，表示从该位置开始向后匹配。
字符串方法：trim()
trim方法用于去除字符串两端的空格，返回一个新字符串，不改变原字符串- 该方法去掉的不仅仅是空格，还包括制表符（\t, \v）、换行符（\n）和回车符（\r）。
trim方法不能去掉字符串中间的空格！！！！
- ES6扩展方法，
trimEnd()和trimStart()方法 trimEnd()：去掉字符串尾部空格。trimStart()：去掉字符串头部空格。
字符串方法：split()
split方法按照给定规则分割字符串，返回一个由分割出来的子字符串组成的数组。- 如果分割规则为空字符串，则返回数组的成员是原字符串的每一个字符。
'a|b|c'.split("")//["a","|","b","|","c"]
- 如果省略参数，则返回数组的唯一成员就是原字符串
'it|sxt|bz'.split()//[it|sxt|bz]
split方法还可以接受第二个参数，限定返回数组的最大成员数。
