javascript学习笔记08(面对对象)

编程思想:把生活中做事的一些经验融入到程序中

面向过程:凡事亲力亲为,注重的是过程。

面向对象:根据需求找对象,所有事情对象来做,注重的是结果

面向对象的特性:封装、继承、多态(抽象性)

JavaScript不是面向对象的语言,是基于面向对象的语言,可以看成是可以模拟面向对象的思想

万物皆对象 ---> js高级

什么是对象?看得见、摸得着,具体所指的某个东西

分析对象的特点:

特征 ---> 属性

行为 ---> 方法

创建对象的三种方法:

        --  调用系统的构造函数来创建对象

                var obj = new Object();

                - 添加/设置属性:对象.属性名 = 值;

                - 添加/设置方法:对象.方法名 = 匿名函数;

                数据存储形式:键值对

        var ojb = new Object()
        ojb.name = '小明';
        ojb.age = 19;
        ojb.jn = function(){
            console.log("我是" + ojb.name + "我" + ojb.age + "岁")
        }
        console.log(ojb);   
        ojb.jn()

     

        --  自定义构造函数创建对象

                自己定义一个构造函数

                函数和构造函数的区别:构造函数的名字首字母大写

        function Dx(name, age){
            this.name = name,
            this.age = age,
            this.jn = function (){
                console.log("我是" + this.name + "我" + this.age + "岁")
            }
        }
        var cl = new Dx("小明",19);
        console.log(cl)
        cl.jn();

        --  以字面量的方式创建对象(两种方法)

             方法一:

        var cl = {};
        cl.name = "小明";
        cl.age = 19;
        cl.jn = function(){
            console.log("我是" + this.name + "我" + this.age + "岁")
        }
        console.log(cl);
        cl.jn();

                方法二:

        var cl = {
            name : "小明",
            age : "19",
            jn : function(){
                console.log("我是" + this.name + "我" + this.age + "岁")
            }
        }
        console.log(cl)
        cl.jn();

上述代码结果都为:

javascript学习笔记08(面对对象)

工厂模式创建对象

有一种结合上述方法的方式可以用来工厂化批量创建对象

        function dog(color, breed, age, jn){
            var obj = new Object();
            obj.color = color,
            obj.breed = breed,
            obj.age = age,
            obj.jn = function(){
                console.log(jn);
            };
            return obj;
        }
        mao1 = new mao("红色", "哈士奇", 2 , "抓鱼");
        mao2 = new mao("黄色", "金毛", 5, "睡觉");
        console.log(mao1);
        console.log(mao2);
        mao1.jn();
        mao2.jn()

JavaScript学习的三种对象:

1.内置对象---JavaScript系统自带的对象:Math、Date、String、Array、Object

2.自定义对象---自己定义的构造函数所创建的对象

3.浏览器对象

实例对象:通过构造函数创建出来的对象

静态对象:不需要创建,直接就是一个对象,方法/属性可以直接通过方法名调用

Math对象:静态对象

            - Math.PI 圆周率π

            - Math.floor(值) 向下取整

            - Math.ceil(值) 向上取整

            - Math.abs(值) 绝对值

            - Math.round(值) 四舍五入,正数四舍五入,负数先忽略符号,五舍六入

            - Math.max(很多数字) 取最大值

            - Math.min(很多数字) 取最小值

            - Math.pow(m, n) m的n次方的值

            - Math.sqrt(16) 开平方根

            - Math.random() 取随机数,区间0-1

Date对象

        // 创建指定时间
        var dt = new Date("2011-11-30 20:42:12");
        console.log(dt);

        // 获取当前时间,创建一个实例对象
        var dt2 = new Date();
        console.log(dt2);

        // 获取毫秒数,1秒=1000毫秒(时间戳)
        // dt2实例对象调用getTime()方法获取时间戳
        console.log(dt2.getTime());// 从1970-01-01-00:00:00到现在的毫秒数
        // 直接调用Date的now()方法获取时间戳
        console.log(Date.now());
        // 利用valueOf()方法的特性<返回给定参数的Number对象值>获取时间戳
        console.log(dt2.valueOf());

        // 年份
        console.log(dt2.getFullYear());// 2021
        // 月份
        console.log(dt2.getMonth() + 1);// 10  从0开始0-11 所以要加1
        // 日期
        console.log(dt2.getDate());// 30
        // 星期
        console.log(dt2.getDay());
        // 时分秒
        console.log(dt2.getHours());
        console.log(dt2.getMinutes());
        console.log(dt2.getSeconds());

        console.log(dt2.toTimeString());// 时:分:秒 GMT+0800 (中国标准时间)
        console.log(dt2.toLocaleTimeString());// 12小时制的时分秒

        console.log(dt2.toDateString());// 英文日期
        console.log(dt2.toLocaleDateString());// 年/月/日

可以通过上次方法自己封装一个自己想要的样式的时间表达

        function getDate(dt) {
            var year = dt.getFullYear();
            var month = dt.getMonth() + 1;
            var date = dt.getDate();
            var hours = dt.getHours();
            var minutes = dt.getMinutes();
            var seconds = dt.getSeconds();

            // 补位
            // month = month < 10 ? "0" + month : month;
            // date = date < 10 ? "0" + date : date;
            // hours = hours < 10 ? "0" + hours : hours;
            // minutes = minutes < 10 ? "0" + minutes : minutes;
            // seconds = seconds < 10 ? "0" + seconds : seconds;

            function bu(i) {
                return i = i < 10 ? "0" + i : i;
            }

            var str = year + "年" + bu(month) + '月' + bu(date) + "日" + bu(hours) + ":" + bu(minutes) + ":" + bu(seconds);
            return str;
        }

        // console.log(getDate(new Date()));
        console.log(getDate(new Date("2022-01-01 00:00:00")));

以下是一个自定义对象,模拟实现系统的Math.max()方法

        function MyMax() {
            // 获取最大值的方法
            this.getMax = function() {
                var max = arguments[0];
                for(var i = 0; i < arguments.length; i++) {
                    if(max < arguments[i]) {
                        max = arguments[i];
                    }
                }
                return max;
            }
        }

        var math = new MyMax();
        console.log(math.getMax(1, 49, 888, 27, 75, 66));

上一篇:08


下一篇:08