元数据

JavaScript入门经典(第7版)

  •  JavaScript入门经典(第7版)|200
  • 书名: JavaScript入门经典(第7版)
  • 作者: 菲尔·巴拉德
  • 简介: 本书主要介绍JavaScript现有的主要特性,涵盖了JavaScript基础知识、编程方法、对象、HTML5和CSS3、JavaScript库、代码调试等内容。全书分为六个部分(包括24章和一个附录),从基本概念入手,逐步引申到按照当今Web标准编写JavaScript代码的方式,非常利于初学者学习参考。
  • 出版时间 2019-05-01 00:00:00
  • ISBN: 9787115509383
  • 分类: 计算机-编程设计
  • 出版社: 人民邮电出版社
  • PC地址:https://weread.qq.com/web/reader/50d324e07193f22050d8a31

高亮划线

1.1 Web脚本编程基础

📌 这些脚本通常运行在Web服务器上,而且是在生成请求的页面并提供给用户之前运行的。因此,我们称之为服务器端脚本(server-side scripting)。 ⏱ 2020-06-30 21:39:26

📌 这些脚本的主要功能包括动画页面的部分内容,重新安排页面布局,允许用户在页面内拖放元素,验证用户在表单里输入的内容,把用户重定向到其他页面,等等。我们自然而然地将这些脚本称为客户端脚本(client-sidescripting)。 ⏱ 2020-06-30 21:39:33

📌 本书主要介绍JavaScript,它是互联网上应用最广泛的客户端脚本语言。 ⏱ 2020-06-30 21:39:17

📌 由于JavaScript代码只在用户浏览器内部运行,页面会对JavaScript指令做出快速响应,从而增强了用户的体验,使得Web应用更像在用户的本地计算机运行的程序而不只是一个页面。 ⏱ 2020-06-30 22:14:52

📌 “文档对象模型”(Document Object Model,DOM)是对文档及其内容的抽象表示。 ⏱ 2020-06-30 22:20:30

📌 每次浏览器要加载和显示页面时,都需要解释(更专业的术语是“解析”)构成页面的HTML源代码。在解析过程中,浏览器建立一个内部模型来表示文档里的内容,这个模型就是DOM。在浏览器渲染页面的可见内容时,就会引用这个模型。可以使用JavaScript来访问和编辑这个DOM的各个部分,从而改变页面的显示内容和用户交互的方式。 ⏱ 2020-06-30 22:38:04

📌 浏览器每次加载和显示页面时,都在内存里创建页面及其全部元素的一个内部表示体系,也就是DOM。在DOM里,页面的元素具有一个逻辑化、层级化的结构,就像相互关联的父对象和子对象组成了一个树形的结构。 ⏱ 2020-06-30 23:47:50

📌 这个层级树的最顶端是浏览器window对象,它是页面的DOM表示中一切对象的父对象。 ⏱ 2020-06-30 23:48:07

📌 window对象的其他子对象还有location(包含着当前页面URL的详细信息)、history(包含浏览器以前访问的页面地址)和navigator(包含浏览器类型、版本和兼容的信息)。第4章将会更详细地介绍这些对象,其他章节也会使用它们,但目前我们着重于document对象。 ⏱ 2020-06-30 23:51:50

📌 这种表示法的最后一个部分除了可以是对象外,还可以是属性或方法: ⏱ 2020-06-30 23:52:40

📌 window对象永远包含当前浏览器窗口,所以使用window.document就可以访问当前文档。作为一种简化表示,使用document也能访问当前文档。 ⏱ 2020-06-30 23:52:55

📌 。window对象位于DOM层级的最顶端,代表了显示页面的浏览器窗口。当我们调用alert()方法时,浏览器会弹出一个对话框显示设置的信息,还有一个“确定”按钮。 ⏱ 2020-06-30 23:53:22

📌 可以不明确书写window.这部分。因为它是DOM层级结构的最顶层(有时也被称为“全局对象”),任何没有明确指明对象的方法调用都会被指向window ⏱ 2020-06-30 23:54:15

1.3 问答

📌 问:如果使用服务器端脚本(比如PHP或ASP),还能在客户端使用JavaScript进行编程吗?答:当然可以。事实上,这种组合方式能够形成一个有力的平台,实现功能强大的应用。Google Mail就是个很好的范例。问:应该对多少种不同的浏览器进行测试呢?答:方便的情况下越多越好。编写与标准兼容的、避免使用浏览器专用功能的代码,从而让程序在各个浏览器上都能顺畅运行,这不是一件简单的事情。浏览器在特定功能的实现上有一两处细微差别,但这总是难免的。问:包含JavaScript代码会不会增加页面加载的时间?答:会的,但通常这种影响很小,可以忽略不计。如果JavaScript代码的内容比较多,就应该在用户可能使用的最慢的连接上进行测试。除了一些极其特殊的情况,这一般不会成为什么问题。 ⏱ 2020-07-01 00:05:40

