JavaScript基础——对象

工厂模式

批量创建具备相同格式的(具有相同的成员对象)对象

<script>
      
        // 批量声明学生对象
        // name
        // age
        // sayHi
        // 封装一个sayHi函数
        function fun(){
            console.log('大家好,我是:'+this.name+',我今年:'+this.age+'岁了');

        }
        // 将声明对象的过程,封装称为成为一个函数
        function getStu(name,age){
            let stu = new Object();
            stu.name=name;
            stu.age=age;
            stu.sayHi=fun;
            // 将创建好的对象,返回出去
            return stu;
        }
        // 调用工厂函数,返回出去
        let guoguo=getStu('xiaoming',30);
        guoguo.sayHi();
    </script>

案例:
有一个数组中,保存了学生的名字;
根据数组,利用工厂模式生成对应的学生对象(name,sayHi方法)
将每一个学生对象保存到另一个数组中
最后遍历学生对象数组,调用每一个学生对象的sayHi方法

let nameArr = ['张三', '李四', '王五', '赵六'];
        let stuArr = [];

        function fun() {
            console.log('大家好,我是:' + this.name);
        }

        function getPerson(name) {
            this.name = name;
            this.sayHi = fun;
        }
        for (let i = 0; i < nameArr.length; i++) {
            // getPerson(nameArr[i]);
            stuArr.push(getPerson(nameArr[i]));
        }
        console.log(stuArr);
        for (let i = 0; i < stuArr.length; i++) {
            stuArr[i].sayHi();
        }

new关键字

在这里插入图片描述

  1. new内部声明好了一个空对象,不需要手动声明
  2. 让this关键字指向这个空对象,才可以赋值
  3. new内部实现了对象的返回

数据类型检测

  1. typeof只能检测简单数据类型,检测复杂数据类型全部发挥object。

  2. instanceof 能检测复杂数据类型,返回true/false

  3. Object.prototype.toString.call(检测数据);检测的最为具体

  4. Array.isArray(检测数据);判断是否为数组

<!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>
        // 1.利用typeof检测
        console.log(typeof 123); //number
        console.log(typeof '果果'); //boolean
        console.log(typeof [1, 2, 3]); //object
        console.log(typeof {
            name: '类诶'
        }); //object

        function fun() {}
        console.log(typeof fun); //fonction
        console.log('----------------------');
        // 2.instanceof

        let arr = [];
        let obj = {};
        console.log(arr instanceof Array); //true
        console.log(obj instanceof Object); //true
        console.log(fun instanceof Function); //true
        console.log(fun instanceof Object); //true
        console.log('----------------------');
        // 3.Object.prototype.toString.call(检测数据);
        console.log(Object.prototype.toString.call(arr));//[object Array]
        console.log(Object.prototype.toString.call(obj));//[object Object]

        console.log('-----------------------');
        // 4.拓展判断是否是数组
        // Array.isArray(检测数据);
        console.log(Array.isArray(arr));//true
        console.log(Array.isArray(obj));//false
        console.log('-----------------------------');
        // 拓展代码,对原生方法进一步的封装
        // 目的:方便使用
        // 快捷:optc
      

        function getType(data) {
            return Object.prototype.toString.call(data);;
        }
        console.log(getType(arr));//[object Array]
    </script>
</body>

</html>

遍历父子对象

先遍历数组确定对象中是否有对象

<script>
        let guoguo = {
            name: '果果',
            age: 38,
            dog: {
                name: '来福',
                age: 3,
                color: 'pink'
            }
        }
        // 单纯遍历对象,forin
        for (let key in guoguo) {
            // 遍历的同时,判断是否有子对象
            if (Object.prototype.toString.call(guoguo[key]) == '[object Object]') {
                // 获得子对象之后,遍历子对象
                for (let k in guoguo[key]) {
                    // guoguo[key]--->dog对象
                    // guoguo[key][k]--->dog对象的成员名:name,age,color
                    console.log(guoguo[key][k]);
                }
            }else{
                console.log(guoguo[key]);
            }
        }
        // 
    </script>

二维数组

数组中的元素也是数组

  • 遍历二维数组
<script>
        // 二维数组
        // 数组中的元素,也是一个数组
        let arr = [1,2,3,  [4,5,6]  ,7,8,9];

        for(let i = 0;i < arr.length;i++) {
            // 判断是否为数组
            if (Array.isArray(arr[i])) {
                // 是一个数组类型,那么进一步遍历
                for(let j = 0;j < arr[i].length;j++) {
                    console.log(arr[i][j]);
                }
            } else {
                console.log(arr[i]);
            }
        }
    </script>

猜你喜欢

转载自blog.csdn.net/weixin_44757417/article/details/107477986