Js基础v1.0.3(对象)

对象

创建对象

 <script>
   //      对象名
        let num = {
            //属性名 : 属性值,
            userName: '小鹿',
            age: 18,
        }
    </script>

对象的使用

取值

有两种方式

比较常用的是第一种方式，也方便一些

如果访问的对象不存在就会输出：undefined

数组的方式访问对象不存在而却不加引号就会直接报错

   <script>
        let num = {
            userName: '小鹿',
            age: 18,
        }
//第一种方式
        document.write(`她叫${num.userName},今年${num.age}岁<br>`)
//第二种方式
        document.write(`今年${num['age']}，她叫${num['userName']}`)
    </script>

输出：

对象-方法

创建

可以传实参，也可以返回值

 <script>
        let num = {
            name: '你的',
            sayHi: function () {
                document.write(`hi`)
            }
        }
        num.sayHi()
    </script>

使用

方法其实就是一个函数

函数可以接受值

函数有返回值

函数使用需要加上括号()

 num.sayHi()

输出：

补充

数组方式访问不加引号就代表取变量名

 <script>
        let name = 'color'
        let num = {
            name: '你的',
            color: 'yellow',

        }
        console.log(num[name]);
    </script>

输出：

对象属性值增加-修改

对象名.属性名=值

如果属性名不存在就是增加，但是如果已经存在这个属性名那么就是修改属性值

 <script>
        let person = {
            username: '中国人'
        }
        //新增加，但是如果属性名已经存在那么就是修改属性值
        // person.username = '普通人'
        //修改
        person.username = 'GG'
        console.log(person.username);
    </script>

输出：

对象属性删除

delete

方法：delete 对象名.属性名

删除后输出：undefined

    <script>
        let person = {
            username: '小鹿'
        }
        delete person.username
        console.log(person.username);
    </script>

输出：

遍历对象

forin

  <script>
        let person = {
            name: '小鹿',
            age: 18,
        }

        for (let i in person) {
            console.log(i);//打印属性名
            console.log(person[i]);//打印属性值
        }
    </script>

输出：

   <script>
        let person = {
            name: '小鹿',
            age: 18,
        }

        for (let i in person) {
            // console.log(i);//打印属性名
            // console.log(person[i]);//打印属性值
            console.log(`属性名：${i},属性值：${person[i]}`);
        }
    </script>

案例

for循环加上遍历对象

 <script>
        let message = [
            { name: '小米1', age: 18, gender: '男', hometown: '广东' },
            { name: '小米2', age: 18, gender: '男', hometown: '广东' },
            { name: '小米3', age: 18, gender: '男', hometown: '广东' },
            { name: '小米4', age: 18, gender: '男', hometown: '广东' },
        ]
        html = `<table border='1'> 
        <th>序号</th>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
        <th>家乡</th>`

        for (let index = 0; index < message.length; index++) {
            html += `<tr> 
        <td>${index + 1}</td>`

            //获得数组里面的序列号（index就是序列号）
            //key就是每一个序列号里面内容
            //然后打印序列号里面的内容(有多少内容就会打印多少个td标签）
            //message数组[index序列号][key内容]
            for (const key in message[index]) {
                html += ` <td>${message[index][key]}</td>`
            }
            html += ` </tr>`
        }
        html += ` </table>`
        document.write(html)
    </script>

输出：

内置对象

Math.

常用：

round四舍五入取整

abs求绝对值

ceil向上取整

floor向下取整

random随机数 0-1（不包括1）

max最大值

min最小值

pow求次方

求两个数值之间的随机整数

<script>
        let num2 = +prompt('输入第一个值'),
            num3 = +prompt('输入第二个值');

        function getRandom(min, max) {
            //最大值减去最小值再加上最小值
            return Math.round(Math.random() * (max - min) + min)
        }
        getRandom(num2, num3)
        console.log(getRandom(num2, num3));
    </script>