重新梳理JScript基础知识之对象篇

重新梳理JScript基础知识之对象篇本文详细介绍了 JavaScript 中的对象 包括对象的定义 属性和方法的使用 以及如何操作和遍历对象

大家好,欢迎来到IT知识分享网。

1.什么是对象?

对象(object):是一种数据类型,一种无序的数据集合,用来描述某一事物。

js中的数据类型分为两大类:基本数据类型和引用数据类型

基本数据类型有:数字型、字符串型、布尔型、undefined、null。

引入数据类型有:arr数组、function函数和object对象。

2.对象的使用

1.对象生声明的语法

let 对象名 = {}

// 例如

let person =  {}

2.对象是由属性和方法组成

属性是描述一些信息或者特征。

方法是描述行为或者功能。

let 对象名 = { 属性名: 属性值, 方法名: 函数 }

3.属性

用来描述数据的信息称为属性,一般用名词

 let obj = { uname: '张三', age: 22, gender: '男' }

注意:

  • 属性都是都是成对出现,属性名和属性值直接是用英文 : 隔开的
  • 多个属性之间是用英文 隔开
  • 属性就是依附在对象上的变量 在对象外面是变量,对象内是属性

4.属性的访问

对象名.属性  或者

对象名[‘属性’]

5.对象中的方法

数据具有行为性的信息称为方法,实际上就是函数

 let obj = { uname: '张三', sayHi: function () { document.write('Hi') } }
  • 方法是由方法名和函数组成 直接用英文 隔开
  • 多个属性和方法用英文 隔开
  • 方法也是依附在对象上的函数

6.方法的访问

 let obj = { uname: '张三', sayHi: function () { document.write('Hi') } } obj.sayHi() //对象名.方法名()

小括号一定不能省略

3.操作对象

操作对象和数组是一样的就是增、删、改、查

查询对象:对象名: 属性  或对象名[‘属性值’]    对象名.方法名()

改:对象.属性 = 值   对象.方法 = function() {}

曾:对象名.新属性名 = 新值

查: delete 对象名.属性名

 //新增属性 let obj = { uname: '张三', sayHi: function () { document.write('Hi') } } obj.age = 22 obj.gender = '男' obj['hobby'] = '打篮球' console.log(obj) //新增方法 obj.sing = function () { document.write('song') } obj.sing()

4.遍历对象

 for (let k in obj) { console.log(k) //打印的是属性名 console.log(obj[k]) // 打印的是属性值 }

对象是用for in 的方法遍历 一般不用遍历数组的方法来遍历对象

重点:k 是获取的对象的属性名,对象名[k] 获取的是属性值

不能写成对象名[k] 不然会报错

案例:打印数据并渲染成表格

 <script> let students = [{ name: '小明', age: 18, gender: '男', hometown: '河北省' }, { name: '小红', age: 19, gender: '女', hometown: '河南省' }, { name: '小刚', age: 17, gender: '男', hometown: '山西省' }, { name: '小丽', age: 18, gender: '女', hometown: '山东省' } ] for (let i = 0; i < students.length; i++) { // console.log(students[i]) //打印的是students 这个数组里面的每一个 对象 的元素 console.log(students[i].name) // 遍历出每一个名字 console.log(students[i].age) // 遍历出每一个年龄 console.log(students[i]['gender']) // 遍历出每一个性别 console.log(students[i]['hometown']) // 遍历出每一个地址 } </script>

5.内置对象

JavaScript中的内部给我们提供的一些对象 我们可以直接调用

像document.write()和console.log()就是内置对象

  • random:生成0-1之间的随机数(包含0不包括1)
  • ceil:向上取整
  • floor:向下取整
  • max:找最大数
  • min:找最小数
  • pow:幂运算
  • abs:绝

生成1-10的随机数

 Math.floor(Math.random() * (10 + 1))

生成5-10的随机数

Math.floor(Math.random() * (5 + 1)) + 5

生成n-m的随机数

Math.floor(Math.random() * (M – N + 1)) + N

案例:

点名: 每次刷新网页运行, 在控制台 随机输出一位同学的名字 [“老赵”, “老李”, “小传”, “小黑”],如果输出了,则数组中删除这个名字

 <script> // 引入公式 function getRandom(min, max) { min = Math.ceil(min); max = Math.floor(max); return Math.floor(Math.random() * (max - min + 1)) + min; //含最大值,含最小值 } let arr = ["老赵", "老李", "小传", "小黑"] // 生成一个包含0和3的随机数并声明一个变量来接收 索引号最大值 = arr.length - 1 let random = getRandom(0, arr.length - 1) // 通过数组[随机数] 就可以随机点名 // arr[random] console.log(arr[random]) // 通过splice(删除位置,删除个数)来删除被点到的人 arr.splice(random, 1) console.log(arr) </script>

免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://haidsoft.com/132332.html

(0)
上一篇 2025-08-01 14:10
下一篇 2025-08-01 14:15

相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注微信