在学习前端的过程中,大多数人都感觉js很麻烦,今天我就整理了一些我所学习的js基础知识
1.循环
循环主要分为两种:先验证在循环(while, for)和循环再验证(do while)
不论是那种循环,都需要一个初始化变量
num=0;//初始化变量
while(num<5){//条件
document.write("") num++ //累加
}
for(num=0;num<5;num++){//先执行语句在循环
document.write("")
}
do while //不管条件怎样都先执行一遍
for //continue(跳过本次循环)break(跳出循环)
2.数组
1 数组:有序的数据的集合
定义数组的方法:
a:var arr=[1,2,3,4,5] 字面量表达式
b:var arr=new Array(1,3,2,5,7) 对象表达式,[]中有且只有一个数字是代表设置数组的长 度,否则就是设置数组的值
属性:
arr.lenfth 数组的长度
访问数组的值下标从0开始
访问数组最后一位 数组.length-1
数组.length=3可以改变数组长度
arr.length=0清空数组,堆中无位置
arr[]堆中有位置
arr[0]='zs'通过下标始设置值
数组的方法:
arr.push('','')//向数组末尾添加
arr.pop()//删除数组的末尾,不需要传参
arr.unshift('','')//向数组开头添加
arr.shift()//删除数组开头,不需要传参
splice(start,deletecount,newVal)//从start开始,向后删除deletecount个
splice(1,1)//从下标的第一个开始删除一个,并返回剩下的
spalice(1,2,'da')//从下标为1的地方删除2个,并放入一个新元素
splice(3)//从下标为3的地方开始删除,并返回之前的数组元素
delete obj.name //删除对象属性
delete arr[1]//清空值 位置保留
arr.reverse()//反转数组,不需传参
arr.sort()//数组排序
concat属性: var arr=[1,2,3],arr2=[2,3,4] var arr3=arr.concat(arr2)//不会改变原来的数组,会返回一个值 console.log(arr,arr2,arr3)
join属性 var arr = ['hello','word','haha'] var arr2 = arr.jion()//'hello','world','haha' var arr2=arr.jion('')//输出helloworldhaha var arr2=arr.join('-')//hello-world-haha//以什么方式连接字符串将元素结合成一个字符串
tostring属性 //可以变成字符串 var arr = ['hello','word','haha'] var arr =arr.tostring()//转换成字符串 var num=255 var num2=num.tostring(16)//把num转换成16进制参数代表进制
slice var arr = ['hello','word','haha',5] var arr2 = arr.slice()//返回原来的元素 var arr2 =arr.slice(1)//返回从下标为1的剩余的数组 var arr2 =arr.slice(1,3)//不包含结束位置,这里是3
indexOf: var arr=[1,2,3,'haha'] console.log(arr.indexOf(3))//代表返回指定参数 返回下标 console.log(arr.indexOf(3,3))//从第三位开始查找,如果未找到返回-1
深浅拷贝:
1.浅拷贝:将原对象或原数组的引用直接赋给新对象,新数组,新对象/数组只是原来对象/数组的一个引用
2.深拷贝:创建一个新的对象和数组,将原对象的各项属性的“值(数组的所有单元)拷贝过来,是“值”而不是“引用”
var arr=[1,2,3,[4,5],6]
var arr2=arr.slice()
arr[2]=666//值改变了arr2
arr[3][0]=999//两个数组都变了,arr2[3]指向一个在堆中的数组
数组拉平:
var arr=[1,2,3,[4,5,[6,7]],8]
var arr2 = arr.flat(2)//参数代表拉平的层数
数组遍历:
1.
var classRoom=['wanghe',';liaohua','wangzhengshan','qigege']
var len=classRoom.length
for(var i=0;i<len;i++){
console.log(classRoom[i])
}
2.遍历对象
var obj={
name:'qige',
age:18,
sex:'男'
}
for(var key in obj){
console.log(obj[key])
}
遍历对象//for in 会跳过稀疏数组
var arr=['香蕉',,'苹果','草莓']
for(var kry in arr){
console.log(arr[key])
}
3.遍历数组
for(var item of arr){
console.log(item);
}
//forEach map filter reduce some
arr.forEach(function(item){
console.log(item);
})
3.对象
1.数学对象:
varnum=Math
console.log(Math.PI)//圆周率
//方法
cosole.log(Math.round(2.1));//四舍五入
cosole.log(Math.round(2.6));//四舍五入
console.log(Math.floor(2.1));//向下取整
console.log(Math.ceil(2.1));//向上取整
console.log(Math.ceil(Math.random()*10));
console.log(Math.max(1,7,3));//最大值
console.log(Math.min(1,7,3));//最小值
console.log(Math.pow(8,2));//求幂 8的2次方
console.log(Math.sqrt(64));//开平方根
console.log(Math.abs(20-64));//求绝对值
console.log(Math.sign(3))//正数返回1
console.log(Math.sign(-3))//负数返回-1
console.log(Math.sign(0))//0就返回0
//随机数
Math.random()*(大-小+1)+小包含大小
//验证码
var arr=[]
for(vari=48;i<=57;i++){
arr[i-48]=String.fromCharCode(i)//编码转字符
}
for(vari=65;i<=122;i++){
arr[i-65+10]=String.fromCharCode(i)//编码转字符
}
for(vari=0;i<4;i++){
varnum=parseInt(Math.randon()*arr.length);
console.log(arr[num]);
}
2.时间对象:
var d = new Date()//获取的是本机系统时间
//无参数是获取时间,有参数是设置时间
var d = new Date(2000//年份,2//月份(月份书写时要减一),1//日,00//时,00//分,00//秒,157//毫秒)
var d = new Date(2000,1,1)//年月日
var d = new Date(2000,1)//年月
var d = new Date(2000)//毫秒数
var d = new Date('Thu Jan 01 2000 08:00:02')//字符串格式也可以
var d = new Date()
console.log(d.getFullYear());//获取年
console.log(d.getMonth()+1);//获取月
console.log(d.getDate());//获取日
console.log(d.getDay());//获取星期
console.log(d.getHours());//获取小时
console.log(d.getMinutes());//获取分钟
console.log(d.getSeconds());//获取秒
console.log(d.getTime());//获取1970年到今天
console.log(d.getMilliseconds())
var d2 = new Date(2020,07,10)
console.log(Math.abs((d2.getTime()-d,getTime())/1000/60/60/24));
var d = new Date()
console.log(d.toString())
console.log(d.toLocaleDateString())//2020/8/7
console.log(d.toLocaleString())//2020/8/7 上午11:33:49
console.log(d.toLocaleTimeString())//上午11:33:49
console.log(d.toTimeString())//11:33:49 GMT+0800(中国标准时间)
//设置时间
var d = new Date()
d.setFullYear(1999)
d.setDate(20)
console.log(d.toLocaleString())
//注意:
var d = new Date(2020,0,32)
console.log(d.toLocaleString())//日期超过当前月份天使会自动进位
3.字符串对象
3.1
属性:
var str = 'hello world'
console.log(str.length);//长度属性
console.log(str[0]);//字符串有下标
3.2
方法:
var str = 'hello world'
console.log(str.charAt(0));//返回对应位置上的字符出来
console.log(str.charCodeAt(0));//返回对应位置上的编码
console.log(String.fromCharCode(104))//返回编码上的字符
console.log(str.indexOf('e'));//查找指定字符首次出现的位置
console.log(str.indexOf('l',2))//第二个参数是搜索的起始位置
console.log(str.lastindexOf('l'))//从后向前搜索指定字符首次出现的位置
console.log(str.seach('l'));//返回指定字符首次出现的位置,可以传入正则表达式,只有一个参数
console.log(str.slice())//返回所有字符串
console.log(str.slice(2))//返回从下标为2开始的剩余字符
console.log(str.slice(2,4))//start开始下标 end结束下标(不包含在内)参数可以为负
console.log(str.substring())//参数不可以为负,与slice相同
console.log(str.substr(2,4))//与slice区别 第二个参数是长度的意思
var subStr = str.replace(查找的子串,新的值)
var subStr = str.replace('e','a')
console.log(str.toUpperCase())//转成大写
console.log(str.toLowerCase())//转成小写
document.write(str.fontsize(20))
var newStr = str.concat('你好')//拼接
console.log(newStr)
var str = prompt('请输入关键词:')
var newStr = str.trim()//去掉前后空格
var str = 'hello,world,你好'
console.log(str.split())//返回一个数组['hello,world,你好']
console.log(str.split(''))//把每个字符拆分,组成一个数组
console.log(str.split(','))//以指定字符拆分[]
console.log(str.split('o'))