1.4 作业

📌 b.解释型语言 ⏱ 2020-07-01 00:05:58

📌 a. ⏱ 2020-07-01 00:06:06

📌 d.window对象 ⏱ 2020-07-01 00:06:11

📌 a.在一个模态对话框中,向用户发送一条消息

  • 💭 指在用户想要对对话框以外的应用程序进行操作时,必须首先对该对话框进行响应。 - ⏱ 2020-07-01 00:06:31

📌 b.document对象是window对象的子对象 ⏱ 2020-07-01 00:06:24

1.5 练习

📌 在不同的浏览器里运行本章的范例代码,观察页面显示情况有什么区别。 ⏱ 2020-07-01 00:10:24

第2章 创建简单的脚本

📌 本章将介绍如何向Web页面添加JavaScript,以及编写JavaScript程序的一些基本语法,比如语句、变量、操作符和注释。同时,本章将涉及更加实用的脚本范例 ⏱ 2020-07-01 00:11:34

2.1 在Web页面里添加JavaScript

📌 JavaScript代码是和页面内容一起发送给浏览器的 ⏱ 2020-07-01 00:12:15

📌 第一种方法是把JavaScript语句直接包含在HTML文件里 ⏱ 2020-07-01 00:12:56

📌 第二种方法,也是更好的方法,是把JavaScript代码保存到单独的文件,然后利用

📌 可以稍微提高一点性能。浏览器会把包含文件进行缓存,当前页面或其他页面再次需要使用这个文件时,就可以使用一个本地副本了。 ⏱ 2020-07-01 00:14:23

📌 外部文件中的JavaScript语句不能放到标签中,也不能使用任何HTML标签,只能是纯粹的JavaScript代码。 ⏱ 2020-07-01 00:29:44

📌 JavaScript可以放置到HTML页面的或区域里,但一般情况下,我们把JavaScript代码放到页面的区域,从而让文档的其他部分能够调用其中的函数。 ⏱ 2020-07-01 00:32:20

📌 当JavaScript代码位于文档的body区域时,在页面被呈现时,遇到这些代码就会解释和执行。 ⏱ 2020-07-01 00:32:06

📌 JavaScript代码不要试图访问没有定义的DOM元素,这一点很重要。 ⏱ 2020-07-01 00:32:37

2.2 编写JavaScript语句

📌 注释的确会略微增加JavaScript源文件的大小,从而对页面加载时间和代码性能产生不好的影响。一般来说,这种影响小到可以忽略不计,但如果的确需要消除这种影响,我们可以清除JavaScript文件里的全部注释,形成所谓的“产品”版本,用于实际的站点。出于这个目的,很多开发者提供他们的程序的所谓的“精简版”,其程序文件的大小是经过压缩的,并且所有的注释和空白都去掉了。你经常会遇到这样的精简版的文件,因为它们的文件名通常都有一个.min.js的后缀。 ⏱ 2020-07-01 00:34:10

2.3 变量

📌 变量可以看作一种被命名的分类容器,用于保存特定的数据。 ⏱ 2020-07-01 00:35:14

📌 变量可以用任何方式进行命名,但我们一般只使用字母、数字、美元符号($)和下画线。 ⏱ 2020-07-01 00:35:20

📌 JavaScript是区分大小写的,变量mypetcat和Mypetcat或MYPETCAT是不一样的。 ⏱ 2020-07-01 00:35:25

📌 JavaScript程序员和其他很多程序员习惯使用一种名为“骆驼大小写”(或被称为“混合大小写”等)的方法,也就是把各个单词或短语连写在一起,没有空格,每个单词的首字母大写,但整个名称的第一个字母可以是大写或小写。按照这种方式,前面提到的变量就应该命名为MyPetCat或myPetCat。 ⏱ 2020-07-01 00:35:31

📌 JavaScript不必如此。但变量声明是一个很好的编程习惯。在JavaScript里,你可以这样做: ⏱ 2020-07-01 00:35:48

2.4 操作符

📌 如果把操作符“+”用于一个字符串变量和一个数值变量,JavaScript会把数值转换为字符串,再把两个字符串连接起来: ⏱ 2020-07-01 00:37:58

2.7 问答

📌 空格、制表符和空行这类空白内容在JavaScript里是完全被忽略的。我们可以利用这些空白调整代码的布局,使代码更容易理解。 ⏱ 2020-07-01 15:49:20

2.8 作业

📌 b.为响应用户单击鼠标动作而执行的脚本 ⏱ 2020-07-01 15:50:16

📌 c.任意个 ⏱ 2020-07-01 15:49:42

📌 c.变量的名称可以包含空格 ⏱ 2020-07-01 15:49:48

