摘要:基本的学习思路是跟着框架设计这本书,甚至可以说是这本书的读书笔记。也参考很多网上解读的博客和学习资料。当然,最重要的资料还是框架的源代码。后来由于开发者反对,新兴的框架都在命名空间上构建。
JavaScript框架学习笔记(一) 我为什么要学习框架
更深入的理解工具,以后用起来更顺手而且也能做一定的工具取舍,学习理解新工具也就更快,
对提升js水平也很有帮助,框架有很多解决“坑”的经典思路,学习这些对提升开发能力很有帮助。
基本的学习思路是跟着《JavaScript框架设计》这本书,甚至可以说是这本书的读书笔记。也参考很多网上解读jquery的博客和学习资料。当然,最重要的资料还是框架的源代码。
基本学习的框架就是jQuery,也会看看其他库的实现
我不是大神,很多知识估计也没有理解正确,欢迎指出,仅供参考。
1 种子模块 1.1 解决命名空间问题早期的一些prototype.js库并没有命名空间,它的意义是渗透到JavaScript,DOM中去,希望对原生对象的原型进行扩展。后来由于开发者反对,新兴的框架都在命名空间上构建。
一般的写法都是使用IIFE解决,一般如下两种写法:
(function foo(){...})() (function(){}(..))
两种写法功能上是一致的.
IIFE可以把他们当函数调用比传递参数。
(function IIFE(global){ //code })(window)
一般都是将window传递进去,但现在很多js的非游览器应用领域没有window,所以jquery一些处理办法是又接受一个factory参数:
For CommonJS and CommonJS-like environments where a proper window
is present, execute the factory and get jQuery.
For environments that do not have a window with a document(such as Node.js), expose a factory as module.exports.
This accentuates the need for the creation of a real window.e.g. var jQuery = require("jquery")(window);
很多前端框架都想要$这个命名空间,jQuery一开始很弱小,但又想要跟多人使用,因此实现了一种多库并存的机制。后成为很多小库的标配,实现很简单:
var // Map over jQuery in case of overwrite _jQuery = window.jQuery, // Map over the $ in case of overwrite _$ = window.$; jQuery.noConflict = function( deep ) { if ( window.$ === jQuery ) { window.$ = _$; } if ( deep && window.jQuery === jQuery ) { window.jQuery = _jQuery; } return jQuery; };
其实就是先把可能存在同名变量保存起来,再放回去。当用户执行
jQuery.noConflict();
就将$的控制权交出去,以后执行$()的时候就是其他库了,如果将deep变量传入true,则将jQuery的控制权也交出去了。
1.2 对象扩展很多库在扩展方法里还需判断是否覆盖和合并问题,但基本实现对库的扩展比较简单,就是添加一个对象罢了。
function extend(destination,source){ for(var destination in source){ destination[property] = source[property]; } return destination; }1.3 数组化
这个解决的问题是讲很多像document.getElementByTagName()方法返回的HTMLCollection或者NodeList这样的类数组转化为数组。
为什么做这样转化,因为数组有很多便利的操作。
各个库的实现原理核心也就是调用Array.prototype.slice.call(arguments);这个方法。
js的经典问题:isXXX系列。主要是js的typeof这些自带的检测方法不靠谱.这类方法在框架实现来说很重要,但说实话自己没怎么仔细看,因为要考虑各个游览器的兼容,感觉都是带有很技巧方面的知识,暂且翻过。
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/79277.html
摘要:具体来说,包管理器就是可以通过命令行,帮助你把外部库和插件放到你的项目里面并在之后进行版本升级,这样就不用手工复制和更新库。现在有的包管理器主要是和。 一、基础 1、学习HTML基础 HTML给你的网页赋予了结构。它就像是人的骨架那样让你保持站立。首先你需要去学习语法以及它必须提供的一切。你的学习应该聚焦在下面这些东西上: 学习HTML基础,了解如何编写语义HTML 理解如何把网页分...
摘要:在互联网高速发现的今天,可以说每天都在变化着一不留神你就会错过一个亿,所以你不得不时刻的保持着高度的专注。如今为代表的三个框架已然成为了主流成为统治者,呈现了三分天下的局面。有人说如今是框架的时代,只要会一个框架就能开始干活了。 在互联网高速发现的今天,可以说每天都在变化着一不留神你就会错过一个亿,所以你不得不时刻的保持着高度的专注。 互联网的信息是多元的,大量的,在海量的信息中很容易...
摘要:网上有很多前端的学习路径文章,大多是知识点罗列为主或是资料的汇总,数据量让新人望而却步。天了解一个前端框架。也可以关注微信公众号晓舟报告,发送获取资料,就能收到下载密码,网盘地址在最下方,获取教程和案例的资料。 前言 好的学习方法可以事半功倍,好的学习路径可以指明前进方向。这篇文章不仅要写学习路径,还要写学习方法,还要发资料,干货满满,准备接招。 网上有很多前端的学习路径文章,大多是知...
阅读 929·2021-11-24 10:30
阅读 2294·2021-10-08 10:04
阅读 3910·2021-09-30 09:47
阅读 1395·2021-09-29 09:45
阅读 1409·2021-09-24 10:33
阅读 6199·2021-09-22 15:57
阅读 2324·2021-09-22 15:50
阅读 4059·2021-08-30 09:45