Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
閱讀原始碼 - 再戰十年的 jQuery
Search
高見龍
July 31, 2022
Programming
1
790
閱讀原始碼 - 再戰十年的 jQuery
- 檢視 jQuery 設計架構
- 欣賞一些有趣的寫法
- 理解設計原理後,試著復刻一個陽春版的 jQuery
高見龍
July 31, 2022
Tweet
Share
More Decks by 高見龍
See All by 高見龍
為你自己學 Python
eddie
0
520
Generative AI 年會小聚 - AI 教我寫程式
eddie
0
56
讓數據說話:用 Python、Prometheus 和 Grafana 講故事
eddie
0
510
AI 時代的程式語言學習法
eddie
0
91
前端模組解放運動 - importmap
eddie
0
1.3k
Git 和 DevOps - 在混亂的流星群開發流程中找到小確幸
eddie
1
1.1k
模組化前端開發:從亂七八糟到組織有序
eddie
0
1.5k
被 Vue 框架耽誤的建置工具
eddie
2
980
開開心心寫測試,你的程式碼也會微笑
eddie
1
1.2k
Other Decks in Programming
See All in Programming
ErdMap: Thinking about a map for Rails applications
makicamel
1
730
return文におけるstd::moveについて
onihusube
1
1.4k
盆栽転じて家具となる / Bonsai and Furnitures
aereal
0
1.9k
DevinとCursorから学ぶAIエージェントメモリーの設計とMoatの考え方
itarutomy
0
180
どうして手を動かすよりもチーム内のコードレビューを優先するべきなのか
okashoi
3
900
自分ひとりから始められる生産性向上の取り組み #でぃーぷらすオオサカ
irof
4
1.7k
Flatt Security XSS Challenge 解答・解説
flatt_security
0
740
責務を分離するための例外設計 - PHPカンファレンス 2024
kajitack
9
2.4k
ATDDで素早く安定した デリバリを実現しよう!
tonnsama
1
2k
Swiftコンパイラ超入門+async関数の仕組み
shiz
0
180
『改訂新版 良いコード/悪いコードで学ぶ設計入門』活用方法−爆速でスキルアップする!効果的な学習アプローチ / effective-learning-of-good-code
minodriven
28
4.3k
カスタムエフェクトプラグインで Atom Craft をいい感じにする@ADX / ADX LE勉強会 vol.1
cox2
0
110
Featured
See All Featured
Building Better People: How to give real-time feedback that sticks.
wjessup
366
19k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.1k
Automating Front-end Workflow
addyosmani
1366
200k
RailsConf 2023
tenderlove
29
980
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
39
1.9k
The Cost Of JavaScript in 2023
addyosmani
46
7.2k
The Language of Interfaces
destraynor
155
24k
Building Flexible Design Systems
yeseniaperezcruz
328
38k
BBQ
matthewcrist
85
9.4k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
174
51k
Adopting Sorbet at Scale
ufuk
74
9.2k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
27
1.5k
Transcript
ޒഒላӃ ࠶ፌेɽK2VFSZ 高見龍
ޒഒላӃ ࣗզհ
ޒഒላӃ a.k.a Eddie 愛現! 喜歡冷門的玩具 開發者 / 講師 / 電腦書作者
技術推廣、教育、技術諮詢 台灣、日本等國內外技術研討會講者 部落格:https://kaochenlong.com 高見龍 @eddiekao
ޒഒላӃ 第25刷 發售中 發售中 發售中
ޒഒላӃ 已絕版
ޒഒላӃ 敬請 期待
ޒഒላӃ 歡迎加 好友
ޒഒላӃ ຊจ։࢝
ޒഒላӃ ฏৗ༗ࡏሜ+BWB4DSJQU嗎ʁ 🙋
ޒഒላӃ ᡒ說ݱࡏେՈࡏሜ7"3
ޒഒላӃ 7"37VF "OHVMBS 3FBDU
ޒഒላӃ ྃɼؐ༗ਓ
ޒഒላӃ ؐ༗ਓࡏሜK2VFSZ嗎ʁ 🙋
ޒഒላӃ શੈքࢢ佔࠷ߴతલ݅ʁ
ޒഒላӃ ૢ࡞ᖣ᧸ثత%0.݅
ޒഒላӃ ލᖣ᧸ثࢧԉʂ
ޒഒላӃ ஐܛ݁থ
ޒഒላӃ େᢇ၊ઃҰԼ w 你ಓᏓᏐత4DPQFੋॄኄ w 你ಓॄኄੋ'VODUJPO w ἦ಄വᏐ w **'&ʢ*OUFSNFEJBUF*OWPLF'VODUJPO&YQSFTTJPOʣ
w 你ಓ+BWB4DSJQUཫత݅ಋੋዎኄճࣄ w 1SPUPUZQF᪑OFXత᮫ w 你ಓUIJTዎኄ
ޒഒላӃ -JWFʂ
ޒഒላӃ ֢ॏᴍʂ
ޒഒላӃ (function(global, factory) { ...略... })(typeof window !== "undefined" ?
window : this, ...略... L14 ~ L40 IIFE 起⼿式
ޒഒላӃ ...略... ...略..., function(window, noGlobal) { ...略... return jQuery; });
L40 ~ L10880 jQuery 本體
ޒഒላӃ var version = "3.6.0", jQuery = function(selector, context) {
return new jQuery.fn.init(selector, context); }; L157 ~ L162 jQuery 定義
ޒഒላӃ var Sizzle = ( function( window ) { var
i, ...略... return Sizzle; } )( window ); L523 ~ L2978 Sizzle.js
ޒഒላӃ jQuery.find = Sizzle; jQuery.expr = Sizzle.selectors; L2982 ~ L2983
把 Sizzle 灌給 jQuery
ޒഒላӃ init = jQuery.fn.init = function( selector, context, root )
{ var match, elem; // HANDLE: $(""), $(null), $(undefined), $(false) if ( !selector ) { return this; } ...略... return jQuery.makeArray( selector, this ); }; L3137 ~ L3234 初始化在這裡!
ޒഒላӃ init.prototype = jQuery.fn; L3237 讓 new 出來的 jQuery 物件,享
有整個 jQuery 的 prototype
ޒഒላӃ jQuery.event = { global: {}, add: function( elem, types,
handler, data, selector ) { ...略... } ...略... }; L5190 ~ L5607 事件處理
ޒഒላӃ ajax: function( url, options ) { if ( typeof
url === "object" ) { options = url; url = undefined; } ...略... return jqXHR; }, L9378 ~ L9824 ajax
ޒഒላӃ var _jQuery = window.jQuery, _$ = window.$; jQuery.noConflict =
function(deep) { if (window.$ === jQuery) { window.$ = _$; } if (deep && window.jQuery === jQuery) { window.jQuery = _jQuery; } return jQuery; }; L10850 ~ L10868 如果有衝突的話...
ޒഒላӃ if ( typeof noGlobal === "undefined" ) { window.jQuery
= window.$ = jQuery; } L10850 ~ L10868 把 jQuery 放到全域變數
ޒഒላӃ 歡迎加 好友