📌 c.二者都是 ⏱ 2020-07-01 15:49:54

📌 a.将数值转换为一个字符串,并且将二者连接起来 ⏱ 2020-07-01 15:50:11

第3章 使用函数

📌 ,程序在执行过程中会反复完成相同的或类似的任务。为了避免多次重复编写相同的代码段,JavaScript把部分代码包装为能够重复使用的模块—称为函数(function) ⏱ 2020-07-01 15:55:03

📌 使用函数可以让代码更加易于调试和维护。 ⏱ 2020-07-01 15:55:08

3.2 调用函数

📌 在页面加载时,包含在函数定义区域内的代码不会执行,而是静静地等待,直到“调用”的时候才会执行。 ⏱ 2020-07-01 15:56:59

📌 函数名称与变量名称一样,是区分大小写的,如函数MyFunc()与myFunc()是不同的。与变量名称一样,使用含义明确的函数名称可以提高代码的易读性。 ⏱ 2020-07-01 15:57:14

📌 为了更好地发挥函数的作用,我们要采取更适当的方式,也就是把JavaScript代码放置到页面的区域 ⏱ 2020-07-01 15:58:33

📌 把函数放到文档的头部,就能够确保它们在被调用前已经被定义了。 ⏱ 2020-07-01 15:58:41

📌 如果函数中没有包含return语句,它将默认返回一个undefined值。 ⏱ 2020-07-01 16:01:59

3.5 作业

📌 c.函数名称及一对括号 ⏱ 2020-07-01 16:04:59

📌 c.返回一个值,函数停止执行 ⏱ 2020-07-01 16:05:06

📌 c.任何有效的JavaScript数据类型 ⏱ 2020-07-01 16:05:09

📌 b.作为参数传递给函数的一个值 ⏱ 2020-07-01 16:13:54

📌 a.称为匿名函数 ⏱ 2020-07-01 16:13:57

4.1 变量作用域

📌 变量能够使用的范围称为变量的“作用域”,因此可以称一个变量具有“局部作用域”或“全局作用域”。 ⏱ 2020-07-01 16:21:38

📌 在函数中使用this时,关键字this引用的“拥有”该函数的任何对象,即该函数的父作用域的内容。 ⏱ 2020-07-01 16:29:21

📌 很多其他编程语言允许变量有所谓的“块级作用域”(JavaScript中的一个语句块,包含一对花括号之间的所有内容)。有块级作用域的一个变量,将只能够由与变量定义相同的块之中的程序语句访问。 ⏱ 2020-07-01 16:43:39

📌 JavaScript最近的更新注意到了这一疏漏,于是用一个新的关键字let加以弥补,这个关键字允许你定义具有严格的块级作用域的一个变量。 ⏱ 2020-07-01 16:34:19

📌 让我们试着重新初始化它 ⏱ 2020-07-01 16:47:16

📌 JavaScript抛出了一个错误。可以看到,用const关键字声明的值不能重新初始化、重新声明或重新赋值。 ⏱ 2020-07-01 16:47:19

4.2 箭头函数

📌 JavaScript引入了一种更加精简的语法来编写这种函数,其中,箭头符号()用作一个匿名函数的缩写。这通常称为箭头函数(arrow function)。 ⏱ 2020-07-01 16:49:10

4.3 设置默认参数

📌 在函数定义中,有指定的默认值的参数,总是应该放在没有默认值的参数的后面。 ⏱ 2020-07-01 16:56:29

4.6 作业

📌 a.局部变量 ⏱ 2020-07-01 16:56:57

📌 b.是只读的 ⏱ 2020-07-01 16:57:07

📌 b.块级作用域 ⏱ 2020-07-01 16:57:09

📌 c.有该函数的对象 ⏱ 2020-07-01 17:00:15

📌 a.是一个匿名函数 ⏱ 2020-07-01 17:00:19

5.1 与用户交互

📌 术语“模态”(modal)意味着脚本暂时停止运行,页面与用户的交互也被暂停,直到用户关闭对话框为止 ⏱ 2020-07-01 17:01:31

📌 与alert()方法相同的是,confirm()也弹出一个模态对话框,向用户显示一些消息。不同的是,confirm()对话框为用户提供了一个选择,可以单击“OK”或“Cancel”按钮,而不只是一个“OK”按钮 ⏱ 2020-07-01 17:02:30

5.2 根据id选择元素

📌 对于很多DOM对象来说,innerHTML属性都是一个很好用的属性,可以读取或设置特定页面元素内部的HTML内容。 ⏱ 2020-07-01 17:09:04

5.3 访问浏览器历史记录

📌 在JavaScript里,浏览器的历史记录是用window.history对象来表示的,它基本上就是访问过的URL列表。history对象的方法让我们能够使用这个列表,但不能直接地操作这些URL。 ⏱ 2020-07-01 17:11:54

