一.对象
<script>
// 对象就是拥有一组属性和方法的集合
// 如果 a.b ,那么a就是对象,b是a的属性
// 如果 a.c(),那么a就是对象,c是a的方法
/* let no = 1001
let name = '张三'
let age = 20
let sex = '女' */
// 定义对象的第一种种方式:采用字面量赋值方式直接定义
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()
</script>
二.使用对象制作计算器
<script>
// 定义一个计算器对象
let calc = {
// 定义计算器的属性
num1: 0,
num2: 0,
jia: function () {
// 在对象的方法中,获取读取其它的成员,要通过this
console.log(`${this.num1}+${this.num2}=${this.num1 + this.num2}`);
},
// 在ES6中,对象的方法,也可以采用下面的样式
jian() {
console.log(`${this.num1}-${this.num2}=${this.num1 - this.num2}`);
},
chen() {
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.chen()
calc.chu()
</script>
三.分页方法
1.第一种
<script>
// 定义一个数组,里面初始化100条数据
let arr = []
for(let i=0;i<100;i++){
arr.push('数据'+(i+1))
}
// 定义一个分页方法,方法的三个参数分别是:原始数组,页码,每页数量
function pageDate(arr,pageIndex,pagesize){
// 思路:就是对原始数组中的数据,做截取
// 定义截取数据的起始位置
let start = (pageIndex-1)*pagesize
// 定义截取数据的结束位置
let end = start+pagesize
// 根据起始下标和结束下标,从原始数值中截取对应的数据并返回
return arr.slice(start,end)
}
// 表示每页10条数据,返回第3页
let arr2 = pageDate(arr,3,10)
console.log(arr2);
// 表示1每页15条数据,返回第5页
let arr3 = pageDate(arr,5,15)
console.log(arr3);
</script>
四.构造函数
<script>
// 构造函数:首先是个函数,这个函数用来创建出对象
// 如果使用构造函数创建出对象,使用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.name = name
this.age = age
this.sex = sex
this.sayHi = function(){
console.log(`大家好!我叫${this.name}`);
}
}
// 通过类(构造函数)可以创建出无数个对象
let s1 = new Student(1001,'张三',20,'男')
console.log(s1);
s1.sayHi()
let s2 = new Student(1002,'李四',22,'nv')
console.log(s2);
s2.sayHi()
let s3 = new Student(1003,'王五',24,'男')
console.log(s3);
s3.sayHi()
/* let s1 = {
no:1001,
name:'张三',
age: 20,
sex:'男'
}
let s2 = {
no:1002,
name:'李四',
age: 22,
sex:'女'
}
let s3 = {
no:1003,
name:'王五',
age: 24,
sex:'男'
} */
</script>
五.构造函数的练习
定义一个棋子类,里面有四个属性,分别是:名称,颜色,X轴位置,Y轴位置
比如:红色的马,当前位置是(X=15,Y=11)
里面有两个方法:分别是:
1.显示当前棋子在什么位置
2.移动方法,该方法,需要传两个参数,就是X轴和Y轴的新坐标,移动方法执行完后,在方法的最下面,调用一次显示当前位置的方法。
<script>
// 定义一个棋子构造函数(类)
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.yw}`);
}
// 移动棋子的方法
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)
</script>
六.arguments参数对象
<script>
// 方法在定义时,设置了3个形参
function fun1(a,b,c){
console.log(a,b,c);
// arguments对象里面保存着方法里面所有的参数,都可以通过下标来获取,也可以写循环
console.log(arguments);
console.log(arguments[3]);
console.log(arguments[4]);
console.log('---------------------------for循环---------------------------');
for(let i=0;i<arguments.length;i++){
console.log(arguments[i]);
}
console.log('-------------------------------------------------------------');
// 注意:arguments对象里面有一个callee方法,该方法指向当前方法本身。
console.log(arguments.callee);
}
// 方法在实际调用时,传递了5个实参
// 在方法里面,另外两个参数值就可以用arguments来获取
fun1(100,200,300,400,500)
console.log('===============================================');
// 计算100以内所有数的累加
function calc(num){
if(num===1){
return num
}
// 因为arguments。callee就是指向当前方法本身
// 因为这样做的好处是:防止外部方法修改后,导致递归失效。
let sum = num + arguments.callee(num-1)
return sum
}
console.log(calc(100));
</script>