1. 前言:

其实本文有点太标题党了,哈哈,见谅。说“声讨”,就是说说我作为一个《jQuery技术内幕》一个忠实读者,读本书的一些想法和建议。

2014年2月20日,我收到了《jQuery技术内幕》,密密麻麻600多页。到今天4月9日,我已经看了400多页(除却sizzle的一部分没看,因为那块实在是看不懂,就先略过)。

我买了书,当时花了大约80元,而且认认真真的看了一大半,后面的部分我还会继续看下去。也算是一个忠实的读者。

学习新知识,总是一个痛苦的过程,期间也是痛并快乐着。总结痛苦的原因,一方面解读jQuery源码确实是一个庞大的工程,另一方面,也觉得作者在写书的时候漏掉了许多。

书看了一半多,总是想着写点什么。想来想去,印象最深的,是觉得作者没有给读者一个“台阶”,而是直接拔高到了源码的层面,一行一行的解读、注释。详细解读源码并没有什么不好,但是在解读每行的源码之前,应该想说点什么,把读者带进去。

下面我说几个例子:

例1. jQuery('div')到底是个什么对象?

本书一上来就是构建jQuery对象,列出了N中构建jQuery对象的方式,有DOM元素、字符串、函数等等。但是读者看了好大一部分篇幅之后,都不知道这些构建的对象,到底是什么?这些代码的最终结果是什么?到底为谁服务?以及对Jquery对象进行各种操作的时候,由于不明白它的结构而产生迷惑。

恰巧,当时我在看这本书的同时,也正在看miaov.com的视频教程,教程里面的讲师就及早的提到了这一点。例如:

jQuery('div')返回的,其实是一个对象,加入页面中有3个div元素,那么这个对象就会创建“0”、“1”、“2”这三个属性,分别指向这三个DOM对象,length属性记录个数。这样就不会让我们误以为jQuery('div')是一个数组。

我当时问过许多人,jQuery('div')是个什么对象,他们都误以为是一个数组,后来我跟他们说jQuery('div')是一个object,不是数组。

(题外话:jQuery('div')既然是object,那么JSON.stringify(jQuery('div'))会出错,为什么?因为jQuery('div')里面的DOM元素存在着循环引用。)

有些人可能会说:那是你自己懒,你不会去chrome中跟踪以下吗?   如果非要那么严格要求读者,就继续看下一例子。

例2. 属性操作中,“修正对象”是什么?

记得当时看这一段的时候,我都懵了,从来没接触过“修正对象”这个概念,满篇提到的get,set到底是什么东西?

现在回头再看,这些问题确实迎刃而解,但是当时确实不知道,于是就凑合着往前看,终于看到最后才算明白了,修正对象就是为了解决浏览器兼容性,分离除了的处理浏览器“个性”需求的方法。

一般情况下的html/DOM属性操作,可能通过简单的赋值或者设置就可以完成,但是有一些是需要照顾浏览器个性的,例如浏览器不支持getAttribute()该怎么办,更多例子可参见jQuery.support。jQuery把这些特殊情况,分离出来,集中到一个叫做“修正对象”的对象中,通过设置set和get来操作。因此,在获取一个html/DOM属性时,jQuery会先检查是否符合修正对象里的情况,如果符合就调用get来返回值,如果不符合,就用最基本的操作返回值。

如果本书在该章节前面,加这样一段解释,以例子或者流程图的形式展示更好,先把修正对象、get、set、的意义大体说一遍,让读者心里有个谱,我想读起来会轻松许多。

例3. jQuery的事件存储结构是怎样的?

正是我现在看的章节,现在才算稍微明白一点。书中之前介绍过,事件存储在jQuery.cache中,不是直接用div1.onclick=function(){...}的方式。但是写到事件这一章节,没有再深入介绍,即直接上来代码解释了。看它代码中各种取值赋值,看的很难受,不知道从哪里取出,也不知道赋值到哪里去。

我觉得我现在像是个警察再查找一个案件的线索一样,探寻着代码中的蛛丝马迹,再加上自己看一些博客,才算稍微明白点事件的存储结构,待完全明白估计得把这一章看完,然后再重新梳理一遍才行。

            elemData = $.data(div1);    //div1对应的缓存

            handle = elemData.handle;   //主监听函数(统一触发、执行其他函数)

            events = elemData.events;   //elemData.events
handlers = events["click"]; //click 对应的监听对象数组
handlers.push(handleObj); //监听对象数组中存储了若干个监听对象
//handleObj又包含了事件类型、触发函数等等各类信息

另外,还有一个重要信息:事件既然被jQuery给重新规定了格式,那么“事件冒泡”肯定是没有了,怎么办呢? jQuery在事件执行的时候自己来模拟冒泡,这一点如果不明白,看代码也会遇到许多疑惑。

总结:

说了这么多,我想大家也应该明白我的意思了。

《技术内幕》是一本很不错的书,我也很佩服作者的功力,自己看着人家的书,理解都那么费劲,何况作者写书呢。