📌 history对象有三个方法,即forward()、backward()和go()。forward()和backward()方法相当于单击浏览器的“前进”和“后退”按钮,可以得到历史列表里下一个页面和前一个页面。 ⏱ 2020-07-01 17:12:03

📌 第三个方法是go(),它有一个参数,是正的或负的整数,可以跳到历史记录列表里的相对位置: ⏱ 2020-07-01 17:12:10

5.5 日期和时间

📌 任何对象都可以使用关键字with,但Math对象是最适合用来示范的。通过使用with,我们可以减少一些枯燥的键盘输入工作。 ⏱ 2020-07-01 20:27:43

📌 关键字with以对象作为参数,然后是一对花括号,其中包含着代码块。代码块里的语句在调用特定对象的方法时可以不必指定这个对象,因为JavaScript会假定这些方法是属于作为参数的那个对象的。 ⏱ 2020-07-01 20:28:09

5.8 作业

📌 a.true值返回到调用程序 ⏱ 2020-07-01 20:31:53

📌 b.Math.floor() ⏱ 2020-07-01 20:31:57

📌 c./documents/letter.htm ⏱ 2020-07-01 20:32:45

📌 a.var mydate = new Date(); ⏱ 2020-07-01 20:33:05

📌 c.以上二者都可以 ⏱ 2020-07-01 20:33:14

第二部分 JavaScript编程

📌 “数据类型”(data type)这个术语表示了变量包含数据的本质特征。 ⏱ 2020-07-01 20:43:21

📌 JavaScript属于“宽松类型”的编程语言,意味着JavaScript变量在不同的场合可以解释为不同的类型。 ⏱ 2020-07-01 20:43:24

📌 本章将介绍如何用JavaScript处理数值 ⏱ 2020-07-01 20:46:07

6.1 数值

📌 JavaScript支持整数和浮点数。 ⏱ 2020-07-01 20:48:14

6.2 全局方法

📌 JavaScript有一系列可用于操作数值的方法。这些都是全局方法(globalmethod),也就是说,在代码中的任何位置都能够使用它们。 ⏱ 2020-07-02 12:36:25

6.3 Number对象

📌 JavaScript用Number对象来表示各种数值类型,包括整数和浮点数。 ⏱ 2020-07-02 12:49:26

📌 当脚本试图把一些非数值数据当作数值处理,却无法得到数值时,其返回值就是NaN。 ⏱ 2020-07-02 12:52:41

6.4 Number()函数

📌 该函数将尽全力返回一个对等的数值。 ⏱ 2020-07-02 13:08:01

📌 UNIX时间(有时也称为POSIX时间)是描述时间的一种方式,并且是用从1970年1月1日(星期四)00:00:00 (UTC)开始所流逝过的毫秒数来表示的。 ⏱ 2020-07-02 13:10:43

📌 这样的一个值通常称为时间戳。 ⏱ 2020-07-02 13:14:07

6.9 作业

📌 c.NaN ⏱ 2020-07-02 13:20:39

📌 a.解析一个字符串并返回一个浮点数 ⏱ 2020-07-02 13:27:45

📌 b.True ⏱ 2020-07-02 13:28:13

📌 a.True

  • 💭 Boolean(0) — false,其余都是true - ⏱ 2020-07-02 13:28:29

📌 c.JavaScript将把true解释为1并且把false解释为0 ⏱ 2020-07-02 13:29:08

第7章 操作字符串

📌 我们还将学习字符串中的“转义序列”(escape sequence)。 ⏱ 2020-07-02 14:11:06

7.1 字符串

📌 字符串是由特定字符集(通常是ASCII或Unicode字符集)里的字符所组成的序列,通常用于保存文本内容。 ⏱ 2020-07-02 14:11:39

📌 然而,记住,如果想要在字符串中使用双引号,那么需要用单引号来表示字符串的范围: ⏱ 2020-07-02 14:32:10

📌 前面各章的范例里曾出现了用操作符“+”来连接字符串的情况,这称为字符串连接。 ⏱ 2020-07-02 14:41:12

📌 相反,JavaScript返回了一个新的字符串,它包含了连接后的内容。 ⏱ 2020-07-02 14:41:32

📌 indexOf()函数可以查找子字符串(由一个或多个字符组成)在另一个字符串里第一次出现的位置,返回子字符串在目标字符串里的索引(位置);如果没有找到,就返回-1。 ⏱ 2020-07-02 14:55:15

7.2 模板字符串

