js介绍(1)
文章目录
一、js介绍
javaScript一般用来编写客户端脚本，来为html页面添加交互行为，是前台语言，而不是后台语言。
javaScript是一种解释性语言同时也是弱类型语言，想要引入js有以下几种方式：
html
<script>
// 方式一
</script>
html
<!--方式二-->
<script src="xxx.js"></script>js中有多行注解和单行注解两种形式：
javascript
//单行注解
/*
多行注解
*/二、变量
js中有两种变量声明的方式var和let，它们的区别会在后面的文章中介绍。
javascript
var name="abc";
let price=99;js的变量由字母、数字、下划线、$ 组成，但是不能数字开头，也不能纯数字，同时不能为保留字；js变量严格区分大小写；
三、数据类型
3.1数字类型
javascript
var x=111;
var x=1.234;
var x=3e-4;
var x=NaN;
//四舍五入，保留两位小数
var num=2.345
num.toFixed(2)
<<<'2.35'
//查看数据类型
typeof num
<<<'number'
//数字转字符串
n=num.toString()
typeof n
<<<'string'
//转为整形数字
parseInt(1.23)
parseInt('1.23')
parseInt('abc')
parseInt('123abc')
parseInt('abc123')
<<<1
<<<1
<<<NaN
<<<123
<<<NaN
//转为浮点数字
parseFloat(n)
<<<2.345
//由于js为弱类型语言，不同类型的值会被强制转换后进行计算
'1'+2
'1'-2
<<<'12'
<<<-13.2 字符串类型
javascript
var a='张三';
var b=12;
var c=String(b);
//字符串拼接
var a0='123';
var a1='456';
a0+a1
a0.concat(a1)
<<<'123456'
//字符串的长度
a.length
<<<2
//去除字符串两端空格
var d=' 123 ';
d.trim()
<<<'123'
//去除左侧/右侧空格
d.trimLeft()
d.trimRight()
//索引，超出长度不报错
var e='1234567'
e.charAt(0)
e.charAt(7)
<<<'1'
<<<''
//字符查找，找到返回索引，找不到返回-1，第二个参数表示查找的起始位置
var f='abcd'
f.indexOf('c',1)
f.indexOf('e')
<<<2
<<<-1
//切片，取头不取尾
f.substring(1,3)
f.substring(3,1)
f.substring(1,)
<<<'bc'
<<<'bc'
<<<'bcd'
f.slice(1,3)
f.slice(3,1)
f.slice(-3,-1)
f.slice(-1,-3)
<<<'bc'
<<<''
<<<'bc'
<<<''
//大小写转换
var g='aBcD';
g.toUpperCase()
g.toLowerCase()
<<<'ABCD'
<<<'abcd'
//切割，第二个参数为切割次数
var h='12gawwar';
h.split('a')
h.split('a',1)
<<< ['12g', 'ww', 'r']
<<<['12g']
//字符串模板
i=`
123
456
`
var name='张三';
j=`My name is ${name}`
<<<'My name is 张三'3.3布尔值
javascript
var a=true;
var b=false;
//查看变量的布尔值
Boolean([])
<<<true\]在js中布尔值为真，""、0、null、undefined、NaN在js中布尔值为假。
另外null表示变量的值是空，undefined则表示只声明了变量但还没有赋值或者没有返回值的函数返回内容。
### 3.4数组
```javascript
var a=[11,'12',1.23];
typeof a
<<<'object'
//长度
a.length
<<<3
//索引
a[0]
<<<11
//在末尾加入/取出元素
a0=a.push('z')
//返回数组长度
<<<4
a
<<<[11, '12', 1.23, 'z']
a1=a.pop()
<<<'z'
a
<<<[11, '12', 1.23]
//在数组头部插入/取出元素
a2=a.unshift('z')
//返回数组长度
<<<4
a
<<<['z', 11, '12', 1.23]
a3=a.shift()
<<<'z'
a
<<<[11, '12', 1.23]
//切片，取头不取尾
a.slice(1,3)
<<<['12', 1.23]
//反转数组，原数组也会反转并且返回反转后的数组
a.reverse()
<<<[1.23, '12', 11]
//数组拼接成字符串
a.join('--')
'1.23--12--11'
//数组拼接
//强行拼接会将数组中内容转为字符串后进行字符串拼接
a+a
<<<'1.23,12,111.23,12,11'
a.concat(a)
<<< [1.23, '12', 11, 1.23, '12', 11]
//数组排序
var b=[101,20,305,7]
//不传入函数sort会将数组元素转为字符串进行比较
b.sort()
<<<[101, 20, 305, 7]
//比较函数会依次比较数组中的元素，返回值>0表示x>y，以此类推，因此升序是x-y，降序是y-x
b.sort(function(x,y){return x-y})
<<<[7, 20, 101, 305]
//删除并插入元素
//从索引1位置向后删除两个元素，在向该位置插入一个元素，返回被删除的元素
b0=b.splice(1,2,1000)
<<<[20, 305]
b
<<<[101, 1000, 7]
//在数组指定位置插入n个元素
b.splice(1,0,100,200,300)
b
<<<[101, 100, 200, 300, 20, 305, 7]
//遍历数组的函数
//map与forEach的使用方法相似，但是forEach没有返回值，map会将每次执行函数的返回值放入数组中
var a=[11,22,33,44]
//v比填，表示当前元素，i选填，表示索引，arr选填，表示元素隶属的数组，"hello"可以不写，为传给this的参数
a.forEach(function(v,i,arr){
console.log(v,i,arr);
console.log(this);
},"hello")
<<<11 0 [11, 22, 33, 44] String {'hello'}
<<<22 1 [11, 22, 33, 44] String {'hello'}
<<<33 2 [11, 22, 33, 44] String {'hello'}
<<<44 3 [11, 22, 33, 44] String {'hello'}
<<