js对象：

最新推荐文章于 2023-11-12 20:44:28 发布

小番水源

最新推荐文章于 2023-11-12 20:44:28 发布

阅读量232

点赞数

分类专栏： js 文章标签：前端 html javascript

本文链接：https://blog.csdn.net/weixin_43368552/article/details/125948010

版权

js 专栏收录该内容

47 篇文章 0 订阅

订阅专栏

更加直观的存储数据信息，数组不满足数组的存储，很难区分信息；这个时候就有了对象！

对象（object）：javaScript里的一种数据类型

可以理解为是一种无序的数据集合

对象可以用来描述详细某个事物，例如描述一个人

有静态特征；动态行为（动态行为==》使用函数表示）

对象的使用：

对象声明语法

let 对象名 ={ }

对象由属性和方法组成

属性：信息或叫特征（名词），就是这个事物具体的特征，可描述的外在特征。

方法：功能或叫行为（动词），能干吗行为

let 对象名= {

属性名：属性值

方法名：函数

}

属性：数据描述的信息称为属性，如人的名字、身高、年龄、性别等，一般是名词性的

属性都是成对出现的，包括属性名和值，它们之间使用英文 : 隔开

多个属性之间使用 , 隔开

属性就是依附在对象上的变量（在对象外面是变量，对象内是属性类似 name :'andy'等价于name ='andy'）

属性名可以使用""或者'',一般情况下可以省略，除非名称遇见特殊符号如空格、中横线等

属性访问：声明对象，并添加了若干属性后，可以使用 . 或者[ ]获取对象中属性对应的值，我们称之为属性访问，简单的理解就是获取对象里面的属性值

对象中的方法：

对象的方法：数据行为性的信息称为方法，如跑步、唱歌等，一般是动词性的，其本质是函数

1.方法是由方法名和函数两部分构成，它们之间使用：隔开

2.方法是依附在对象中的函数（是匿名函数）

3.方法名可以使用""或者'',一般情况下可以省略，除非名称遇见特殊符号如空格、中横线等

对象方法的访问：

声明对象，并添加若干方法后，可以使用 . 调用对象中函数，我们称之为方法调用

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 对象是由属性和方法组成的,那么属性和方法都要写在对象里面
        let ldh = {
            // 属性
            uname: '刘德华',

            // 方法  方法名:function(){}
            sing: function () {
                console.log('唱歌');
            },
            dance: function (s) {
                console.log(s);
            }
        }
        console.log(ldh.uname);  //属性需要有输出,才能显示
        ldh.sing()     //方法不需要输出,只需要调用即可
        ldh.dance('恭喜发财')
    </script>
</body>

</html>

操作对象：

查：查询对象对象.属性或者对象[' 属性' ] 对象.方法（）对象的方法的使用有（），属性直接是属性.属性，没有括号。

改：重新赋值对象.属性 =值对象.方法=function（）{ }

增：对象添加新的数据对象名.新属性名=新值

删：删除对象中属性 delete 对象名.属性名

遍历对象：

能够遍历输出对象里面的元素

对象没有像数组一样的length属性，所以无法确定长度

对象里面是无序的键值对，没有规律，不像数组里面有规律的下标

所以专门产生for in遍历对象

遍历对象的时候，对象属性遍历出来只能使用 obj [k] 里面k不加' '

开发中数组和对象常常配合使用：

就是数组对象

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        table {
            width: 600px;
            text-align: center;
        }

        table,
        th,
        td {
            border: 1px solid #ccc;
            border-collapse: collapse;
        }

        caption {
            font-size: 18px;
            margin-bottom: 10px;
            font-weight: 700;
        }

        tr {
            height: 40px;
            cursor: pointer;
        }

        table tr:nth-child(1) {
            background-color: #ddd;
        }

        table tr:not(:first-child):hover {
            background-color: #eee;
        }
    </style>
</head>