📌 如示例所示,我们通过将变量名包含在${ … }中来构建字符串。字符串将在运行时,用相关变量的当前值来构建。注意,模板字符串必须包含在两个反单引号(`)而不是标准的单引号之间。这一要求带来的一个方便的副作用是,可以在字符串中使用引号而不需要再进行转义。 ⏱ 2020-07-02 15:11:14

7.5 作业

📌 a.var paid = true; ⏱ 2020-07-02 15:22:24

📌 c.myString.indexOf(“is stupid”); ⏱ 2020-07-02 15:22:45

📌 b.31 ⏱ 2020-07-02 15:24:29

📌 a.换行 ⏱ 2020-07-02 15:24:31

第8章 数组

📌 在单独的一个变量名中存储多个变量值是有用的。JavaScript通过数组数据类型实现这一点。 ⏱ 2020-07-02 19:14:51

📌 我们放置到数组中的项,不一定都要是相同的类型。 ⏱ 2020-07-02 19:16:51

8.3 三点表示法

📌 JavaScript新增加的一个功能,是在变量名前面使用三个句点形式的一个操作符 ⏱ 2020-07-02 20:00:24

📌 假设想要从一个数值的数组中找出最小值 ⏱ 2020-07-02 20:12:42

8.6 作业

📌 c.9 ⏱ 2020-07-02 20:15:06

📌 b.var names = monthNames.join(” ”); ⏱ 2020-07-02 20:15:14

📌 c.-1 ⏱ 2020-07-02 20:15:22

📌 c.splice() ⏱ 2020-07-02 20:15:27

📌 a.将数组中的元素用逗号隔开并组合成的单个的字符串 ⏱ 2020-07-02 20:16:59

第9章 用JavaScript处理事件

📌 用JavaScript处理事件 ⏱ 2020-07-02 20:23:35

📌 我们往往想要让程序对于在环境中发生的事情做出响应,例如,这些事情可能是用户点击页面元素,也可能是一幅图像完成了载入。我们将这些情况称为事件(event) ⏱ 2020-07-02 20:24:17

9.2 事件处理器

📌 事件处理器是当JavaScript检测到一个特定的事件时所执行的一段代码。 ⏱ 2020-07-02 20:26:42

📌 现代浏览器支持一个名为addEventListener新的、更加灵活的方法。可以在所指定的任何DOM节点上调用addEventListener方法(而不只是页面元素上),并且当一个指定的事件发生时,触发所要执行的代码。 ⏱ 2020-07-02 20:35:15

📌 在addEventListener()函数内部,指定了第一个参数,这是我们想要注册这个处理器的事件的名称;第二个参数则指定了事件处理函数,我们想要运行该函数以响应被检测到的事件。 ⏱ 2020-07-02 20:36:26

📌 第二条语句将会有效地覆盖前一行代码,使得在点击该链接时,updateCounter()作为唯一会触发的函数。 ⏱ 2020-07-02 20:38:41

9.3 event对象

📌 如果事件处理代码能够获知与检测到的事件相关的更多详细的信息,这真的会很有用 ⏱ 2020-07-02 20:45:38

📌 DOM提供了一个event对象,其中包含了这种类型的信息。在一个事件处理函数中,可能会看到表示这个event的一个参数(通常用一个诸如event的名字来指定,或者直接用e来指定,尽管可以选择任何名称)。这个event对象将会自动传递给事件处理器。 ⏱ 2020-07-02 20:52:19

📌 在这样一种情况下,处理事件的通常的方式称为冒泡(bubbling)。假设内部元素上的事件先发生,然后“向上冒泡”到外围的元素, ⏱ 2020-07-02 21:37:24

📌 通过将第三个参数设置为true,可以使用所谓的捕获(capture)方法。使用捕获,将先触发和最外层的元素相关联的事件处理器,最后触发和最内存元素相关的事件处理器。 ⏱ 2020-07-02 21:39:55

📌 我们在本章前面所介绍的event对象,有一个名为stopPropagation()的方法,它就是干这件事情的——阻止任何进一步的冒泡或捕获 ⏱ 2020-07-02 21:41:17

📌 event对象的一个名为target的属性包含了这一信息,并且它在冒泡的过程中是不会改变的。 ⏱ 2020-07-02 21:57:53

9.5 问答

📌 对于事件e来说,e.screenX和e.screenY(分别)返回了鼠标相对于屏幕的左边和上边的像素数目。在e.clientX和e.clientY中,可以得到鼠标相对于浏览器窗口的左边和上边的像素数目,而e.pageX和e.pageY保存了鼠标相对于文档的左边和上边的像素数。 ⏱ 2020-07-02 21:58:53

9.6 作业

📌 c.onclick ⏱ 2020-07-02 22:00:54

📌 b.从最内层到最外层 ⏱ 2020-07-02 22:00:57

📌 a.true ⏱ 2020-07-02 22:02:04

📌 c.addEventListener()函数 ⏱ 2020-07-02 22:02:08

📌 b.能够接收事件的任何DOM对象 ⏱ 2020-07-02 22:02:21

10.2 循环和控制结构

📌 利用for…in循环可以操作任何对象的属性,无论是DOM对象、JavaScript内建对象还是我们创建的对象 ⏱ 2020-07-02 22:14:00

10.3 设置和使用定时器

📌 我们想要让程序延迟特定一段时间再执行JavaScript代码 ⏱ 2020-07-02 22:19:38

📌 为了做到这一点,JavaScript提供了两个有用的方法,它们分别是setTimeout()和setInterval()。 ⏱ 2020-07-02 22:19:43

📌 setTimeout(action, delay)方法在第2个参数所指定的那么多毫秒之后,调用作为第1个参数传入的函数(或者计算该表达式) ⏱ 2020-07-02 22:20:53

📌 如果稍后想要取消定时器函数,可以通过将该返回值传入clearTimeout()方法来引用它。 ⏱ 2020-07-02 22:21:28

📌 setInterval(action, delay)方法的工作方式和setTimeout()类似,但是,它并不是在执行作为第1个参数传递的语句之前强制进行延迟,而是会重复地执行,在两次执行之间,延迟第2个参数所指定的毫秒数。 ⏱ 2020-07-02 22:22:34

10.6 作业

📌 b.终止循环的条件永远不能达到 ⏱ 2020-07-02 22:24:20

📌 b.执行可选的默认情况,如果有默认情况的话 ⏱ 2020-07-02 22:24:43

📌 a.将总是至少执行一次 ⏱ 2020-07-02 22:27:43

11.1 什么是面向对象编程

📌 本书前面部分展示的代码范例都属于“过程式”编程(procedural programming)的类型。这种编程方式的特点是把数据保存到变量里,然后由一系列指令操作变量。每个指令(或一系列指令,比如函数)都能够创建、删除或修改数据,显得数据与程序代码在某种程度上是“分离”的。 ⏱ 2020-07-02 22:38:12

📌 在面向对象编程(OOP)方式中,程序指令与其操作的数据密切关联。换句话说,OOP把程序的数据包含在叫作“对象”的独立体里,每个对象都有自己的属性(数据)和方法(指令)。 ⏱ 2020-07-02 22:38:26

📌 对象的“内部”内容对外是隐蔽的,这迫使对象外部代码只能通过对象标明的接口来访问对象的数据。 ⏱ 2020-07-02 22:44:53

📌 JavaScript并不属于这种类型,但它也提供了足够的支持,让我们可以编写非常实用的面向对象代码。面向对象编程具有很丰富的内容,但本书在此只讨论一些基本知识。 ⏱ 2020-07-02 22:46:29

11.2 创建对象

📌 在把函数关联到对象时,只用了函数名称,并不包含括号。这是因为我们是要把函数myFunc()的定义赋予mynewObject.showInfo方法。 ⏱ 2020-07-03 00:15:53

📌 其作用是让JavaScript执行函数myFunc(),然后把它的返回值赋予mynewObject.showInfo ⏱ 2020-07-03 00:15:58

📌 在以这种方式使用时,this是指HTML元素本身(前例中就是img元素)。而在函数(或方法)里使用this时,this指向函数的“父对象”。 ⏱ 2020-07-03 00:16:05

📌 只有一个全局实例的对象有时称为“单例”对象,在有些场合很适用 ⏱ 2020-07-03 00:19:50

11.3 用prototype扩展和继承对象

📌 JavaScript提供的机制能够基于已有的对象修改对象,使其拥有新的方法或属性,甚至可以创建完全崭新的对象 ⏱ 2020-07-03 00:23:19

📌 当一个对象已经实例化之后,如果想使其具有新的方法和属性 ⏱ 2020-07-03 00:25:08

📌 继承是指从一种对象类型创建另一种对象类型,新对象类型不仅可以继承旧对象类型的属性和方法,还可以可选地添加自己的属性和方法。 ⏱ 2020-07-03 16:47:54

📌 因为object.prototype可以添加新方法和属性,所以可以用它把已有的构造函数里的全部方法和属性都添加到新的对象。 ⏱ 2020-07-03 16:49:07

📌 假设现在要为狗类专门创建一个对象,但不是从头开始创建,而是让Dog对象继承Pet,并且添加属性breed和方法setBreed。 ⏱ 2020-07-03 16:49:25

11.4 封装

📌 封装是面向对象编程的一种能力,表示把数据和指令隐藏到对象内部。 ⏱ 2020-07-03 16:54:35

📌 如果想从外部访问这些变量和函数,需要在赋值时使用关键字this,这时它们就成了对象的属性和方法。 ⏱ 2020-07-03 16:57:10

📌 如果没有用关键字this把变量和函数“注册”为属性和方法,它们就不能从函数外部调用,则被称为“私有的”。 ⏱ 2020-07-03 16:57:59

第12章 对象进阶

📌 我们将学习JavaScript和OOP相关的一些新功能 ⏱ 2020-07-03 20:01:29

12.1 类

📌 原型是对象的一个功能化的实例,并且对象直接从这样的父对象来继承。为了在这些概念之间构建起桥梁,JavaScript最近引入了一个class关键字。 ⏱ 2020-07-04 14:51:08

📌 它只是一种所谓的语法糖(syntactic sugar)—一种更加清晰、方便,易于理解和使用的语法,对于那些刚刚接触OOP环境的人,尤其如此。 ⏱ 2020-07-04 14:57:17

📌 symbol类型和任何其他的数据类型都不同。一旦创建了,symbol一定是唯一的,这有助于很方便地命名那些随后不能被覆盖以及有可能被其他某些人的代码所毁坏的对象属性。 ⏱ 2020-07-04 16:58:33

12.3 使用功能检测

📌 基于对象,可以用更好的方式编写跨浏览器代码 ⏱ 2020-07-04 17:17:59

12.5 问答

📌 一个类中只能有一个方法叫作“构造函数”。如果一个类中多次出现一个构造函数,将抛出语法错误。 ⏱ 2020-07-04 17:25:53

12.6 作业

📌 a.所定义的类的父类 ⏱ 2020-07-04 17:36:35

13.6 问答

📌 问:我曾在Web上看到关于DOM Core和HTML DOM的介绍,它们究竟是什么?有什么区别?答:DOM Core描述了DOM方法的核心基础部分,这些方法不仅能够适用于HTML页面,还适用于其他标签语言(比如XML)构成的页面。HTML DOM包含更多只适用于HTML页面的方法,这些方法的确提供了完成某些任务的简便方法,但牺牲了代码对于非HTML应用的可移植性。 ⏱ 2020-07-04 23:23:26

14.1 JSON是什么

📌 JSON(读作“Jason”)是JavaScript对象的一种简单紧凑的标签。 ⏱ 2020-07-04 23:29:15

14.2 访问JSON数据

📌 为了还原以JSON字符串编码的数据,需要把字符串转换为JavaScript代码,这通常称为字符串的“去序列化”。 ⏱ 2020-07-04 23:30:33

📌 JSON.parse()方法用于解释JSON字符串。它接收一个字符串作为参数,解析它,创建一个对象,并且根据字符串中找到的”parameter”:“value”对设置对象的参数: ⏱ 2020-07-04 23:35:22

14.3 JSON的数据序列化

📌 在数据存储和转换时,“序列化”是指把数据转换为便于通过网络进行存储和传输的形式,稍后再恢复为原始的格式。 ⏱ 2020-07-04 23:36:14

📌 JSON选择字符串作为序列化数据的格式。因此,为了把JSON对象进行序列化(比如为了通过网络连接进行传输),需要用字符串的形式来表示它。 ⏱ 2020-07-04 23:39:12

📌 在直接支持JSON的浏览器里,只需要简单地使用JSON.stringify()方法。 ⏱ 2020-07-04 23:39:10

14.7 JSON安全性

📌 使用JavaScript的eval()函数能够执行任何JavaScript命令,这可能会导致潜在的安全问题,特别是处理来源不明的JSON数据时。更安全的办法是使用内置JSON解析器的浏览器把JSON字符串转换为JavaScript对象—它只识别JSON文本,而且不会执行脚本命令。同时,内置的JSON解析器的速度也比eval()快一些。 ⏱ 2020-07-04 23:49:14

14.10 作业

📌 a.JavaScript Object Notation ⏱ 2020-07-04 23:50:42

第四部分 用JavaScript操作Web界面

📌 XHTML是基于XML的HTML。它是W3C近年来不断努力的一个项目,最新版本是XHTML2。但在2009年,W3C宣布放弃XHTML,把全部精力投入到新版的HTML:HTML5。 ⏱ 2020-07-04 23:56:52

15.1 HTML5的新标签

📌 即使是组织良好的HTML页面,对其代码的阅读与解释都会比想象中困难得多,主要原因是标签本身包含的语义信息很少。 ⏱ 2020-07-07 14:35:19

15.3 拖放

📌 但是拖动操作本身并没有太大的实际意义,被拖动的元素需要能够被放下才有意义。 ⏱ 2020-07-07 14:49:42

15.4 本地存储

📌 。与使用cookies相比,Web存储更加安全和快速。与cookie相同的是,数据也是以“关键字/值”对的方式存储的,而且Web页面只能访问自己存储的数据。 ⏱ 2020-07-07 15:49:10

📌 浏览器里实现本地数据存储的两个新对象 ⏱ 2020-07-07 15:50:49

15.7 问答

📌 问:已经有使用HTML5的实用站点了吗? 答:当然,有很多。详情请见html5gallery官方网站。 ⏱ 2020-07-14 11:25:58

15.8 作业

📌 stop() ⏱ 2020-07-14 11:25:59

16.2 DOM的style属性

📌 HTML页面在浏览器里以DOM树的形式表现。组成DOM树的分支与末端称为“节点”,它们都是一个个对象,都具有自己的属性和方法。 ⏱ 2020-07-14 11:25:59

📌 虽然这种方式在用于内联样式时很正常,但如果是在页面部分里使用

16.4 DOM的styleSheets对象

📌 document对象的styleSheets属性是一个数组,包含了页面上全部样式表(无论样式表是包含在外部文件中,还是在页面部分里用标签声明)。 ⏱ 2020-07-14 11:25:59

16.7 作业

📌 a.访问元素的class属性值 ⏱ 2020-07-14 11:25:59

📌 .document ⏱ 2020-07-14 11:25:59

17.3 CSS3背景

📌 background-origin属性用于设置一个背景在框中的位置如何计算。它接收如下3个值之一:padding-box、border-box或content-box。 ⏱ 2020-07-14 11:26:00

17.7 在JavaScript中引用CSS3属性

📌 几乎所有浏览器都支持DOM getComputedStyle()方法。该方法可以访问一个元素的最终(也就是计算后的)样式。 ⏱ 2020-07-14 11:26:00

第五部分 与JavaScript工具相关的高级技术

📌 而cookie提供了一种便捷的方式,能够在用户的计算机上保存少量数据并且远程获得它们,从而让网站可以保存一些细节信息, ⏱ 2020-07-15 10:05:44

📌 本章将介绍如何使用JavaScript创建、保存、获取和删除cookie。 ⏱ 2020-07-15 10:02:58

18.1 什么是cookie

📌 有人不喜欢cookie,通常是因为有些站点把cookie作为一种广告手段,借此追踪用户的在线行为,从而进行有针对性的广告。 ⏱ 2020-07-15 10:10:22

18.2 使用document.cookie属性

📌 在存储信息之前,使用JavaScript的escape()函数进行编码;而获得原始的cookie数据时,就使用相应的unescape()函数进行解码。 ⏱ 2020-07-15 10:12:10

18.3 cookie组成

📌 这个属性的作用在于控制子域对cookie的操作。 ⏱ 2020-07-15 10:14:26

📌 path属性用于指定可以使用cookie的目录。 ⏱ 2020-07-15 10:15:42

📌 expires属性要以UTC时间表示。如果没有设置这个属性,cookie的生命期就和当前浏览器会话一样长,会在浏览器关闭时自动删除。 ⏱ 2020-07-15 10:18:22

18.8 在一个cookie里设置多个值

📌 cookie信息总体不能超过4KB是不能改变的。 ⏱ 2020-07-18 18:50:04

18.11 作业

📌 a.用户的硬盘上 ⏱ 2020-07-18 18:53:51

📌 a.escape() ⏱ 2020-07-18 19:03:45

📌 b.定界符 ⏱ 2020-07-18 19:03:54

📌 b.4KB ⏱ 2020-07-18 19:03:58

📌 a.document.cookie ⏱ 2020-07-18 19:04:03

20.3 实现闭包

📌 当创建了logMessage()函数并将其存储到变量hello中后,返回的函数仍然能够访问其父函数的作用域内的任何变量,即便是当父函数的作用域结束以后也是如此。这就是所谓的“闭包”(closure)。 ⏱ 2020-07-28 17:00:44

📌 闭包是访问父作用域的一个函数,即便是在该作用域已经结束之后,也可以执行。 ⏱ 2020-07-19 14:05:53

读书笔记

1.4 作业

划线评论

📌 a.在一个模态对话框中,向用户发送一条消息 ^8292450-7iv2UhYcw - 💭 指在用户想要对对话框以外的应用程序进行操作时,必须首先对该对话框进行响应。 - ⏱ 2020-07-01 00:07:53

6.9 作业

划线评论

📌 a.True ^8292450-7ixpGqRyq - 💭 Boolean(0) — false,其余都是true - ⏱ 2020-07-02 13:29:00

7.5 作业

划线评论

📌 c.join(string1, string2); ^8292450-7ixx2Nbdi - 💭 join() 方法用于把数组中的所有元素放入一个字符串。 - ⏱ 2020-07-02 15:21:24

划线评论

📌 b.var paid = “true”; ^8292450-7ixx7qnp7 - 💭 字符串 - ⏱ 2020-07-02 15:22:32

12.6 作业

划线评论

📌 c.var myObject = new Person(); ^8292450-7iAIkKc08 - 💭 这里是不是题目错了,应该是哪一种是正确的语法。 - ⏱ 2020-07-04 17:33:47

本书评论