首頁 > 開發者 > JavaScript
標籤：javascript
首先看一個頁面常用的js代碼骨架
<!DOCTYPE html><html><head><meta charset="utf-8"/><title>js面對對象編程</title></head><body><script type="text/javascript" src="../js/lib/jquery-1.11.0.js"></script><script type="text/javascript">;(function($){ var Obj = function(){//定義一個類 console.log(this);//==>Obj this.init(); } Obj.prototype = {//對象原型 ObjName:"我是一個對象", saySomething:function(){ console.log(this.ObjName); }, init:function(){ this.saySomething(); } }; var Obj2 = function(){}Obj2.prototype = new Obj();//類的繼承console.log("Obj2.ObjName:"+new Obj2().ObjName); //==>Obj2.ObjName:我是一個對象Obj2.prototype.ObjName = "我繼承了Obj.ObjName並且重寫了它";console.log("Obj2.ObjName:"+new Obj2().ObjName); //==>Obj2.ObjName:我繼承了Obj.ObjName並且重寫了它Obj2.prototype.print = function print(str){ console.log("輸出"+str);}; $(document).ready(function($) { var obj = new Obj();//執行個體化類 ==>輸出：我是一個對象 var obj2 = new Obj2();//執行個體化類 ==>輸出：我是一個對象console.log("Obj2.ObjName:"+obj2.ObjName); //==>Obj2.ObjName:我繼承了Obj.ObjName並且重寫了它obj2.print(‘試試‘);//==>"輸出試試"" console.log(this);//==>#document }); console.log(this);//==>Window})(jQuery);console.log(this);//==>Window</script></body></html> |
程式碼分析 一、立即執行函數運算式IIFE IIFE immediately-invoked function expression 寫法一(function($){...})(jQuery); 寫法二(function($){...}(jQuery)); 其作用相當於 var a = function($){...}; a(jQuery); 讓編寫的代碼能立即執行。
二、function(){} 在javascript中定義類函數都是funciton。 三、Obj.prototype類原型 可以像上面那樣寫在一起也可以分開寫成 Obj.prototype.a = "我是字串"; Obj.prototype.b = { name:"我是對象" }; Obj.prototype.c = [‘我是‘,‘數組‘]; Obj.prototype.d= function(){ return ""; 我是函數 }; 四、$(document).ready(function(){...}); 因為html文檔是順序執行的所以如果代碼是寫在所有文件項目之後這個$(document).ready()可以省略 五、js代碼前的分號;或加號(+)是為了避免前一個js文檔如果沒有用分號結尾造成的文檔錯誤。 |
本文出自 “木香薔薇” 部落格，轉載請與作者聯絡！
javascript物件導向編程筆記
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
