Jquery真的不难~第七回 JS也要面向对象-白红宇

　前几篇文章以JQ为主，本系列的八篇文章中，第一讲为ＪＳ基础，从第二讲开始到第六讲主要是ＪＱ基础知识，而第七讲与第八讲是ＪＳ中的一些高级应用，写到这里，也快要和《Jquery真的不难》说再见了，有点舍不得，恩，连续的两天失眠，呵呵，不知道为什么，可能是兴奋过度了吧，呵呵，总之这几天的状态超级好，我喜欢这种感觉，非常感谢！

ＪＳ也要面向对象这个题目很大，我是搞Ｃ#开发的，而Ｃ#是个面向人性化的语言，呵呵，我更希望把面向对象改成面向人性化，呵呵，因为只有你把它拟人化之后，你才能更好的去学习吧，编程，上学时大多人说它是个枯燥的东西，编程课卓见变成了睡觉课，呵呵，但似乎从那里起，我就已经被代码吸引了，不知道为什么，但到今天我终于找到原因了，因为我把代码拟人化了，或者说我被代码拟人化了，呵呵！

一　函数实现的面向对象

　　　　　window.onload = function () {            //定义一下游戏功能的函数对象            var Game = function (canvas, options) {                var _options = options || { width: 300, height: 300, background: "#ff0000", border: "solid 1px black" };                var _pos = { x: _options.width / 2, y: _options.height / 2 };                var _this = this; //这样在canvas对象的事件内部可以向到root级的元素了                canvas.onmousemove = function (ev) {                    _pos = {                        x: ev.clientX - canvas.offsetLeft,                        y: ev.clientY - canvas.offsetTop                    };                    _options = { width: 100, height: 100, background: "#ffff00" };                    init();                }                var init = function () {                    canvas.style.position = "absolute";                    canvas.style.border = _options.border;                    canvas.style.background = _options.background;                    canvas.style.width = _options.width + "px";                    canvas.style.height = _options.height + "Px";                    canvas.style.left = _pos.x + "px";                    canvas.style.top = _pos.y + "px";                }                init();                this.Content("真的不错，扩展方法"); //不在本方法内实现，只是调用一下            }            Game.prototype.Content = function (msg) {
   //在这样实现它的功能                console.log(msg);            }            var canvas = document.getElementById("canvas");            new Game(canvas); //如果想用Game里的扩展方法Content，需要new一下，因为Content属于实例方法}

二　通过ＪＳ对象实现的面向对象

　　　　　　　//一个人            var People = {                Name: "lose.zhang",                Age: 30,                Enjon: ["C#", "JS", "SQL", "NoSQL", "SOA", "AOP", "IOC", "DynamicProxy", "OOD&DDP"],                Print: function (msg) {                    console.log(msg);                },                Work: {                    Name: "Software Architect",                    Salary: "保密",                    Print: function () {                        console.log("这个人：" + People.Name                        + ",他的年龄：" + People.Age                        + ",他的特长是：" + People.Enjon                        + ",它的职位是：" + this.Name                        + ",它的薪水是：" + this.Salary);                    }                }            };            People.Work.Print();

恩，在这些代码实现过程中，有几个基础东西要撑握一下了：

声明变量：var x=1;

声明数组：var xArr=[];

声明对象：var xObject={};

声明函数：var xFunction=function(){};

函数实例：var xFunInstance=new xFunction();

函数扩展方法：XFunction().prototype.ExtensionForPrint(){}; //只有函数的实例对象，才能访问扩展方法

恩差不多了，就到这里吧！

感谢阅读！

本文转自博客园张占岭（仓储大叔）的博客，原文链接：，如需转载请自行联系原博主。