jQuery，zepto源碼的簡單實現記錄

Dean 發布于2019-08-23 16:47 / 3492人閱讀

摘要：本文記錄，對的一些封裝庫的知識，我希望從本文開始去深入學習這門語言，以及在面向對象，原型上封裝的使用。讓自己在方面有能夠有一定進步。

本文記錄jQuery，Zepto對js的一些封裝庫的知識，我希望從本文開始去深入學習js這門語言，以及在面向對象，原型上封裝的使用。讓自己在js方面有能夠有一定進步。共勉

jQuery庫 簡單的jQuery庫的實現

需要先了解閉包，立即執行函數以及JavaScript原型的概念

(function(window) {
    var jQuery = function(selector) {
        // 一個對象工廠，以后生成新對象就不用new了，直接執行這個方法即可
        // 第一步就用new 關鍵字來實例化一個構造函數
        return new jQuery.fn.init(selector);
    }
    // 定義構造函數
    var init = jQuery.fn.init = function(selector) {
        var slice = Array.prototype.slice;
        var dom = slice.call(document.querySelectorAll("*"));
        var i, len = dom.length;
        for(i = 0; i < len; i++) {
            this[i] = dom[i];
        }
        this.length = len;
        this.selector = selector || "";
    }
    
    jQuery.fn = jQuery.prototype = {
        // 改變構造器的指向
        constructor: jQuery,
        css: function(key, val) {
        
        },
        html: function(val) {
            
        }
    }
    
    // 連接初始化實例的原型
    // init.prototype = jQuery.fn;
    jQuery.fn.init.prototype = jQuery.fn;
})(window);

Zepto庫 簡單的zepto庫的實現

(function(window) {
    var zepto = {};

    function Z(dom, selector) {
        var i,
      len = dom ? dom.length : 0;
    for(i=0; i
附上待學習連接：
[幾個JS代碼手寫專題](https://www.imooc.com/article/23902)

GPU云服務器云服務器 js實現的簡單特效簡單的php購物源碼簡單的php系統源碼用c實現簡單的shell

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/103285.html

Zepto 源碼分析 1 - 進入 Zepto

摘要：選擇的理由是一個用于現代瀏覽器的與大體兼容的庫。環境搭建分析環境的搭建僅需要一個常規頁面和原始代碼一個常規頁面打開的首頁即可，在開發人員工具中即可使用原始代碼本篇分析的代碼參照，進入該代碼分支中即可。選擇 Zepto 的理由 Zepto is a minimalist JavaScript library for modern browsers with a largely jQue...

Aklman 2019-08-26 13:21 評論0 收藏0
Zepto 源碼分析 2 - Polyfill 設計

摘要：此模塊包含的設計思路即為預以匹配降級方案。沒有默認編譯該模塊，以及利用該模塊判斷后提供平臺相關邏輯的主要原因在于其設計原則的代碼完成核心的功能。此處，也引出了代碼實現的另一個基本原則面向功能標準，先功能覆蓋再優雅降級。在進入 Zepto Core 模塊代碼之前，本節簡略列舉 Zepto 及其他開源庫中一些 Polyfill 的設計思路與實現技巧。涉及模塊：IE/IOS 3/Dete...

chuyao 2019-08-26 13:22 評論0 收藏0
庫，組件，框架 - 收藏集 - 掘金

摘要：哈哈，我理解，架構就是骨架，如下圖所示譯年月個有趣的和庫前端掘金我們創辦的使命是讓你及時的了解開發中最新最酷的趨勢。翻譯 | 上手 Webpack ? 這篇就夠了！ - 掘金譯者：小 boy （滬江前端開發工程師）本文原創，轉載請注明作者及出處。原文地址：https://www.smashingmagazine.... JavaSrip... 讀 Zepto 源碼之代碼結構 - ...

tommego 2019-08-20 16:33 評論0 收藏0
zepto源碼分析之form模塊

摘要：形如源代碼在的原型上添加了相關方法。類似源代碼每個表單的和都通過編碼最后通過符號分割有了的基礎，就是將相應的和都通過編碼，然后用符號進行分割，也就達到了我們要的結果。前言 JavaScript最初的一個應用場景就是分擔服務器處理表單的責任，打破處處依賴服務器的局面，這篇文章主要介紹zepto中form模塊關于表單處理的幾個方法，serialize、serializeArray、sub...

Muninn 2019-08-21 16:51 評論0 收藏0