如果《技术内幕》能够出第二版,希望作者能采纳我的建议,多加一些解释性的东西,多加一些“台阶”。

“声讨”高云的《jQuery技术内幕》的更多相关文章

  1. 《jQuery技术内幕:深入解析jQuery架构设计与实现原理》

    <jQuery技术内幕:深入解析jQuery架构设计与实现原理> 基本信息 作者: 高云 出版社:机械工业出版社 ISBN:9787111440826 上架时间:2014-1-10 出版日 ...

  2. 【jquery】 【jQuery技术内幕】阅读笔记 一

    jQuery( object ) jquery在构造对象时,除了可以用十分好用的css选择器来查找DOM,还可以传入一个javascript对象来生成一个jquery对象. // JS var foo ...

  3. jQuery技术内幕电子版5

    4. 转换HTML代码为DOM元素 先创建一个文档片段DocumentFragment,然后调用方法jQuery.clean(elems, context, frag-ment, scripts)将H ...

  4. jQuery技术内幕电子版4

    参数selector是复杂HTML代码 则利用浏览器的innerHTML机制创建DOM元素 第157行:如果HTML代码满足缓存条件,则在使用转换后的DOM元素时,必须先复制一份再使用,否则可以直接使 ...

  5. jQuery技术内幕预览版.pdf3

    jQuery.fn.init(selector,context,rootjQuery):构造函数 jQuery.fn.init() 负责解析参数 selector 和 context 的类型,并执行相 ...

  6. jQuery技术内幕预览版.pdf2

    第二章 构造jQuery对象 jQuery对象是一个类数组对象,含有连续的整型属性.length属性和大量的jQuery方法,$()是jQuery()的缩写 构造函数jQuery() 如果调用构造函数 ...

  7. jQuery技术内幕预览版.pdf1

    第一章 总体构架 jQuery模块可以分为3部分:入口模块.底层支持模块和功能模块 浏览器功能测试模块提供了针对不同浏览器功能和bug的测试结果,其它模块基于测试结果解决浏览器之间的兼容性问题 回调函 ...

  8. 《JQuery技术内幕》读书笔记——自调用匿名函数剖析

    Javascript语言中的自调用匿名函数格式如下: (function(){ //do somethings })(); 它还有另外两种等价写法如下: //等价写法一 (function(){ // ...

  9. 跌跌撞撞的看完了《jquery技术内幕》

    今年2月20日买的书,今天是5月26,三个月来,除了周末休息一天,如果没有特殊情况,我都会每晚花两个小时看这本书,以及查各种与jquery源码相关的资料.今天总算是跌跌撞撞的看完了,有点小激动,也有点 ...

随机推荐

  1. js基础学习笔记(六)

    事件(可以被 JavaScript 侦测到的行为) 主要事件表: 加载事件(onload) 事件会在页面加载完成后立即发生,同时执行被调用的程序. 卸载事件(onunload) 当用户退出页面时(页面 ...

  2. MIT Molecular Biology 笔记4 DNA相关实验

    视频  https://www.bilibili.com/video/av7973580?from=search&seid=16993146754254492690 教材 Molecular ...

  3. POJ3258--River Hopscotch(Binary Search similar to POJ2456)

    Every year the cows hold an event featuring a peculiar version of hopscotch that involves carefully ...

  4. VirtualBox 安装 CentOS6.5 教程

    VirtualBox安装 CentOS6.5教程 1.选择第一个进行安装 2.选择右面的 skip 进入安装 3.点击next 4.选择中文简体 5.选择美式键盘 6.选择第一个 7.输入主机名 8. ...

  5. [violet2]sillyz

    题意:定义S(n) = n*各数位之积,然后给定L<=R<=10^18,求有多少个n在[L,R]区间内 思路: 看了半天无从下手..看完题解才豁然开朗.. 具体思路看vani神博客吧.讲的 ...

  6. 前端与后台服务交互--json处理的流程以及用到的工具代码

    现在的开发趋势基本上是前后端分离,并且前端和后端的交互一般是用json: 前端: 前端一般传输的是对象,那把对象变成json,需要引用的是json2.js这个js文件中的JSON.stringfy() ...

  7. 编写高质量iOS与OS X代码的52个有效方法

    第一章重点: 第一条:OC的起源 OC由smalltalk语言演化而来的语言为消息结构(messaging structure)语言,其运行时所因执行的的代码由运行环境来决定:函数调用(functio ...

  8. double float的精度问题

    三部曲 1: #include <iostream> #include <stdio.h> #include <string.h> using namespace ...

  9. nginx 执行理解

    nginx是一个代理(apache)或者自己处理 location ~ \.php { try_files $uri =404; fastcgi_pass unix:/tmp/php-cgi.sock ...

  10. @requestParamore与@pathvariable的区别

    http://localhost:8080/Springmvc/user/page.do?pageSize=3&pageNow=2 你可以把这地址分开理解,其中问号前半部分:http://lo ...