对象就是拥有一组属性和方法的集合
如果 a.b ,那么a就是对象,b是a的属性
如果 a.c(),那么a就是对象,c是a的方法
定义对象有两种方式:1.采用字面量赋值方式直接定义。2.采用构造函数的方式new一个对象
1.采用字面量赋值方式定义对象
let stu1 = {
//属性名:属性值的方式,定义属性
no:1001,
name:'张三',
age:20,
sex:'男',
//定义学生的方法
study:function(){
console.log('每天学习8小时');
},
play:function(){
console.log('每天玩8小时');
}
}
console.log(stu1);
//调用对象身上的属性
console.log(stu1.name);
console.log(stu1.age);
//调用对象身上的方法
stu1.study()
stu1.play()
2.案例:使用对象制作计算器
//定义一个计算器对象
let calc={
//定义计算器的属性
num1:0,
num2:0,
//定义计算器的方法
jia:function(){
//在对象的方法中,获取对象的其它成员,要通过this
console.log(`${this.num1}+${this.num2}=${this.num1+this.num2}`);
},
//在SE6中,对象的方法,也可以采用下面的方式
jian(){
console.log(`${this.num1}-${this.num2}=${this.num1-this.num2}`);
},
cheng(){
console.log(`${this.num1}*${this.num2}=${this.num1*this.num2}`);
},
chu(){
console.log(`${this.num1}/${this.num2}=${this.num1/this.num2}`);
}
}
//给计算器对象的两个属性赋值
calc.num1 = 200
calc.num2 = 20
calc.jia()
calc.jian()
calc.cheng()
calc.chu()
3.采用构造函数的方式new一个对象
// 构造函数:首先是个函数,这个函数用来创建出对象
// 如果使用构造函数创建出对象:使用new关键字。
// 可以使用系统构造函数Object创建一个对象。效果等同于{}
let obj1 = new Object()
console.log(obj1);
let obj2 = {}
console.log(obj2);
console.log('---------------------');
// 多数情况下,都是先自定义一个构造函数,再通过自定义的构造函数创建出对应的对象
// 可以将构造函数理解成:类
function Student(no,name,age,sex){
//这里的this,用于给构造函数定义成员
this.no = no
this.age = age
this.name = name
this.sex = sex
this.sayHi = function(){
console.log(`大家好!我叫${this.name}`);
}
}
//通过类(构造函数)可以创建出无数个对象
let s1 = new Student(1001,'张三',20,'男')
console.log(s1);
let s2 = new Student(1002,'李四',22,'女')
console.log(s2);
let s3 = new Student(1003,'王五',24,'男')
console.log(s3);
s3.sayHi()
4.构造函数练习1
// 定义一个棋子构造函数(类)
function Chess(name, color, x, y) {
//定义属性
this.name = name
this.color = color
this.x = x
this.y = y
//定义方法
//显示当前位置的方法
this.show = function () {
console.log(`${this.color}${this.name},当前位置是X:${this.x} Y:${this.y}`);
}
//移动棋子的方法
this.move = function (x, y) {
this.x = x
this.y = y
//位置更新后,重新调用显示当前位置的方法
this.show()
}
}
// 创建一个红马
let redHorse = new Chess('马', '红', 15, 1)
redHorse.show()
redHorse.move(13, 2)
//创建一个黑车
let blackCar = new Chess('车', '黑', 1, 1)
blackCar.show()
blackCar.move(5, 1)
5.构造函数练习2
// 定义一个对象,用于保存所有的工具方法
// 这样做的目的是,放在方法被后引入的库覆盖。
let $b = {
// 判断是否是闰年的方法
isLeapYear:(year) => (year % 4 === 0 && year % 100 !== 0) || year % 400 === 0,
// 对个位数字补零的方法
repair0:(val) => (val < 10 ? "0" + val : val),
// 返回一个日期的短日期格式方法
miniDate:function (date, type){
let year = date.getFullYear(); //年
let month = date.getMonth() + 1; //月
let day = date.getDate(); //日
let hour = date.getHours(); //时
let minute = date.getMinutes(); //分
let second = date.getSeconds(); //秒
let week = date.getDay(); //周几
//定义一个返回值,默认拼接:年,月,日
let ret = [this.repair0(year), this.repair0(month), this.repair0(day)].join("-");
if (type == "1") {
ret += " " + [this.repair0(hour), this.repair0(minute), this.repair0(second)].join(":");
} else if (type == "2") {
ret +=
" " +
[this.repair0(hour), this.repair0(minute), this.repair0(second)].join(":") +
" 星期" +
"日一二三四五六"[week];
}
return ret;
},
// 对字符串反转的方法
reverseStr:(str) => str.split("").reverse().join(""),
// 定义一个分页方法,参数是:数组,页码,每页数量
pageData:function(arr,pageIndex,pageSize){
let start = (pageIndex-1)*pageSize //算出起始下标
let end = start+pageSize //算出结束下标
//根据起始下标和结束下标,从原始数组中截取对应的数据并返回
return {
//定义返回的数据
data:arr.slice(start,end),
//总数量
count:arr.length,
//总页数
totalPage:Math.ceil(arr.length/pageSize),
//当前页
pageIndex:pageIndex,
//每页数量
pageSize:pageSize
}
}
}
//调用
<script src="./js/kai.js"></script>
<script>
// 定义一个数组
let arr = [11,22,33,44,55,66,77,88,99,111,222,333,444,555,666,777,888,999]
console.log($b.pageData(arr,3,4));
console.log($b.isLeapYear(2022));
console.log($b.miniDate(new Date()));
</script>