一、对象
一、定义
在计算机世界中,万事万物都可以被称为对象.
二、语法
<script>
// 定义对象
// 语法:
// let 变量名 = {}
// 对象是由一些具体得信息构成得
let person={
name:'小明',
gender:'女',
age:18
}
// 通过对象能够将一个人物进行具体得描述
let age = 18
let gender = '男'
// 1.定义对象
let xiaohong={
// 属性名:属性值,
age:20,
gender:'女',
hobby:'唱歌'
}
let xiaoming={
age:10,
gender:'男'
}
// 2.对象的读取
// 语法:对象名.属性名
console.log(xiaoming.age)
console.log(xiaohong.hobby)
// 3.对象属性的修改
// 语法:对象名.属性名=新的值
console.log(xiaoming.age=30)
// 4.对象属性的删除
// 语法: delete 对象名.属性名
delete xiaohong.hobby
console.log(xiaohong )
</script>
练习
<script>
//对象可以完整的描述一个事物(一个人.一个物)的信息
// 定义一个商品
// 如果对象中啥也没有,称为空对象
let goods = {
name:'小米手机',
num:'12345678',
weight:'250g',
address:'北京海淀'
}
// 如何修改一个对象的属性
goods.name='小米10Plus'
// 如何去追加一个新增属性
goods.color='粉色'
console.log(goods.color)
console.log(goods.num)
console.log(goods.weight)
console.log(goods.address)
console.log(goods.name)
// 对象的补充内容
// 1.如果一个对象中没有某个内容,我非要读取结果如何?
let car = {
color:'yellow',
brand:'大众',
price:'20万'
}
console.log(car.year) //undefined
// 2.如果对象中没有某个属性,我非要给它赋值
car.year='2020年'
console.log(car) //结果是动态为对象增加了一个新属性
// 在对对象进行赋值时,存在就是修改
// 不存在就是动态新增
// person.name person.age
// 还有一种就是使用[] 即:对象名['属性名']
// 举例:
console.log(person.name)
console.log(person['name'])
// 如果属性名比较特殊的时候,使用[]的语法
// 举例说明:
let person1 = {
name:'小点',
age:20,
'his-id':1 //特殊属性名
}
// person.his-id 语法错误 此时使用[]语法就可以
console.log(person['his-id'])
</script>
二、对象方法
<script>
//访问即方法,函数如果在对象中即为方法
// 在班级里彼此之间[同学]相称
let person = {
name:'andy',
age:20,
gender:'男',
// 方法名:(匿名)函数
canSing:function(){
// 此处的逻辑就是之前所学习的
// 所有和函数相关的语法
console.log('哈哈哈,我会唱歌')
}
}
// 1.如何定义
// 方法就是函数,函数是需要调用的
// 如何进行调用?
// 对象名.方法名()
// 举例说明:
person.canSing()
// 2.带参数的方法
let person1 = {
name:'小明',
age:10,
// 方法名叫sayHi方法如何写
sayHi:function(name){
// a)分析哪里实在定义函数
console.log(name)
}
}
// b)那个地方实在调用函数
// 定义时是形参,实参是调用时的函数
person1.sayHi('小红红')
// 3.方法的参数可不可以有默认值
// 形参可以有默认值
let person2 = {
name:'小红',
gender:'女',
sum:function(x,y=0){
console.log(x+y)
}
}
person.sum(10)
// 4.方法中可不可以写return
let person3 = {
name:'11',
age:10,
total:function(n){
let s = 0
for(let i=0;i<=n;i++){
s += i
}
return s
}
}
let res = person3.total(10)
console.log(res)
</script>
</div>
例子:遍历学生信息
<style>
table{
width: 400px;
height: 100px;
text-align: center;
margin: 0 auto;
}
td{
border: 1px solid pink;
border-collapse: collapse;
}
</style>
<script>
// 对象有啥用嘞?
// 答:对象能够存储比较复杂的数据,比商品信息、学生信息
// 1. 通过对象先定义若干个学生信息(理解下面的数据是啥意思?)
let students = [
{name: '小明', age: 18, gender: '男', hometown: '河北省'},
{name: '小红', age: 19, gender: '男', hometown: '河南省'},
{name: '小刚', age: 17, gender: '女', hometown: '山西省'},
{name: '小丽', age: 18, gender: '女', hometown: '山东省'}
]
// 2. 上述的代码中,谁是真正需要显示的数据?
// 答:小明 小红 18 19 ... 这些数据
// 要获取数据需要数组和对象互相配合,比如
// students[0] // 数组中每个对象是一个单元
// console.log(students[1])
// 知道上述情形后,获取小红这个数据咋办?
// console.log(students[1].age)
// let student = students[1]
// console.log(student.name) // 小红
// 3. 通过遍历拿到全部的数据
// 1. 数组遍历 2. 可能需要对象遍历
document.write('<table>')
document.write(`
<tr>
<td>序号</td>
<td>姓名</td>
<td>年龄</td>
<td>性别</td>
<td>家乡</td>
</tr>
`)
for (let i = 0; i < students.length; i++) {
// console.log(students[i])
let student = students[i]
document.write(`
<tr>
<td>${i + 1}</td>
<td>${student.name}</td>
<td>${student.age}</td>
<td>${student.gender}</td>
<td>${student.hometown}</td>
</tr>
`)
}
document.write('</table>')
</script>
三、JS内置对象
<script>
// JS很多内置对象
// Math
// 对象 = 属性+方法
// 属性是什么意思,方法是能做什么事情
// 1.Math属性,它只有一个属性PI 3.1415926圆周率
console.log(Math.PI)
// 2.Math有很多很多方法
let maxNumber = Math.max(1,2,3,4,5)
console.log(maxNumber) //5
let minNumber = Math.min(1,2,3,4,5)
console.log(minNumber) //1
//floor取整数 简单粗暴的取整数 向下取整 直接将小数部分扔掉
let price = 12.345 //12
console.log(Math.floor(price))
// ceil取整数 向上取整 向整数部分加1
let price1 = 12.333
console.log(Math.ceil(price)) //13
// pow求次幂
console.log(Math.pow(2,3)) //2的3次方
//abs求绝对值
console.log(Math.abs(-1)) //1
// random
// Math.random()是用来求一个随机数的 会自动生成0到1之间的随机数
console.log(Math.random())
console.log(Math.random()*10)
// 如果出现了一堆小数
let intNumber = Math.floor(Math.random()*10)
console.log(intNumber)
// 随机数 Math.random的一个难点
// Math.random可以为0不可为1
// Math.random() 0.9999999999
// 请你求出0~10之间的随机(包含10)
let i = Math.random()*(10+1) //0~11 不包含11
Math.floor(i) //0~10
Math.floor(Math.random()*(N+1))
Math.floor(Mth.random()*(5+1))+5
// 公式:N~M之间的随机数
// Math.floor(Math.random()*(M-N+1))+N
</script>
堆栈内存
<script>
let x= 1
let y= x
console.log(y)
console.log(x)
let user = {
name:'小明',
age:18
}
let user1 = user
console.log(user1)
// user1.name = '小小猫'
// console.log(user.name)
// user.age=20
// console.log(user1.age)
user1 = {
name:'小刚',
age:32
}
console.log(user.name)
// 如果是变量之间进行赋值,如变量1 = 变量2
// 变量1 和 变量2 就会指向同一个内存,因此改变其中一个
// 另一个也会改变
// 如果是 变量=新的对象,那么就会在内存中建立新的空间
// 变量与其他的变量之间互不影响
</script>