对象
对象(object):JavaScript里的一种数据类型
可以理解为是一种无序的数据集合
语法
let 对象名 = {
属性名:属性值
方法名:函数
}
组成
属性:信息或叫特性(名词)
方法:功能或叫行为(动词)
<script>
let goods = {
name: '小米',
num: 111,
weight: '0.55kg',
address: '中国大陆',
play: function () {
console.log(`我要玩王者荣耀`);
}
}
</script>
注:属性和值用 : 分隔
多个属性间用 , 分隔
属性访问
访问获取对象里面的属性值
<script>
let goods = {
name: '小米',
num: 111,
weight: '0.55kg',
address: '中国大陆'
}
// 1. 对象.属性
console.log(goods.name)
// 2. 对象.['属性']
// 要注意[]的属性名要加引号,不然会被解析成变量
console.log(goods['name'])
</script>
访问获取对象中的方法
<script>
let goods = {
name: '小米',
num: 111,
weight: '0.55kg',
address: '中国大陆',
play: function (game = '我的世界') {
console.log(`我要玩${game}`);
}
}
// 匿名函数的调用
goods.play('王者荣耀')
goods.play('LOL')
goods.play('QQ飞车')
goods.play()
</script>
操作对象
<script>
let person = {
name: '李狗蛋',
age: 18
}
</script>
查:直接对象.属性
<script>
console.log(person.name);
console.log(person['name']);
</script>
增: 对象.属性 = 值
<script>
person.sex = '男'
console.log(person);
</script>
如果对象中没有设置的属性则会新增一个属性
增: 对象.方法 = 匿名函数
<script>
person.sayHi = function () {
console.log('大家好~请多多关照');
}
console.log(person);
person.sayHi()
</script>
也可以动态为对象 添加方法,语法更加灵活
改: 对象.属性 = 值
<script>
person.name = '张翠花'
console.log(person);
</script>
如果对象中有对应的属性则会重新赋值
删: delete 对象.属性
<script>
delete person.name
console.log(person);
</script>
删除数组中选中的对象属性
遍历对象
对象没有向数组一样的length属性,所以无法确定长度
对象里面是无序的键值对,没有规律,不像数组里有规律的下标
<script>
let person = {
name: '李狗蛋',
age: 18,
sex: '男'
}
// 利用 for in 遍历对象 key 代表属性名
for (let key in person) {
console.log(key);
// 在遍历对象的时候,不能用 对象名.key 的这种方式获取对象中的属性值
// 当前遍历的属性值
console.log(person[key]);
}
</script>
注:因为key并不是person中的属性,所以用 . key 的这种方式是获取不到内容的,只能通过[ key ]的方式去访问
数组对象
<script>
let students = [
{ name: '李狗蛋', age: 18, gender: '男', hometown: '广东省' },
{ name: '张翠花', age: 19, gender: '女', hometown: '四川省' },
{ name: '赵铁柱', age: 17, gender: '男', hometown: '广西省' },
{ name: '钱多多', age: 18, gender: '女', hometown: '湖南省' }
]
// 因为我们要访问的对象本身是一个数组,所以要先选中索引,再选中对象属性
console.log(students[3].hometown);
</script>
内置对象
Math对象是JavaScript提供的一个“数学高手”对象
提供了一系列做数学运算的方法
<script>
// Math.random() 求从0 - 1 的随机数(包括0 不包括1)
console.log(Math.random())
// Math.ceil() 向上取整(往大了取)
console.log(Math.ceil(2.3));
// Math.floor() 向下取整(往小了取)
console.log(Math.floor(3.2));
// Math.max() 求最大值
console.log(Math.max(11, 30, 23, 22, 8));
// Math.min() 求最小值
console.log(Math.min(11, 30, 23, 22, 8));
// Math.PI 求圆周率
console.log(Math.PI);
</script>
更多参数可以在相关网站
www.w3school.com.cn/jsref/jsref…查看
随机数对象
<script>
// 求 0 - 10的随机数
/* 推导过程
Math.random() -> [0, 1)
// 我们想要的是整数,把 小数 * 10 = 整数
Math.random() * 10 -> [0,10)
// 还是会有小数,需要向下取整 Math.floor()
// 向下取整还是到不了我们需要的10,那么我们可以+1,让它的范围是0-11,就可以向下取整到我们需要的10
Math.random() * 11 -> [0,11) */
console.log(Math.floor(Math.random() * 11));
// 求 5 - 10的随机数
// 0 - 5的随机数 + 5
console.log(Math.floor(Math.random() * (5 + 1)) + 5);
// 求 min - max 的随机数
Math.floor(Math.random() * (max - min + 1)) + min
推导出公式:封装成函数以便后续使用
<script>
function getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min
}
console.log(getRandom())
</script>
案例*随机数
<script>
// 随机数
function getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min
}
// 声明变量 如果是错的 就继续执行循环
let res = getRandom(1, 100)
let random = true
while (random) {
let num = +prompt(`请您输入数字`)
if (num > res) {
alert('您输入的数字太大了,再来一次吧')
} else if (num < res) {
alert('您输入的数字太小了,再来一次吧')
} else if (num === res) {
alert('恭喜您猜对了,快去买彩票吧')
// 退出循环
break
}
}
</script>
案例*随机点名-不允许重复出现
<script>
// 随机数
function getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min
}
// 声明一个数组
let arr = ['赵云', '黄忠', '关羽', '张飞', '马超', '刘备', '曹操']
// 生成1个随机数 作为数组的索引号
let random = getRandom(0, arr.length - 1)
document.write(arr[random])
// 之后删除这个 人的名字
// arr.splice(从哪里开始删, 删几个)
arr.splice(random, 1)
console.log(arr);
</script>