js面向对象

    function createPerson(name, sex) {
        var obj = new Object();
        obj.name = name;
        obj.sex = sex;
        obj.showName = function () {
            console.log('我的名字是：' + obj.name);
        }
        return obj;
    }
          

    function CreatePeople(name, sex) {
        this.name = name;
        this.sex = sex;
        this.showName = function () {
            console.log('我的名字是：' + this.name);
        }
    }
             

可以看出是,假象的工作流程

    function CreatePeople_X(name, sex) {
        //  var this = new Object();
        this.name = name;
        this.sex = sex;
        this.showName = function () {
            console.log('我的名字是：' + this.name);
        }
        // return this;
    }
    
    var p1 = createPerson("John", 2);
    //   p1.showName();

    var p3 = new CreatePeople("Tom", 2);
    // p3.showName();
             

    var dd = [1, 3, 6, 8];
    var dd2 = [2, 4, 7, 9];
    var dd3 = new Array(11, 34, 55, 43);

    // console.log(dd.sum===dd2.sum);  true
    console.log(dd.sum());
    console.log(dd3.sum());  //Array和[]是等效的

    var sayword = ("   12d d5").trim();
    console.log(sayword);
             

原型一个重要的作用是可以扩展系统对象

        CreatePeople.prototype.showSex = function () {
            console.log(this.sex);
        }
        var p4 = new CreatePeople("Jerry", 1);
        p4.showSex();
             

混合法:每个属性都各部相同写到构造里,所以的对象都一样的写到原型里

        Array.prototype.a = 12;
        var arr = [2, 34];
        arr.a = 34;

        console.log(arr.a); //34
        delete arr.a;
        console.log(arr.a); //12
             

面向过程是实践

        window.onload = function () {       
            var getRect = document.getElementById('rect');
            getRect.onmousedown = function (e) {
                var e = e || window.event;
                var disx = e.clientX - getRect.offsetLeft;
                var disy = e.clientY - getRect.offsetTop;
                document.onmousemove = function (ev) {
                    var ev = ev || window.event;
                    if (getRect.onmousedown != null) {
                        getRect.style.left = ev.clientX - disx + 'px';
                        getRect.style.top = ev.clientY - disy + 'px';
                    }
                }

                document.onmouseup = function () {
                    document.onmousemove = null;
                    document.onmousedown = null;
                    document.MouseUp = null;
                }
            }
        }
             

面向对象的实践

        function ObjDrag(rect_id) {
            this.disx_new = null;
            this.disy_new = null;
            this.getNewRect = document.getElementById(rect_id);
            var _this = this;
            this.getNewRect.onmousedown = function () {
                _this.MouseDown();
            }
        }

        ObjDrag.prototype.MouseDown = function (event) {
            //arguments.callee.caller.arguments[0] 实现对火狐兼容
            var e = event || window.event || arguments.callee.caller.arguments[0];
            //console.log(arguments.callee.caller.arguments[0]);
            //console.log(e);
            this.disx_new = e.clientX - this.getNewRect.offsetLeft;
            this.disy_new = e.clientY - this.getNewRect.offsetTop;
            var _this = this;
            this.getNewRect.onmousemove = function () {
                _this.MouseMove();
            }
            this.getNewRect.onmouseup = function () {
                _this.MouseUp();
            }
        }

        ObjDrag.prototype.MouseMove = function (ev) {
            var ev = ev || window.event || arguments.callee.caller.arguments[0];
            if (this.getNewRect.onmousedown != null) {
                this.getNewRect.style.left = ev.clientX - this.disx_new + 'px';
                this.getNewRect.style.top = ev.clientY - this.disy_new + 'px';

            }
        }

        ObjDrag.prototype.MouseUp = function () {
            this.getNewRect.onmousemove = null;
            this.getNewRect.onmouseup = null;
        }
       
        window.onload = function () {
            //面向对象       
            new ObjDrag('rect2');
            ccc(4);
        }
             

封装一个cont方法，能实现如此调用：

cout(a)(b)(c)(d)(e)… 并且返回的值为参数连剩的结果，即a*b*c*d*e*…。如cout(1)(3)(7) 得到21

        init = 0;  //设置一个全局变量
        var muti = function (m) {
            init = init * m;
            return muti
        }

        //这是关键的一步  console.log(对象)和alert(对象)走的是对象的tostring方法
        muti.toString = function () 
        {
            return init;
        }

        function count(m)  //最终我们要调用的函数
        {
            init = m;// 初始化，否则init是0，那么永远乘 都是 0，也是很关键的一步
            return muti;//最终返回的是 元对象（不是实例化过后的对象哦)
        }
        // alert(count(3)(4)(5))

             

        function mm() {
            var pname = '22';
            this.Name = 'nn';
            var ff1 = function () { console.log('dd1') }
            this.ff2 = function () { console.log('dd2') }
           }
            

这里pname是js定义的私有属性，Name是公有属性，用var可以定义类的private属性，而用this能定义类的public属性。ff1是js定义的私有方法，ff2是公有方法

        //   构造函数
        function ccc() {
            var init = function () {
                //构造函数
            }
            init();
        }

        function bbb(a, b) {
            var x = 0;
            var y = 0;
            var init = function () {
                x = ax;
                y = ay;
            }
            init();
        }
         

         //静态属性
        bbb.count = 0;
        //静态方法
        bbb.add = function () { }
        function MMx()
        {
            this.age = 34;
        }