{"id":641,"date":"2008-12-11T23:12:30","date_gmt":"2008-12-11T15:12:30","guid":{"rendered":"http:\/\/fdream.net\/blog\/article\/641.aspx"},"modified":"2008-12-12T00:12:59","modified_gmt":"2008-12-11T16:12:59","slug":"Mootools+1.2%e6%95%99%e7%a8%8b(18)%e2%80%94%e2%80%94%e7%b1%bb(%e4%b8%80)","status":"publish","type":"post","link":"https:\/\/fdream.net\/blog\/article\/641","title":{"rendered":"Mootools 1.2\u6559\u7a0b(18)\u2014\u2014\u7c7b(\u4e00)"},"content":{"rendered":"<p>\u539f\u6587\u5730\u5740\uff1a<a href=\"http:\/\/www.consideropen.com\/blog\/2008\/09\/30-days-of-mootools-12-tutorials-day-18-classes-part-i\/\" target=\"_blank\" title=\"30 Days of Mootools 1.2 Tutorials - Day 18 - Classes part I\">30 Days of Mootools 1.2 Tutorials &#8211; Day 18 &#8211; Classes part I<\/a><\/p>\n<h2>Class\uff08\u7c7b\uff09\uff08\u7b2c\u4e00\u90e8\u5206\uff09<\/h2>\n<p>\u8bf7\u5c0a\u91cd\u4e2a\u4eba\u52b3\u52a8\uff0c\u8f6c\u8f7d\u8bf7\u6ce8\u660e\u51fa\u5904\uff1ahttp:\/\/fdream.net\uff0c\u8bd1\u8005\uff1aFdream<\/p>\n<p>\u5982\u679c\u4f60\u8fd8\u6ca1\u6709\u51c6\u5907\u597d\u5f00\u59cb\u8fd9\u4e00\u8bb2\uff0c\u8bf7\u53c2\u8003\u8fd9\u4e00\u7cfb\u5217\u7684\u6559\u7a0b\uff0c\u8fd9\u91cc\u662f<a href=\"http:\/\/fdream.net\/blog\/article\/605.aspx\" target=\"_blank\" title=\"\u300aMooTools 1.2\u7cfb\u5217\u6559\u7a0b\u76ee\u5f55\u300b\">\u300aMooTools 1.2\u7cfb\u5217\u6559\u7a0b\u76ee\u5f55\u300b<\/a>\u3002<\/p>\n<p>\u4eca\u5929\u6211\u4eec\u5c06\u8bb2\u4e00\u4e0b\u7528MooTools\u6765\u521b\u5efa\u548c\u4f7f\u7528\u7c7b\u7684\u4e00\u4e9b\u57fa\u672c\u77e5\u8bc6\u3002<\/p>\n<p>\u7b80\u5355\u5730\u8bb2\uff0c\u4e00\u4e2a\u7c7b\u5c31\u662f\u4e00\u4e2a\u5bb9\u5668\uff0c\u8fd9\u4e2a\u5bb9\u5668\u5305\u542b\u4e86\u4e00\u4e9b\u53d8\u91cf\u96c6\u5408\u548c\u64cd\u4f5c\u8fd9\u4e9b\u53d8\u91cf\u7684\u51fd\u6570\uff0c\u4ee5\u4fbf\u5b9e\u73b0\u7279\u5b9a\u7684\u529f\u80fd\u3002\u5728\u4e00\u4e2a\u5185\u5bb9\u7275\u6d89\u8f83\u591a\u7684\u9879\u76ee\u4e2d\uff0c\u7c7b\u4f1a\u663e\u5f97\u96be\u4ee5\u7f6e\u4fe1\u7684\u6709\u7528\u3002<\/p>\n<h3>\u53d8\u91cf<\/h3>\n<p>\u5728\u524d\u9762\u4e00\u7cfb\u5217\u7684\u8bfe\u7a0b\u4e2d\uff0c\u6211\u4eec\u5df2\u7ecf\u5b66\u4e60\u8fc7\u4e86<a href=\"http:\/\/fdream.net\/blog\/article\/625.aspx\" target=\"_blank\" title=\"Hash\u5bf9\u8c61\u4e2d\u952e\u503c\u5bf9\uff08key\/value pair\uff09\u7684\u4f7f\u7528\u65b9\u5f0f\">Hash\u5bf9\u8c61\u4e2d\u952e\u503c\u5bf9\uff08key\/value pair\uff09\u7684\u4f7f\u7528\u65b9\u5f0f<\/a>\uff0c\u56e0\u6b64\uff0c\u4e0b\u9762\u7684\u8fd9\u4e2a\u4f8b\u5b50\u4e2d\u521b\u5efa\u4e86\u4e00\u4e2a\u7c7b\uff0c\u5b83\u53ea\u5305\u542b\u4e86\u4e00\u4e9b\u53d8\u91cf\uff0c\u4f60\u770b\u8d77\u6765\u53ef\u80fd\u4f1a\u89c9\u5f97\u975e\u5e38\u7684\u719f\u6089\uff1a<\/p>\n<p><pre lang=\"javascript\">\n\/\/ \u521b\u5efa\u4e00\u4e2a\u540d\u4e3aclass_one\u7684\u7c7b\n\/\/ \u5305\u542b\u4e24\u4e2a\u5185\u90e8\u53d8\u91cf\nvar Class_one = new Class({\n    variable_one : &quot;I'm First&quot;,\n    variable_two : &quot;I'm Second&quot;\n});\n<\/pre>\n<\/p>\n<p>\u7c7b\u4f3c\u5730\uff0c\u4f60\u53ef\u4ee5\u901a\u8fc7\u7c7b\u4f3c\u8bbf\u95eehash\u4e2d\u7684\u53d8\u91cf\u7684\u65b9\u5f0f\u6765\u8bbf\u95ee\u5176\u4e2d\u7684\u53d8\u91cf\uff0c\u6ce8\u610f\u4e00\u4e0b\uff0c\u5728\u4e0b\u9762\u7684\u4ee3\u7801\u4e2d\uff0c\u6211\u4eec\u521b\u5efa\u4e86\u4e00\u4e2a\u6211\u4eec\u5728\u4e0a\u9762\u5b9a\u4e49\u7684Class_one\u7c7b\u7684\u5b9e\u4f8b\u3002<\/p>\n<p><pre lang=\"javascript\">\nvar run_demo_one = function(){\n    \/\/ \u521b\u5efa\u7c7bClass_one\u7684\u4e00\u4e2a\u5b9e\u4f8b\uff0c\u540d\u79f0\u4e3ademo_1\n    var demo_1 = new Class_one();\n    \/\/ \u663e\u793ademo_1\u4e2d\u7684\u53d8\u91cf\n    alert( demo_1.variable_one );\n    alert( demo_1.variable_two );    \n}\n<\/pre>\n<\/p>\n<p>\n<script type=\"text\/javascript\">\nfunction print_r( array, return_val ) {\n    \/\/ http:\/\/kevin.vanzonneveld.net\n    \/\/ +   original by: Michael White (http:\/\/crestidg.com)\n    \/\/ +   improved by: Ben Bryan\n    \/\/ *     example 1: print_r(1, true);\n    \/\/ *     returns 1: 1<\/p>\n<p>    var output = \"\", pad_char = \" \", pad_val = 4;<\/p>\n<p>    var formatArray = function (obj, cur_depth, pad_val, pad_char) {\n        if (cur_depth > 0) {\n            cur_depth++;\n        }<\/p>\n<p>        var base_pad = repeat_char(pad_val*cur_depth, pad_char);\n        var thick_pad = repeat_char(pad_val*(cur_depth+1), pad_char);\n        var str = \"\";<\/p>\n<p>        if (obj instanceof Array || obj instanceof Object) {\n            str += \"Array\\n\" + base_pad + \"(\\n\";\n            for (var key in obj) {\n                if (obj[key] instanceof Array) {\n                    str += thick_pad + \"[\"+key+\"] => \"+formatArray(obj[key], cur_depth+1, pad_val, pad_char);\n                } else {\n                    str += thick_pad + \"[\"+key+\"] => \" + obj[key] + \"\\n\";\n                }\n            }\n            str += base_pad + \")\\n\";\n        } else if(obj == null || obj == undefined) {\n            str = '';\n        } else {\n            str = obj.toString();\n        }<\/p>\n<p>        return str;\n    };<\/p>\n<p>    var repeat_char = function (len, pad_char) {\n        var str = \"\";\n        for(var i=0; i < len; i++) { \n            str += pad_char; \n        };\n        return str;\n    };\n    output = formatArray(array, 0, pad_val, pad_char);\n \n    if (return_val !== true) {\n        document.write(\"\n\n<pre>\" + output + \"<\/pre>\n<p>\");\n        return true;\n    } else {\n        return output;\n    }\n}<\/p>\n<p>var class_one = new Class({\n    variable_one : \"I'm First\",\n    variable_two : \"I'm Second\"\n});<\/p>\n<p>var class_two = new Class({\n    variable_one : \"I'm First\",\n    variable_two : \"I'm Second\",\n    function_one : function(){\n        alert('First Value : ' + this.variable_one);\n        },\n    function_two : function(){\n        alert('Second Value : ' + this.variable_two);\n    }\n});<\/p>\n<p>var class_three = new Class({\n    \/\/Function run when class is created\n    initialize : function(one, two){\n        this.variable_one = one;\n        this.variable_two = two;\n    },\n    \/\/Method Definitions\n    function_one : function(){\n        alert('First Value : ' + this.variable_one);\n        },\n    function_two : function(){\n        alert('Second Value : ' + this.variable_two);\n    }    \n});<\/p>\n<p>var class_four = new Class({\n    Implements: Options,\n    options: {\n    option_one : \"Default Value For First Option\",\n    option_two : \"Default Value For Second Option\",\n    },\n    initialize: function(options){\n    this.setOptions(options);\n    },   \n    show_options : function(){\n        alert(this.options.option_one + \"\\n\" + this.options.option_two);\n    },\n});<\/p>\n<p>var class_five = new Class({\n    Implements: Options,\n    options : {\n        option_one : \"DEFAULT_1\",\n        option_two : \"DEFAULT_2\",    \n    },\n    initialize : function(options){\n        this.setOptions(options);\n    },\n       show_options : function(){\n           alert(print_r(this.options, true));\n       },\n    swap_options : function(){\n        this.setOptions({\n            option_one : this.options.option_two,\n            option_two : this.options.option_one\n        })\n    }\n});<\/p>\n<p>var run_demo_1 = function(){\n    var demo_1 = new class_one();\n    alert( demo_1.variable_one );\n    alert( demo_1.variable_two );\n}<\/p>\n<p>var run_demo_2 = function(){\n    var demo_2 = new class_two();\n    demo_2.function_one();\n    demo_2.function_two();\n}<\/p>\n<p>var run_demo_3 = function(){\n    var demo_3 = new class_three(\"First Argument\", \"Second Argument\");\n    demo_3.function_one();\n    demo_3.function_two();\n}<\/p>\n<p>var run_demo_4 = function(){\n    var demo_4 = new class_four({option_one : \"New Value\"});\n    demo_4.show_options();\n}<\/p>\n<p>var run_demo_5 = function(){\n    var demo_5 = new class_four();\n    demo_5.show_options();\n    demo_5.setOptions({option_two : \"New Value\"});\n    demo_5.show_options();\n}<\/p>\n<p>var run_demo_6 = function(){\n    var demo_6 = new class_four({new_variable : \"This is a new variable\"});\n    demo_6.show_options();\n}<\/p>\n<p>var run_demo_7 = function(){\n    var demo_7 = new class_five();\n    demo_7.show_options();\n    demo_7.swap_options();\n    demo_7.show_options();\n}\n<\/script><br \/>\n<input type=\"button\" onclick=\"run_demo_1()\" value=\"\u8fd0\u884cdemo 1\" \/>\n<\/p>\n<h3>\u65b9\u6cd5\/\u51fd\u6570<\/h3>\n<p>\u65b9\u6cd5\u662f\u6307\u4e00\u4e2a\u6307\u5b9a\u7684\u7c7b\u4e2d\u7684\u51fd\u6570\uff08\u901a\u4fd7\u5730\u8bf4\u5c31\u662f\u4e00\u4e2a\u7c7b\u4e2d\u7684\u51fd\u6570\u5c31\u53eb\u505a\u65b9\u6cd5\uff0c\u6362\u4e86\u4e2a\u53eb\u6cd5\u800c\u5df2\uff09\u3002\u8fd9\u4e9b\u65b9\u6cd5\u5fc5\u987b\u901a\u8fc7\u8fd9\u4e2a\u7c7b\u7684\u5b9e\u4f8b\u6765\u8c03\u7528\uff0c\u800c\u7c7b\u672c\u8eab\u4e0d\u80fd\u8c03\u7528\u5b83\u4eec\u3002\u4f60\u53ef\u4ee5\u50cf\u5b9a\u4e49\u4e00\u4e2a\u53d8\u91cf\u6765\u5b9a\u4e49\u4e00\u4e2a\u65b9\u6cd5\uff0c\u4e0d\u540c\u7684\u662f\u4f60\u9700\u8981\u7ed9\u5b83\u6307\u5b9a\u4e00\u4e2a\u9759\u6001\u7684\u503c\uff0c\u7ed9\u5b83\u6307\u5b9a\u4e00\u4e2a\u533f\u540d\u51fd\u6570\uff1a<\/p>\n<p><pre lang=\"javascript\">\nvar Class_two = new Class({\n    variable_one : &quot;I'm First&quot;,\n    variable_two : &quot;I'm Second&quot;,\n    function_one : function(){\n        alert('First Value : ' + this.variable_one);\n        },\n    function_two : function(){\n        alert('Second Value : ' + this.variable_two);\n    }\n});\n<\/pre>\n<\/p>\n<p>\u6ce8\u610f\u4e00\u4e0b\u4e0a\u9762\u4f8b\u5b50\u4e2d\u7684\u5173\u952e\u5b57this\u7684\u4f7f\u7528\u3002\u7531\u4e8e\u5728\u4e0a\u9762\u7684\u65b9\u6cd5\u4e2d\u64cd\u4f5c\u7684\u53d8\u91cf\u90fd\u662f\u7c7b\u5185\u90e8\u7684\u53d8\u91cf\uff0c\u56e0\u6b64\u4f60\u9700\u8981\u901a\u8fc7\u4f7f\u7528\u5173\u952e\u5b57this\u6765\u8bbf\u95ee\u8fd9\u4e9b\u53d8\u91cf\uff0c\u5426\u5219\u4f60\u5c06\u53ea\u80fd\u5f97\u5230\u4e00\u4e2aundefined\u503c\u3002<\/p>\n<p><pre lang=\"javascript\">\n\/\/ \u6b63\u786e\nworking_method : function(){\n    alert('First Value : ' + this.variable_one);\n},\n\n\/\/ \u9519\u8bef\nbroken_method : function(){\n    alert('Second Value : ' + variable_two);\n}\n<\/pre>\n<\/p>\n<p>\u8c03\u7528\u65b0\u521b\u5efa\u7684\u7c7b\u4e2d\u7684\u65b9\u6cd5\u5c31\u50cf\u8bbf\u95ee\u90a3\u4e9b\u7c7b\u7684\u53d8\u91cf\u4e00\u6837\u3002<\/p>\n<p><pre lang=\"javascript\">\nvar run_demo_2 = function(){\n    \/\/ \u5b9e\u4f8b\u5316\u4e00\u4e2a\u7c7bclass_two\n    var demo_2 = new Class_two();\n    \/\/ \u8c03\u7528function_one\n    demo_2.function_one();\n    \/\/ \u8c03\u7528function_two\n    demo_2.function_two();\n}\n<\/pre>\n<\/p>\n<p>\n<input type=\"button\" onclick=\"run_demo_2()\" value=\"\u8fd0\u884cdemo 2\" \/>\n<\/p>\n<h3>initialize\u65b9\u6cd5<\/h3>\n<p>\u7c7b\u5bf9\u8c61\u4e2d\u7684initialize\u9009\u9879\u53ef\u4ee5\u8ba9\u4f60\u6765\u5bf9\u7c7b\u8fdb\u884c\u4e00\u4e9b\u521d\u59cb\u5316\u64cd\u4f5c\uff0c\u4e5f\u53ef\u4ee5\u8ba9\u4f60\u6765\u5904\u7406\u4e00\u4e9b\u53ef\u4f9b\u7528\u6237\u8bbe\u7f6e\u7684\u9009\u9879\u548c\u53d8\u91cf\u3002\uff08Fdream\u6ce8\uff1a\u5b9e\u9645\u4e0a\u8fd9\u4e2a\u5c31\u76f8\u5f53\u4e8e\u7c7b\u7684\u521d\u59cb\u5316\u65b9\u6cd5\u3002\uff09\u4f60\u53ef\u4ee5\u50cf\u5b9a\u4e49\u65b9\u6cd5\u4e00\u6837\u6765\u5b9a\u4e49\u5b83\uff1a<\/p>\n<p><pre lang=\"javascript\">\nvar Myclass = new Class({\n    \/\/ \u5b9a\u4e49\u4e00\u4e2a\u5305\u542b\u4e00\u4e2a\u53c2\u6570\u7684\u521d\u59cb\u5316\u65b9\u6cd5\n    initialize : function(user_input){\n        \/\/ \u521b\u5efa\u4e00\u4e2a\u5c5e\u4e8e\u8fd9\u4e2a\u7c7b\u7684\u53d8\u91cf\n        \/\/ \u5e76\u7ed9\u5b83\u8d4b\u503c\n        \/\/ \u503c\u4e3a\u7528\u6237\u4f20\u8fdb\u6765\u7684\u503c\n        this.value = user_input;\n    }\n})\n<\/pre>\n<\/p>\n<p>\u4f60\u4e5f\u53ef\u4ee5\u901a\u8fc7\u8fd9\u4e2a\u521d\u59cb\u5316\u6765\u6539\u53d8\u5176\u4ed6\u7684\u9009\u9879\u6216\u8005\u884c\u4e3a\uff1a<\/p>\n<p><pre lang=\"javascript\">\nvar Myclass = new Class({\n    initialize : function(true_false_value){\n        if (true_false_value){\n            this.message = &quot;Everything this message says is true&quot;;\n        }\n        else {\n            this.message = &quot;Everything this message says is false&quot;;\n        }\n    }\n})\n \n\/\/ \u8fd9\u5c06\u8bbe\u7f6emyClass\u5b9e\u4f8b\u7684message\u5c5e\u6027\u4e3a\u4e0b\u9762\u7684\u5b57\u7b26\u4e32\n\/\/ &quot;Everything this message says is true&quot;\nvar myclass_instance = new Myclass(true);\n \n\/\/ \u8fd9\u5c06\u8bbe\u7f6emyClass\u5b9e\u4f8b\u7684message\u5c5e\u6027\u4e3a\u4e0b\u9762\u7684\u5b57\u7b26\u4e32\n\/\/ &quot;Everything this message says is false&quot;\nvar myclass_instance = new Myclass(false);\n<\/pre>\n<\/p>\n<p>\u6240\u6709\u7684\u8fd9\u4e00\u5207\u5de5\u4f5c\u90fd\u4e0d\u9700\u8981\u58f0\u660e\u4efb\u4f55\u5176\u4ed6\u53d8\u91cf\u6216\u8005\u65b9\u6cd5\u3002\u53ea\u9700\u8981\u8bb0\u4f4f\u6bcf\u4e2a\u952e\u503c\u5bf9\u540e\u9762\u7684\u9017\u53f7\u5c31\u884c\u4e86\u3002\u771f\u7684\u662f\u975e\u5e38\u5bb9\u6613\u6f0f\u6389\u4e00\u4e2a\u9017\u53f7\uff0c\u7136\u540e\u82b1\u8d39\u5927\u91cf\u7684\u65f6\u95f4\u6765\u8ffd\u8e2a\u8fd9\u4e9b\u4e0d\u5b58\u5728\u7684\u6f0f\u6d1e\u3002<\/p>\n<p><pre lang=\"javascript\">\nvar Class_three = new Class({\n    \/\/ \u5f53\u7c7b\u521b\u5efa\u7684\u65f6\u5019\u5c31\u4f1a\u6267\u884c\u8fd9\u4e2a\u7c7b\n    initialize : function(one, two, true_false_option){\n        this.variable_one = one;\n        this.variable_two = two;\n        if (true_false_option){\n            this.boolean_option = &quot;True Selected&quot;;\n        }\n        else {\n            this.boolean_option = &quot;False Selected&quot;;\n        }\n    },\n    \/\/ \u5b9a\u4e49\u4e00\u4e9b\u65b9\u6cd5\n    function_one : function(){\n        alert('First Value : ' + this.variable_one);\n        },\n    function_two : function(){\n        alert('Second Value : ' + this.variable_two);\n    }    \n});\n \nvar run_demo_3 = function(){\n    var demo_3 = new Class_three(&quot;First Argument&quot;, &quot;Second Argument&quot;);\n    demo_3.function_one();\n    demo_3.function_two();\n}\n\n<\/pre>\n<\/p>\n<p>\n<input type=\"button\" onclick=\"run_demo_3()\" value=\"\u8fd0\u884cdemo 3\" \/>\n<\/p>\n<h3>\u5b9e\u73b0\u9009\u9879\u529f\u80fd<\/h3>\n<p>\u5f53\u521b\u5efa\u7c7b\u7684\u65f6\u5019\uff0c\u7ed9\u7c7b\u4e2d\u7684\u4e00\u4e9b\u53d8\u91cf\u8bbe\u7f6e\u4e00\u4e9b\u9ed8\u8ba4\u503c\u4f1a\u975e\u5e38\u6709\u7528\uff0c\u5982\u679c\u7528\u6237\u6ca1\u6709\u63d0\u4f9b\u521d\u59cb\u8f93\u5165\u7684\u8bdd\u3002\u4f60\u53ef\u4ee5\u624b\u52a8\u5730\u5728\u521d\u59cb\u5316\u65b9\u6cd5\u4e2d\u8bbe\u7f6e\u8fd9\u4e9b\u53d8\u91cf\uff0c\u68c0\u67e5\u6bcf\u4e00\u4e2a\u8f93\u5165\u6765\u770b\u7528\u6237\u662f\u4e0d\u662f\u63d0\u4f9b\u4e86\u76f8\u5e94\u7684\u503c\uff0c\u7136\u540e\u66ff\u6362\u76f8\u5e94\u7684\u9ed8\u8ba4\u503c\u3002\u6216\u8005\uff0c\u4f60\u4e5f\u53ef\u4ee5\u4f7f\u7528MooTools\u4e2dClass.extras\u63d0\u4f9b\u7684<a href=\"http:\/\/docs.mootools.net\/Class\/Class.Extras#Options\" target=\"_blank\" title=\"Options\u7c7b\">Options\u7c7b<\/a>\u6765\u5b9e\u73b0\u3002<\/p>\n<p>\u7ed9\u4f60\u7684\u7c7b\u589e\u52a0\u4e00\u4e2a\u9009\u9879\u529f\u80fd\u975e\u5e38\u7b80\u5355\uff0c\u5c31\u50cf\u7ed9\u7c7b\u6dfb\u52a0\u4e00\u4e2a\u5176\u4ed6\u7684\u952e\u503c\u5bf9\u4e00\u6837\uff1a<\/p>\n<p><pre lang=\"javascript\">\nvar Myclass = new Class({\n    Implements: Options\n})\n<\/pre>\n<\/p>\n<p>\u9996\u5148\u4e0d\u8981\u592a\u7740\u6025\u5b9e\u73b0\u9009\u9879\u7684\u7ec6\u8282\u95ee\u9898\uff0c\u6211\u4eec\u4f1a\u5728\u540e\u9762\u7684\u6559\u7a0b\u4e2d\u66f4\u6df1\u5165\u7684\u5b66\u4e60\u3002\u73b0\u5728\uff0c\u6211\u4eec\u5df2\u7ecf\u62e5\u6709\u4e00\u4e2a\u6709\u9009\u9879\u529f\u80fd\u7684\u7c7b\u4e86\uff0c\u6211\u4eec\u8fd8\u9700\u8981\u505a\u7684\u5c31\u662f\u5b9a\u4e49\u4e00\u4e9b\u9ed8\u8ba4\u7684\u9009\u9879\u3002\u548c\u5176\u4ed6\u7684\u6240\u6709\u4e1c\u897f\u4e00\u6837\uff0c\u53ea\u9700\u8981\u6dfb\u52a0\u4e00\u4e9b\u9700\u8981\u521d\u59cb\u5316\u7684\u952e\u503c\u5bf9\u5c31\u53ef\u4ee5\u4e86\u3002\u4e0e\u5b9a\u4e49\u5355\u4e2a\u503c\u4e0d\u4e00\u6837\u7684\u662f\uff0c\u4f60\u9700\u8981\u50cf\u4e0b\u9762\u8fd9\u6837\u5b9a\u4e49\u4e00\u7ec4\u952e\u503c\u5bf9\u96c6\u5408\uff1a<\/p>\n<p><pre lang=\"javascript\">\nvar Myclass = new Class({\n    Implements: Options,\n    options: {\n        option_one : &quot;First Option&quot;,\n        option_two : &quot;Second Option&quot;\n    }\n})\n<\/pre>\n<\/p>\n<p>\u73b0\u5728\u6211\u4eec\u5c31\u6709\u4e86\u8fd9\u4e9b\u9ed8\u8ba4\u7684\u96c6\u5408\uff0c\u6211\u4eec\u8fd8\u9700\u8981\u63d0\u4f9b\u4e00\u4e2a\u65b9\u5f0f\u6765\u4f9b\u7528\u6237\u5728\u521d\u59cb\u5316\u8fd9\u4e2a\u7c7b\u7684\u65f6\u5019\u8986\u76d6\u8fd9\u4e9b\u9ed8\u8ba4\u503c\u3002\u4f60\u6240\u8981\u505a\u7684\u5de5\u4f5c\u5c31\u662f\u5728\u4f60\u7684\u521d\u59cb\u5316\u51fd\u6570\u4e2d\u589e\u52a0\u4e00\u884c\u65b0\u7684\u4ee3\u7801\uff0c\u800cOptions\u7c7b\u4f1a\u5b8c\u6210\u5176\u4f59\u7684\u5de5\u4f5c\uff1a<\/p>\n<p><pre lang=\"javascript\">\nvar Myclass = new Class({\n    Implements: Options,\n    options: {\n        option_one : &quot;First Default Option&quot;,\n        option_two : &quot;Second Default Option&quot;\n    }\n    initialize: function(options){\n        this.setOptions(options);\n    }\n})\n<\/pre>\n<\/p>\n<p>\u4e00\u65e6\u8fd9\u4e2a\u5b8c\u6210\u4ee5\u540e\uff0c\u4f60\u5c31\u53ef\u4ee5\u901a\u8fc7\u4f20\u9012\u4e00\u7ec4\u952e\u503c\u5bf9\u6765\u8986\u76d6\u4efb\u4f55\u9ed8\u8ba4\u9009\u9879\uff1a<\/p>\n<p><pre lang=\"javascript\">\n\/\/ \u8986\u76d6\u6240\u6709\u7684\u9ed8\u8ba4\u9009\u9879\nvar class_instance = new Myclass({\n    options_one : &quot;Override First Option&quot;,  \n    options_two : &quot;Override Second Option&quot;\n    });\n \n\/\/ \u8986\u76d6\u5176\u4e2d\u7684\u4e00\u4e2a\u9ed8\u8ba4\u9009\u9879\nvar class_instance = new Myclass({\n    options_two : &quot;Override Second Option&quot;\n})\n<\/pre>\n<\/p>\n<p>\u6ce8\u610f\u4e00\u4e0b\u521d\u59cb\u5316\u51fd\u6570\u4e2d\u7684setOptions\u65b9\u6cd5\u3002\u8fd9\u662fOptions\u7c7b\u4e2d\u63d0\u4f9b\u7684\u4e00\u4e2a\u65b9\u6cd5\uff0c\u53ef\u4ee5\u8ba9\u4f60\u5728\u5b9e\u4f8b\u5316\u4e00\u4e2a\u7c7b\u7684\u65f6\u5019\u8bbe\u7f6e\u9009\u9879\u3002<\/p>\n<p><pre lang=\"javascript\">\nvar class_instance = new Myclass();\n\/\/ \u8bbe\u7f6e\u7b2c\u4e00\u4e2a\u9009\u9879\nclass_instance.setOptions({options_one : &quot;Override First Option&quot;});\n<\/pre>\n<\/p>\n<p>\u4e00\u65e6\u8bbe\u7f6e\u4e86\u9009\u9879\uff0c\u4f60\u5c31\u53ef\u4ee5\u901a\u8fc7\u53d8\u91cfoptions\u6765\u8bbf\u95ee\u5b83\u4eec\u3002<\/p>\n<p><pre lang=\"javascript\">\nvar class_instance = new Myclass();\n\/\/ \u53d6\u5f97\u7b2c\u4e00\u4e2a\u9009\u9879\u7684\u503c\nvar class_option = class_instance.options.options_one;\n\/\/ \u53d8\u91cfclass_option\u73b0\u5728\u7684\u503c\u5c31\u4e3a&quot;First Default Option&quot;\u4e86\n<\/pre>\n<\/p>\n<p>\u5982\u679c\u4f60\u60f3\u5728\u7c7b\u7684\u5185\u90e8\u8bbf\u95ee\u8fd9\u4e2a\u9009\u9879\uff0c\u8bf7\u4f7f\u7528this\u8bed\u53e5\uff1a<\/p>\n<p><pre lang=\"javascript\">\nvar Myclass = new Class({\n    Implements: Options,\n    options: {\n        option_one : &quot;First Default Option&quot;,\n        option_two : &quot;Second Default Option&quot;\n    }\n    test : function(){\n        \/\/ \u6ce8\u610f\u6211\u4eec\u4f7f\u7528this\u5173\u952e\u5b57\u6765\n        \/\/ \u5f15\u7528\u8fd9\u4e2a\u7c7b\n        alert(this.option_two);\n    }\n});\n \nvar class_instance = new Myclass();\n\/\/ \u5c06\u5f39\u51fa\u4e00\u4e2a\u5bf9\u8bdd\u6846\uff0c\u663e\u793a&quot;Second Default Option&quot;\nclass_instance.test();\n<\/pre>\n<\/p>\n<p>\u628a\u8fd9\u4e9b\u4e1c\u897f\u7ec4\u5408\u6210\u4e00\u4e2a\u7c7b\uff0c\u770b\u8d77\u6765\u5c31\u662f\u8fd9\u6837\u7684\uff1a<\/p>\n<p><pre lang=\"javascript\">\nvar Class_four = new Class({    \n    Implements: Options,\n    options: {\n        option_one : &quot;Default Value For First Option&quot;,\n        option_two : &quot;Default Value For Second Option&quot;,\n    },\n    initialize: function(options){\n        this.setOptions(options);\n    },   \n    show_options : function(){\n        alert(this.options.option_one + &quot;\\n&quot; + this.options.option_two);\n    },\n});\n \nvar run_demo_4 = function ){\n    var demo_4 = new Class_four({\n        option_one : &quot;New Value&quot;\n        });\n    demo_4.show_options();\n}\n \nvar run_demo_5 = function(){\n    var demo_5 = new Class_four();\n    demo_5.show_options();\n    demo_5.setOptions({option_two : &quot;New Value&quot;});\n    demo_5.show_options();\n}\n \n\/\/ \u521b\u5efa\u4e00\u4e2a\u7c7bclass_four\u7684\u5b9e\u4f8b\n\/\/ \u5e76\u6307\u5b9a\u4e00\u4e2a\u540d\u53ebnew_option\u7684\u65b0\u9009\u9879\nvar run_demo_6 = function(){\n    var demo_6 = new Class_four({new_option : &quot;This is a new option&quot;});\n    demo_6.show_options();\n}\n<\/pre>\n<\/p>\n<p>\n<input type=\"button\" onclick=\"run_demo_4()\" value=\"\u8fd0\u884cdemo 4\" \/><br \/>\n<input type=\"button\" onclick=\"run_demo_5()\" value=\"\u8fd0\u884cdemo 5\" \/><br \/>\n<input type=\"button\" onclick=\"run_demo_6()\" value=\"\u8fd0\u884cdemo 6\" \/>\n<\/p>\n<h3>\u4ee3\u7801\u53ca\u793a\u4f8b<\/h3>\n<p>\u719f\u6089PHP\u7684\u4eba\u53ef\u80fd\u8ba4\u8bc6\u4e0b\u9762\u793a\u4f8b\u4e2d\u7684show_options\u65b9\u6cd5\u4e2d\u7684print_r()\u51fd\u6570\uff1a<\/p>\n<p><pre lang=\"javascript\">\nshow_options : function(){\n    alert(print_r(this.options, true));\n}\n<\/pre>\n<\/p>\n<p>\u8fd9\u4e0d\u662f\u4e00\u4e2ajavascript\u7684\u539f\u751f\u65b9\u6cd5\uff0c\u53ea\u4e0d\u8fc7\u662f\u4ece<a href=\"http:\/\/kevin.vanzonneveld.net\/techblog\/category\/php2js\/\" target=\"_blank\" title=\"PHP2JS\u9879\u76ee\">PHP2JS\u9879\u76ee<\/a>\u4e2dKevin van Zonneveld\u7684\u4e00\u5c0f\u6bb5\u4ee3\u7801\u800c\u5df2\u3002\u5bf9\u4e8e\u90a3\u4e9b\u4e0d\u719f\u6089PHP\u7684\u4eba\uff0c\u8fd9\u4e2aprint_r()\u65b9\u6cd5\u5c31\u7ed9\u4f60\u4e86\u4e00\u4e2a\u6570\u7ec4\u4e2d\u952e\u503c\u5bf9\u683c\u5f0f\u5316\u540e\u7684\u5b57\u7b26\u4e32\u3002\u5728\u8c03\u8bd5\u811a\u672c\u7684\u8fc7\u7a0b\u4e2d\uff0c\u8fd9\u662f\u4e00\u4e2a<a href=\"http:\/\/kevin.vanzonneveld.net\/techblog\/article\/javascript_equivalent_for_phps_print_r\/\" target=\"_blank\" title=\"\u6781\u5176\u6709\u7528\u7684debug\u5de5\u5177\">\u6781\u5176\u6709\u7528\u7684debug\u5de5\u5177<\/a>\uff0c\u8fd9\u4e2a\u51fd\u6570\u5728\u540e\u9762\u63d0\u4f9b\u7684\u4e0b\u8f7d\u5305\u4e2d\u6709\u8be6\u7ec6\u7684\u4ee3\u7801\uff0c\u6211\u5f3a\u70c8\u63a8\u8350\u4f7f\u7528\u5b83\u6765\u6d4b\u8bd5\u548c\u7814\u7a76\u3002<\/p>\n<p><pre lang=\"javascript\">\nvar Class_five = new Class({\n    \/\/ \u6211\u4eec\u4f7f\u7528\u4e86\u9009\u9879\n    Implements: Options,\n    \/\/ \u8bbe\u7f6e\u6211\u4eec\u7684\u9ed8\u8ba4\u9009\u9879\n    options : {\n        option_one : &quot;DEFAULT_1&quot;,\n        option_two : &quot;DEFAULT_2&quot;,    \n    },\n    \/\/ \u8bbe\u7f6e\u6211\u4eec\u7684\u521d\u59cb\u5316\u51fd\u6570\n    \/\/ \u901a\u8fc7setOptions\u65b9\u6cd5\u6765\u8bbe\u7f6e\u9009\u9879\n    initialize : function(options){\n        this.setOptions(options);\n    },\n    \/\/ \u7528\u6765\u6253\u5370\u9009\u9879\u6570\u7ec4\u4fe1\u606f\u7684\u65b9\u6cd5\n       show_options : function(){\n           alert(print_r(this.options, true));\n       },\n    \/\/ \u901a\u8fc7setOptions\u65b9\u6cd5\u6765\u4ea4\u6362\u4e24\u4e2a\u9009\u9879\u7684\u503c\n    swap_options : function(){\n        this.setOptions({\n            option_one : this.options.option_two,\n            option_two : this.options.option_one\n        })\n    }\n});\n \nfunction demo_7(){\n    var demo_7 = new Class_five();\n    demo_7.show_options();\n    demo_7.setOptions({option_one : &quot;New Value&quot;});\n    demo_7.swap_options();\n    demo_7.show_options();\n}\n<\/pre>\n<\/p>\n<p>\n<input type=\"button\" onclick=\"run_demo_7()\" value=\"\u8fd0\u884cdemo 7\" \/>\n<\/p>\n<h3>\u66f4\u591a\u5b66\u4e60<\/h3>\n<p><b><a href=\"http:\/\/www.consideropen.com\/downloads\/30days_of_moo\/mootorial_day18_classes_1.zip\" target=\"_blank\" title=\"\u4e0b\u8f7d\u4e00\u4e2a\u5305\u542b\u4f60\u5f00\u59cb\u6240\u9700\u8981\u7684\u6240\u6709\u4e1c\u897f\u7684zip\u5305\">\u4e0b\u8f7d\u4e00\u4e2a\u5305\u542b\u4f60\u5f00\u59cb\u6240\u9700\u8981\u7684\u6240\u6709\u4e1c\u897f\u7684zip\u5305<\/a><\/b><\/p>\n<ul style=\"list-style-type:disc\"><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>\u539f\u6587\u5730\u5740\uff1a30 Days of Mootools 1.2 Tutorials &#8211; Day 18 &#8211; Classes part I Class\uff08\u7c7b\uff09\uff08\u7b2c\u4e00\u90e8\u5206\uff09 \u8bf7\u5c0a\u91cd\u4e2a\u4eba\u52b3\u52a8\uff0c\u8f6c\u8f7d\u8bf7\u6ce8\u660e\u51fa\u5904\uff1ahttp:\/\/fdream.net\uff0c\u8bd1\u8005\uff1aFdream \u5982\u679c\u4f60\u8fd8\u6ca1\u6709\u51c6\u5907\u597d\u5f00\u59cb\u8fd9\u4e00\u8bb2\uff0c\u8bf7\u53c2\u8003\u8fd9\u4e00\u7cfb\u5217\u7684\u6559\u7a0b\uff0c\u8fd9\u91cc\u662f\u300aMooTools 1.2\u7cfb\u5217\u6559\u7a0b\u76ee\u5f55\u300b\u3002 \u4eca\u5929\u6211\u4eec\u5c06\u8bb2\u4e00\u4e0b\u7528MooTools\u6765\u521b\u5efa\u548c\u4f7f\u7528\u7c7b\u7684\u4e00\u4e9b\u57fa\u672c\u77e5\u8bc6\u3002 \u7b80\u5355\u5730\u8bb2\uff0c\u4e00\u4e2a\u7c7b\u5c31\u662f\u4e00\u4e2a\u5bb9\u5668\uff0c\u8fd9\u4e2a\u5bb9\u5668\u5305\u542b\u4e86\u4e00\u4e9b\u53d8\u91cf\u96c6\u5408\u548c\u64cd\u4f5c\u8fd9\u4e9b\u53d8\u91cf\u7684\u51fd\u6570\uff0c\u4ee5\u4fbf\u5b9e\u73b0\u7279\u5b9a\u7684\u529f\u80fd\u3002\u5728\u4e00\u4e2a\u5185\u5bb9\u7275\u6d89\u8f83\u591a\u7684\u9879\u76ee\u4e2d\uff0c\u7c7b\u4f1a\u663e\u5f97\u96be\u4ee5\u7f6e\u4fe1\u7684\u6709\u7528\u3002 \u53d8\u91cf \u5728\u524d\u9762\u4e00\u7cfb\u5217\u7684\u8bfe\u7a0b\u4e2d\uff0c\u6211\u4eec\u5df2\u7ecf\u5b66\u4e60\u8fc7\u4e86Hash\u5bf9\u8c61\u4e2d\u952e\u503c\u5bf9\uff08key\/value pair\uff09\u7684\u4f7f\u7528\u65b9\u5f0f\uff0c\u56e0\u6b64\uff0c\u4e0b\u9762\u7684\u8fd9\u4e2a\u4f8b\u5b50\u4e2d\u521b\u5efa\u4e86\u4e00\u4e2a\u7c7b\uff0c\u5b83\u53ea\u5305\u542b\u4e86\u4e00\u4e9b\u53d8\u91cf\uff0c\u4f60\u770b\u8d77\u6765\u53ef\u80fd\u4f1a\u89c9\u5f97\u975e\u5e38\u7684\u719f\u6089\uff1a \/\/ \u521b\u5efa\u4e00\u4e2a\u540d\u4e3aclass_one\u7684\u7c7b \/\/ \u5305\u542b\u4e24\u4e2a\u5185\u90e8\u53d8\u91cf var Class_one = new Class({ variable_one : &quot;I&#8217;m First&quot;, variable_two : &quot;I&#8217;m Second&quot; }); \u7c7b\u4f3c\u5730\uff0c\u4f60\u53ef\u4ee5\u901a\u8fc7\u7c7b\u4f3c\u8bbf\u95eehash\u4e2d\u7684\u53d8\u91cf\u7684\u65b9\u5f0f\u6765\u8bbf\u95ee\u5176\u4e2d\u7684\u53d8\u91cf\uff0c\u6ce8\u610f\u4e00\u4e0b\uff0c\u5728\u4e0b\u9762\u7684\u4ee3\u7801\u4e2d\uff0c\u6211\u4eec\u521b\u5efa\u4e86\u4e00\u4e2a\u6211\u4eec\u5728\u4e0a\u9762\u5b9a\u4e49\u7684Class_one\u7c7b\u7684\u5b9e\u4f8b\u3002 var run_demo_one = function(){ \/\/ \u521b\u5efa\u7c7bClass_one\u7684\u4e00\u4e2a\u5b9e\u4f8b\uff0c\u540d\u79f0\u4e3ademo_1 var demo_1 = new Class_one(); \/\/ \u663e\u793ademo_1\u4e2d\u7684\u53d8\u91cf alert( &hellip; <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[120,104,328,123],"class_list":["post-641","post","type-post","status-publish","format-standard","hentry","category-coding","tag-AJAX","tag-JavaScript","tag-mootools","tag-123"],"views":8261,"_links":{"self":[{"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/posts\/641","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/comments?post=641"}],"version-history":[{"count":0,"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/posts\/641\/revisions"}],"wp:attachment":[{"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/media?parent=641"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/categories?post=641"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fdream.net\/blog\/wp-json\/wp\/v2\/tags?post=641"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}