js本身不是面向?qū)ο笳Z言,在我們實際開發(fā)中其實很少用到面向?qū)ο笏枷?以前一直以為當要復用的時候才封裝成對象,然而隨著現(xiàn)在做的項目都后期測試階段發(fā)現(xiàn)面向?qū)ο蟮淖饔貌粌H僅只是復用,可能你們會說面向?qū)ο筮€有繼承,多態(tài)的概念,但在javascript里面多態(tài)的概念是不存在,而繼承由于web頁面的必須先下載js在運行導致js的繼承不能像后臺那么靈活而且js沒有重載以及重寫不方便(而且js中重寫的意義不是很大),所以在js中很少用到面向?qū)ο?可能在一些插件中會看到對象的寫法,寫js的都會有同樣的感覺在寫一個插件的時候一般是先用面相過程把插件功能寫出來,然后在重構改成對象的方法.但在實際項目開發(fā)中要求時間進度和開發(fā)成本很少會有那么寬松的時間讓你先用面向過程實現(xiàn)功能在重構.實際開發(fā)中我們基本都是用面相過程寫完就直接提交了.

   這種寫法發(fā)現(xiàn)一個問題就是,當你把這個頁面的寫完了之后過一段時間突然這個頁面的功能需求或是頁面布局要調(diào)整,你在看這個頁面的代碼,一下很難快速的把整個頁面的代碼邏輯步驟梳理清楚,我相信很多寫前端都要同感吧! 舉個例子:我?guī)啄昵皩懙姆糯箸R插件,現(xiàn)在我在放出來發(fā)現(xiàn)我寫的這個插件在谷歌瀏覽器第一次渲染的時候沒有效果,代碼如下:

復制代碼
 1 /// <reference path="../jquery11.js" />
  2 (function ($) {
  3     $.fn.extend({
  4         jqoom: function (potions) {
  5             var settings = {
  6                 width: 350,
  7                 height: 350,
  8                 position: "right"
  9             }
 10             if (potions) {
 11                 $.extend(settings, potions);
 12             }
 13             var ImgUrl = $("img", this).attr("src");
 14             var ImgMinWidth = $("img", this).width();
 15             var ImgMinHeigth = $("img", this).height();
 16             var ImgWidth = 0;
 17             var ImgHeight = 0;
 18             var de = true;
 19 
 20             $(this).hover(function (e) {
 21             }, function () {
 22                 $("#jqoomz").remove();
 23                 $(document).unbind("mousemove");
 24                 $("#jqoomy").remove();
 25 
 26                 de = true;
 27             });
 28             $("img", this).hover(function (e) {
 29                 var pagex = e.x || e.pageX;
 30                 var pagey = e.y || e.pageY;
 31                 var pagex1 = 0;
 32                 var pagey1 = 0;
 33          
        
		

網(wǎng)友評論