05-js对象

孙小明的测试修炼手册

已于 2023-06-29 01:49:53 修改

阅读量31

点赞数

分类专栏：前端实战-JS 文章标签： javascript 开发语言 ecmascript

于 2023-06-29 01:49:30 首次发布

本文链接：https://blog.csdn.net/weixin_44431329/article/details/131447908

版权

前端实战-JS 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

1、对象是什么

对象是javascript中的一种数据类型，可以理解一种无顺序的集合，用来描述某件事务。例如描述某一个人

2、对象的使用

属性：信息特征
方法：行为特征

声明格式

关键字 对象名 = {
  	属性名:属性值
  	方法名:方法值
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let persion= {
            name:'法外狂徒',
            sayHi:function(){
                console.log('这是法外狂徒');
            }
        }
    </script>
</body>
</html>

3、操作对象

1、增加属性和方法

格式：
对象名.属性名=属性值
对象名.方法名=function(){
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let persion= {
            name:'法外狂徒',
            sayHi:function(){
                console.log('这是法外狂徒');
            }
        }
        persion.age=14
      persion.age = function(){
          console.log('年龄方法');
      }
        console.log(persion);
      
    </script>
</body>
</html>

2、查询对象属性或方法

格式
对象.属性
对象.方法

案例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let persion= {
            name:'法外狂徒',
            sayHi:function(){
                console.log('这是法外狂徒');
            }
        }
        persion.age=14
      
      console.log(persion.name);

      persion.age = function(){
          console.log('年龄方法');
      }
        console.log(persion);
      
    </script>
</body>
</html>

3、删除对象的属性

格式：
delect 对象名.属性名

案例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let persion= {
            name:'法外狂徒',
            sayHi:function(){
                console.log('这是法外狂徒');
            }
        }
     delect persion.name
      
    </script>
</body>
</html>

4、重新赋值

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

5、遍历对象

对象没有像数组一样的lenth属性，所以无法确定长度
对象里面是无序的键值对，没有规律不像数组里有规律的下标

案例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        let persion = {
            name:'张三',
            age:14
        }
        for(let k in persion){
            console.log(k);
            console.log(persion[k]);
        }
    </script>
</body>
</html>

4、javaScript内置对象

1、Math对象

math对象是java数学运算对象，提供了一系列数学运算方法

[外链图片转存中…(img-F7Lovu55-1687974419020)]

2、生成随机数

案例

<!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>
        // 求得是 N - M 之间的一个随机数公式
        // let random = Math.floor(Math.random() * (10 - 1 + 1)) + 1
        // console.log(random)
        // 封装一个随机数函数  min 到  max  
        function getRandom(min, max) {
            return Math.floor(Math.random() * (max - min + 1)) + min
        }
        let random = getRandom(1, 10)
        console.log(random)
        let random1 = getRandom(1, 50)
        console.log(random1)
    </script>
</body>

</html>