对象
JavaScript 中的所有事物都是对象:字符串、数字、数组、日期,等等。 在 JavaScript 中,对象是拥有属性和方法的数据。
属性是与对象相关的值。
方法是能够在对象上执行的动作。.关键词()
举例:汽车就是现实生活中的对象。
汽车的属性: car.name=Fiat 名称 car.model=500 型号 car.weight=850kg 重量 car.color=white 颜色
汽车的方法: car.start() 启动 car.drive() 驾驶 car.brake() 刹车
Object对象
创建对象
var 对象名称=new Object();
设置对象属性
对象名称.属性名=值;
设置对象方法
对象名称.方法名=function(){ }
调用对象属性
对象名称.属性名
调用对象方法
对象名称.方法名()
String对象
创建String对象
var strOb = new String(“abcefg”); var strOb = String(“abcefg”); var strOb = “abcefg”;
属性
length (字符串长度)
方法
-
子字符串位置 indexOf(string,[index]) //返回子字符串abc在字符串中第一次出现的位置(从0开始计算),不存在返回-1
string : 查找的字符串的内容,必填项
index:开始查找位置,可有可无
返回值:返回值是查找到的子字符串的位置(下标),默认情况下,返回的是第一个被查找到的内容;如果被查找的内容不存在,则返回-1
-
lastIndexOf(string,[index]) //返回子字符串abc在字符串中最后一次出现的位置
string :子字符串,查找的字符串的内容,必填项
index:开始查找位置,可有可无
返回值:返回值是查找到的子字符串的位置(下标),默认情况下,返回的是第一个被查找到的内容;如果被查找的内容不存在,则返回-1
// 案例:查找 afgdtywgbfnjekagrn 字符串中有多少次 g
var str = new String('afgdtywgbfnjekagrn');
var index = str.indexOf('g'); // 2
// 统计次数
var num = 0;
while(index !== -1){ // 查找
num++;
index = str.indexOf('g',index + 1);
}
console.log('g一共出现了'+num+'次');
-
截取 substr(起始位置,[截取长度]) //截取不写则代 表截取到字符串未尾
起始位置:可以自定义,从0开始
截取长度:可以是一个数字,还可以不写;如果不写长度,表示截取到字符串的末尾
返回值:截取出来的字符串
substring(起始位置,[结束位置]) //不包括截取结果的右边界字符
起始位置:是一个下标值,不能为负值
结束位置:是一个下标值,不能为负值
不包括截取结果的右边界字符
// 需求:判断图片是什么类型; 照片的格式必须是 png/jpg txt // 获取文件名的后缀 - 后缀名开始的下标 - lastIndexOf / substr function getSuffix(){ var file = document.getElementById('files'); var pic = file.value;// 图片的路径 // var pic = '.././images/banner/one.txt'; var suffix = pic.substr(pic.lastIndexOf('.')+1); if(suffix=='png'||suffix=='pneg'||suffix=='jpg'||suffix=='jpeg'){ alert('图片格式正确'); }else{ alert('格式不正确!'); } } -
替换 replace('子字符串1','子字符串2') //将字符串中子字符串1替换为子字符串2
var str='My name is apple. So I like to eat apple very much!';
alert(str.replace('apple','banana'));
alert(str.replace(/apple/g,'banana'));
-
获取指定位置的字符
charAt(n) 默认为第一个字符
n 表示的是下标,范围是 0-正无穷,不能使用负值
-
获取指定字符的ASCII编码 str.charCodeAt()
var str1 = 'helloworld'; var getStr1 = str1.charCodeAt(2); console.log(getStr1); -
转换大小写 toLowerCase() toUpperCase()
-
将字符串分割为数组 split(分割符)
分隔符:是一个字符串类型 或者是 正则表达式
返回值:数组
-
显示字符串效果 bold()加粗 italics()斜体 strike()删除 fontcolor('#f00') fontsize(1-7) sup() sub()
var oFont = document.getElementById('font'); var val = oFont.innerText; oFont.innerHTML = val.big().fontcolor('red').strike().fontsize(18); // oFont.innerHTML = val.sub() console.log(val.sub()); -
设为超链接 link(url)
Date对象
创建Date对象
var dateObj=new Date();
方法
1. 将日期转为字符串
toLocaleString()
toLocaleDateString()
toLocaleTimeString()
2. 获取年、月、日、小时、分、秒
getYear() //两位的年(2000年前)或三位的年[1900]
getFullYear() //四位的年
getMonth() //月份+1
getDate() //日
getHours() //小时
getMinutes() //分钟
getSeconds() //秒
getTime() //1970 年 1 月 1 日至今的毫秒数
3. 定时器
setInterval(函数体,时间(毫秒),参数(传递给函数的参数))
// 时间跳动案例
function getT(){
// 获取时间
var d = new Date();
var year = d.getFullYear();
var month = d.getMonth()+1;
var day = d.getDate();
var h = d.getHours();
var m = d.getMinutes();
var s = d.getSeconds();
var ms = d.getMilliseconds();
var oTime = document.getElementById('times');
oTime.innerHTML = year+'-'+month+'-'+day+' '+h+':'+m+':'+s+' '+ms;
}
function stop(){
// 清除某个定时器 clearInterval(定时器的名称);
clearInterval(myTime);
}
-
怎么计算时间差
使用时间戳计算时间差
2021-9-5 10:30:20 -> 1630809020000
2020-8-9 12:30:45 -> 1596947445000
差多少年,天,小时,分钟,秒钟
时间戳 参照时间: 1970/1/1 0:0:0(格林威治时间)
1970/1/1 8:0:0(北京时间)
时间戳:d.getTime(); 单位是毫秒数
var aTime = new Date('2021-9-5 10:30:20'); // 指定的某个时间 var bTime = new Date('2021-8-5 8:20:10'); // var cha = aTime.getTime() - bTime.getTime(); if(cha<=0){ console.log('时间输入有误!'); }else{ var miao = cha / 1000; // 秒的单位 var s = miao % 60; // 秒 var fen = parseInt(miao / 60); // 分钟的单位 var m = fen%60;// 分钟 var hour = parseInt(fen / 60); // 小时的单位 var h = hour % 24; // 小时 var day = parseInt(hour / 24); // 天 var d = day % 365; var y = parseInt(day/365); // 年 console.log('两个时间相差:'+y+'年,'+d+'天,'+h+'小时,'+m+'分钟,'+s+'秒钟'); } -
设置时间
- 直接设置年月日,时分秒
new Date() 获取当前时间
new Date(字符串 / 时间戳 / 值); 获取指定时间
字符串:"2021-2-3 12:23:34"
时间戳:1617589820000
值: 2012,5,6,12,30,00
2. 简单设置时间
set.... [用的不多]
setMonth();
setDate();
setFullYear();
Array对象
创建数组对象
var arrOb=new Array(值,........) var arrOb=Array(值,.......) var arrOb=[值,.........] var arrOb=new Array(n); arrOb[0]=值1; arrOb[1]=值2; .......
属性
length //数组中元素的数目
方法
-
转为字符串 toString() //将数组转换为字符串,以逗号连接 join('连接符') //将数组元素连接成字符串
// 练习:写一个函数对传入的字符串中每个单词的首字母大写 输入capitalize('the quick brown fox'); 返回The Quick Brown Fox function capitalize(str){ var arrStr = str.toLowerCase().split(' '); for(var i=0;i<arrStr.length;i++){ arrStr[i] = arrStr[i].replace(arrStr[i][0],arrStr[i][0].toUpperCase()); } // console.log(arrStr); // 数组 return arrStr.join(' '); } var getStr = capitalize('heLLo woRld xiaoMing'); console.log(getStr); -
连接多个数组,返回新数组 concat(数组1,数组2,.......) //连接多个数组返回新数组
-
追加元素,并返回新数组长度 unshift(value,......) //头部追加
push(value,......) //尾部追加
-
删除元素并返回该元素 shift() //删除第一个元素
pop() //删除最后一个元素
-
删除元素或删除并插入新元素 splice(开始位置,长度,新内容1,新内容2....新内容n) //返回包括删除元素的数组
-
将数组元素升序排序 sort(回调函数)
-
颠倒数组中的元素 reverse()
案例:随机返回1-100的随机数,值不能重复
var arr=[];
for(var i=0;i<10;i++){
var num=Math.floor(Math.random()*100);
arr.push(num);
}
// 案例:要求将数组中的0项去掉
var arr = [4, 0, 7, 9, 0, 0, 2, 6, 0, 3, 1, 0];
深拷贝浅拷贝
思考:
var arr=[1,2,3,4];
arr1 = arr;
arr[1] = 'hello';
console.log(arr);
console.log(arr1);
参考资料:
Math对象
Math对象属于Javascript内置对象,无需实例化,可以直接使用
属性
Math.PI
方法
Math.round(number) //四舍五入整数 Math.ceil(number) //向上取整 Math.floor(number) //向下取整 Math.random() //随机返回0.0~1.0之间的数 Math.max(x,y) //求最大值 Math.min(x,y) //求最小值 Math.pow(x,y) //求xy
获取指定范围的随机数
Math.floor(Math.random()*(max-min+1))+min
Global对象
Global对象是ECMAscript中最特别的对象,因为它根本不存在。说它不存在是因为在ECMAscript中,不存在独立的函数,所有函数都必须是某个对象的方法。
例如isNaN(),isFinite(),parseInt()和parseFloat()等,都是Global对象的方法
- 编码函数escape()
- 解码函数unescaoe()
- 求值函数eval()
- 检查某个值是否为数字isNaN