[java学习5]JavaScript面向对象

墨蓝 2022-07-15 13:41 185阅读 0赞

/** javascript面向对象练习
     * 话题说的有点儿大，肯定有考虑不到的地方，但看了2天了，也该有个了结，有发现说的不对地方，还请指正。
     * 以前没研究过js，但看了jquery，只是会用$，到现在才知道js也可以面向对象的啊。
     */
    /**先说函数。
     * 2天前看到这里就以为js就这样了呢，现在感觉都不知道叫它什么好了。函数？构造方法？全局函数？傻傻分不清了。
     * */
    function sayHelloOne() {
        alert("sayHelloOne");
    }
    sayHelloOne();//sayHelloOne
    sayHelloTwo = function () {
        alert("sayHelloTwo");
    };
    sayHelloTwo();//sayHelloTwo
    alert(typeof (sayHelloOne));//function
    
    /**说说闭包
     * 我个人的理解就是，闭包就是为了能是外界访问函数(JS函数＝类)里面的成员，类似于public函数访问私有变量。
     * 其中var类型声明的属于私有，没有的是公有。
     * */
    function myClassOne() {
        var privateHello = "hello";
    
        function getHello() {
            return privateHello;
        }
    
        return getHello();//这里是返回的是闭包的返回值，不是函数；如果是函数，还得加括号调用。
    }
    alert(myClassOne());//hello
    /**关键字this
     *对于this的理解，就是谁调用的对象，很关键的东西，如果不指明的话，就是全局的window.
     *谁调用的就改变谁，没有的话，增加个属性。
     */
    var name = "Window";
    function sayName() {
        this.name = "Function";
        this.sayName = function () {
            return this.name;
        };
        return this.sayName();
    }
    alert(sayName());//Function;和window.sayName()效果一样。
    alert(name);//Function；值被冲掉。
    /*------------------------------------------------------------*/
    var className = "Window";
    function classOne() {
        this.className = "ClassOne";
        this.sayClass = function () {
            return this.className;
        };
    }
    var obj1 = new classOne();
    alert(typeof(obj1));//object
    alert(obj1.sayClass());//ClassOne
    alert(className);//Window;么有被冲掉.
    /**类方法、成员方法
     *只有带this的才是对象方法，没有的是类方法。类方法，个人理解就得当闭包方式调用；
     */
    var className = "Window";
    function classOne() {
        className = "ClassOne";//这里去除this就是公有的了。
        classSayClass = function () {
            return className;
        };
        return classSayClass;//注意：这里有返回值了，创建对象后，对象的值变了。
    }
    var obj1 = new classOne();
    alert(typeof(obj1));//function
    alert(classOne()());//ClassOne
    alert(className);//ClassOne
    /**prototype原型
     *prototype原型是个对象，Javascript中对象的prototype属性的解释是：返回对象类型原型的引用。
     *个人的理解是，原型是可以变化的。变了后，再创建对象，对象就是变后的值了。
     *注意：1，原型里可以理解是字段,而且不能用this修饰，但声明的东西全是this的。
     *     2，A.prototype = new B();还可以这么写，天哪。～
     */
    var className = "Window";
    function classOne() {};
    classOne.prototype = {
        className: "ClassOne",
        sayClass: function () {
            return this.className;//不带this结果就都是Window.
        },
        setClass: function (s) {
            return this.className = s;
        }
    };
    var obj1 = new classOne();
    alert(obj1.sayClass());//ClassOne
    obj1.setClass("hello");
    alert(obj1.sayClass());//hello
    alert(classOne.prototype.sayClass());//ClassOne；看来原型对象是全局的、独立的对象。
    alert(className);//Window
    /*------------------------------------------------------------*/
    var className = "Window";
    function classOne() {this.name = "hello";};
    classOne.prototype = {
        className: "ClassOne",
        sayName:function () {
            return this.name;
        },
        sayClass: function () {
            return this.className;
        },
        setClass: function (s) {
            return this.className = s;
        }
    };
    var obj1 = new classOne();
    alert(obj1.sayClass());//ClassOne;对象可以直接访问原型里面的任何东西。
    alert(classOne.prototype.sayName());//undefine；直接调用原型对象只能访问原型对象成员。
    alert(className);//Window
    /**对象
     *对象不能再new新对象，貌似是为了单例？不知道了。。。
     *对象的作用应该很广，目前还没理解干什么用。。。
     */
    var className = "Window";
    var obj = {
        className: "ClassOne",
        sayName:function () {
            return this.name;
        },
        sayClass: function () {
            return this.className;
        },
        setClass: function (s) {
            return this.className = s;
        }
    };
    alert(obj.sayClass());
    //var obj1 = new obj();//抱错啦，说obj不是一个constructor函数。看来说函数是构造函数也靠谱。
    //alert(obj.prototype.sayClass());原型里么有这个函数。
    /**apply和call
     *只用下call；这俩个意思一样，只是第二个参数不一样；
     *我自己的理解就是设置类里面的this值，相当于oc的target。但只能是function类型才能用。
     * */
    var className = "Window";
    function classOne() {this.name_v = "hello";};//name是个关键字，换个名字吧.
    classOne.prototype = {
        className: "ClassOne",
        sayName:function () {
            return this.name_v;
        },
        sayClass: function () {
            return this.className;
        },
        setClass: function (s) {
            return this.className = s;
        }
    };
    var obj1 = new classOne();
    alert(obj1.sayClass.call(window));//Window;
    alert(classOne.prototype.sayName.call(window));//undefine；
    alert(className);//Window
    /**最后贴一个综合例子，也正是因为这个例子，才看了js的面向对象的。
     * http://www.cnblogs.com/iammackong/p/3419089.html
     * */
    function Person(name,age){   //定义一个类，人类
        this.name=name;     //名字
        this.age=age;       //年龄
        this.sayhello=function(){alert("hello")}
    }
    function Print(){            //显示类的属性
        this.funcName="Print" ;
        this.show=function(){
            var msg=[];
            for(var key in this){
                if (typeof(this[key])!="function") msg.push([key,":",this[key]].join(""));
            }
            alert(msg.join(" ")) ;
        }
    }
    function Student(name,age,grade,school){    //学生类
        Person.apply(this,arguments);
        Print.apply(this,arguments);
        this.grade=grade;                  //年级
        this.school=school;                   //学校
    }
    var p1=new Person("jake",10);
    p1.sayhello();
    var s1=new Student("tom",13,6,"清华小学");s1.show();
    s1.sayhello();
    alert(s1.funcName);