<body>
    <script>
        // 定有一个存储若干学生信息的数据 
           let students = [   //使用的是[ ]包裹起来的是数组     对象很多个,使用数组包裹起来,放在一个数组里面
            { name: '小明', age: 18, gender: '男', hometown: '河北省' },  //里面的是{ }包裹起来的是对象
            { name: '小红', age: 19, gender: '女', hometown: '河南省' },
            { name: '小刚', age: 17, gender: '男', hometown: '山西省' },
            { name: '小丽', age: 18, gender: '女', hometown: '山东省' },
            { name: '小潘', age: 17, gender: '男', hometown: '山西省' },
        ]
        // 第一步 打印表格的头部和尾部     ``反引号可以换行

        document.write(`  
  <table>
    <caption>学生列表</caption>
    <tr>
        <th>序号</th>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
        <th>家乡</th>
        </tr>
        
  `)
        
        // 中间遍历行数  原则就是有几条数据，我就遍历几次
// {students[i]   能得到数组里面的对象(因为对象是一整个数据类型,想要拿到对象的属性,还要.属性)
for(let i=0;i<students.length;i++){
document.write(`
<tr>
        <td>${i+1}</td>
        <td>${students[i].name}</td>
        <td>${students[i].age}</td>
        <td>${students[i].gender}</td>
        <td>${students[i].hometown}</td>
    </tr>
`)
}



          //尾部
document.write(`</table>`)

    </script>

</body>

</html>

内置对象：

javascript内部提供对象，包含各种属性和方法给开发者调用

内置对象math

math对象是JavaScript提供的一个关于数学类型的对象；提供了一系列做数学运算的方法

random：生成0~1之间的随机数（包含0不包括1）

ceil: 向上取整

floor：向下取整

max：最大值

min：最小值

pow：幂运算

abs：绝对值

生成任意范围随机数

如何生成0~10的随机数？

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

如何生成5~10的随机数？

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

如何生成N~M的随机数？

基本数据类型：在存储变量，存储的是值本身，因此也叫做值类型

引用类型：复杂数据类型，在存储变量，变量中存储的仅仅是地址（引用），因此叫做引用数据类型

对可以由系统或者程序员分配，堆是在栈立面开辟出来的一小块空间（存储引用数据类型），但是那个变量指向的仅仅是地址，某些进制编码。编码里面里面才是真正的值，相当于指向人的标识名字，别人真正的东西没指到！

栈：由操作系统自动分配释放存放函数的参数值、局部变量的值等，其操作方式类似于数据结构中的栈。简单数据类型存放在栈立面

堆：存储复杂数据类型，一般由程序员分配释放，若程序员不释放，由垃圾回收机制回收。引用数据类型存放到堆里面

栈和堆区别小例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 简单数据类型按值来存储。
        let num1=10
        let num2 =num1     //在简单数据类型中。。左边是变量，被赋值，右边是值，赋值方   简单数据类型按值存储！！！
        num2=20             //左边变量（被赋值方）的改变，不会影响右边赋值方
        console.log(num1);





        // 复杂数据类型按照地址来存储    堆里面数据按照地址进行存储
        let obj1 ={
            age:18
        }
         let obj2=obj1
         obj2.age=24
         console.log(obj1);  //输出的是age：24
        //  复杂数据类型按照地址进行存储。变量赋值的时候，其实是把地址进行赋值，所以它们的地址相同，
        // 地址相同意味着它们指向的是同一个值，同一个值！所以只要其中一个改变值的时候，意味着另外一个也跟着改变，因为它们本身就是同一个。
    </script>
</body>
</html>

小番水源

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js对象：

查查询对象对象.属性或者对象['属性']对象.方法（）对象的方法的使用有（），属性直接是属性.属性，没有括号。声明对象，并添加了若干属性后，可以使用.或者[]获取对象中属性对应的值，我们称之为属性访问，简单的理解就是获取对象里面的属性值。属性就是依附在对象上的变量（在对象外面是变量，对象内是属性类似name'andy'等价于name='andy'）对象的方法数据行为性的信息称为方法，如跑步、唱歌等，一般是动词性的，其。...
复制链接

扫一扫