Repository navigation
《JavaScript权威指南 第六版》读书会 笔记 #7
Description
Activity
var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
trees[3] = undefined;3 in trees;
一、摘要：
1分类：
- 1).一元运算符（delete,void,instanceof,-），二元运算符（大多数运算符），三元运算符（条件运算符）。
- 2).大部分运算符是由符号表示 ，有些是由关键字表示，比如delete，void, instanceof ，包括new,typeof。
2.赋值运算符
a op = b
op表示 一个运算符。3. +既是算术运算符，又是字符串运算符。是从左到右工作的。
4对象创建运算符new
new constructor (argument)
new 首先创建一个新对象，该对象的属性都未被定义。接下来，它将调用特定的构造函数，传递指定的参数，此外，还要把新创建的对象传递给关键字this。这样构造函数就可以使用关键字this来初始化新对象。5.delete运算符
delete将删除运算数所指定的对象的属性、数组元素或变量。如果删除成功，则返回true. 如果该运算数不能被删除。它将返回false. 但是并非所有的属性和变量都能被删除。某些内部的核心属性和客户端属性不能被删除。var语句声明的用户定义变量也不能删除。6.函数调用运算符
能过()调用函数。二、问题
1. 位运算符的应用场景。
2. 逗号运算符：
a=0,b=1,c=2;
等价于a=0;b=1;c=2;它的值为2.
3.[]和.都是运算符。
[ ]用于存取数组元素，还可以用于存取对象的属性。
.左边的运算数是一个对象，右边是一个标识符（属性名称）。右边的运算数既不能是字符串，也不能是变量，而应该是属性或者方法的直接量名，而且不需要指明类型。
frames[0].legth
document.write("hello")Q1、 JS中都是表达式吗？
Q2、点和方括号两种方式只要上面的区别吗？
Q3、
Get1、原始表达式包含常量或直接量、关键字和变量。
Get2、
Get3、大多数的运算符是标点运算符，少部分是关键字运算符
Get4、避免运算符导致的副作用。void运算符应用场景？
控制台结果：
get:
1、q = a ? b : c ? d : e ? f : g ; (三目运算符的R结合性)
2、除数为0的结果是正无穷或负无穷，0/0的结果为NaN
3、6.5 % 2.1结果为0.2
4、+运算符优先考虑字符串，但要注意加法结合性对运算顺序的影响（如三个数相加）
5、++运算符后的分号最好手动补全Get
问题：
- 页数
var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); trees[3] = undefined;
- Reacted by Onlyfor3ver
Get：
1、对象转换成为原始值之后，如果两个操作数都是字符串，那么将依照字母表的顺序对两个字符串进行比较，这里提到的‘字母表顺序’是指组成这个字符串的16位Unicode字符的索引顺序。
2、所有大写的ASCII字母都‘小于’小写的ASCII字母。
3、in运算符希望它的操作数是一个字符串或可以转换为字符串的。
4、为了计算 o instaceof f js首先计算 f.prototype 然后在原型链中查找o 如果找到，那么o是f（或者f的父类）的一个实例。
5、&&并不总返回布尔值。var b = 2&&4 //b 4
6、&&如果左假，依赖左，如果左真 依赖右。
7、|| 左真返回左，否则返回右。
8、es3规定不允许对eval赋予别名，实际并非如此，当通过别名调用时，eval会将其字符串当成顶层的全局代码来执行。但这不影响主调函数里面的变量。
9、常规eval可以修改局部变量，非常规则修改全局变量。
10、ie9之前没有全局eval（）。
11、在严格模式下，eval可以查询或 更改局部变量，但不能在局部作用域中重新定义变量或者函数。Get：
1：page74
对象和其本身是相等的，但和其他任何对象都不相等。相应位置相同中的数组元素是相等的两个数组也是不相等的。
2：page74
如果其中一个值是NAN，或者两个值都是NAN，则它们不相等。NAN和其它任何值都是不相等的，包括它本身。通过x!==x来判断x是否为NAN，只有在x为NAN的时候，这个表达 式的值 才经true.3.page79逻辑表达式
&&和||不光是从简单的布尔运算，其实是对真值 和假值的布尔操作和运算。可以有条件的执行两侧的表达式。Questions：
1：page64
调用表达式：
如果这个表达式是一个属性访问表达式，那么这个调用称作“方法调用”。在方法调用中，执行函数体的时候，作为属性访问主题的对象和数组 便 是其调用方法内部this的指向。这种特性使得在OO的范例中，函数（方法）可以调用其宿主对象。
并不是说，所有方法调用的调用表达式都使用全局对象作为this关键字的值，然而在ES5中，通过严格模式定义的函数，在调用时使用undefined作为this的值 ，this不会指向全局对象。2：page64
对象创建表达式：
js首先创建一个新的空对象，然后通过传入指定的参数并将这个新对象当做this的值 来调用一个指定的函数。这个函数可以使用this来初始化这个新创建对象的属性。3.page81
赋值表达式(a=b)==04.page83 eval()
Get：
1、任何数和NaN比较都是返回false
2、&& 并不总是返回true或false
3、数字和字符串 比较运算 比较运算符更偏爱数字，只有在两个操作数是字符串的时候才进行字符串比较Questions：
1、in运算符？ page78
2、typeof 返回值，任意宿主对象？ page87
Get:
1、逻辑表达式 “短路” p80
2、比较运算符与加号运算符，关于数字和字符串的优先级不同 p77Questions:
1、多次提到表达式具有副作用（赋值，递增，递减，函数调用）p80，这个副作用要怎么去深入理解？
2、赋值表达式副作用 p81，p83
3、delete运算符副作用 p88
4、void运算符副作用 p89
5、逗号运算符副作用 p9048 remaining items
GET
1、setTimeout(function,0）用法
2、window.loacation === document.location
3、history back(),forward(),go()
4、navigator.cookieEnabled
5、window.open()
window.open('http://www.XXX.com','_blank','width=600,height=400,top=100px,left=0px')
top:Number //窗口顶部离开始屏幕顶部的像素数
leftNumber //左端距离值
menubar：yes/no //有无菜单栏
toolbar: yse/no //有无工具栏
scrollbar:yes/no //有无滚动条
status:yes/no //有无状态栏Q
iframe 引用不同版本的jquery window.$ 原理1、setTimeout()和setInterval()的第一个参数可以作为字符串传入。
2、window的location对象引用的是Location对象，Document对象的locaiton属性也引用到了Locaiton对象 。
所以，window.location === document.location
3、document对象的URL属性是文档首次载入后保存该稳当的静态字符串，不会更新。Locaiton对象会做更新。
4、Location的hash属性返回URL中的片段标识符（#）， 这个属性可读可写。读取时，可以用来判断网页状态是否改变；写入时，则会在不重载网页的前提下，创造一条访问历史记录。
5、replace()方法在载入新文档会从浏览历史中把当前文档删除。assign方法用于载入并显示你指定的URL的文档。
6、脚本不允许访问保存的URL，浏览历史列表
7、history.go() 可以接受一个整数参数，正参或者负参数， 来跳过任意多个页面。
8、navigator对象有四个属性用于提供关于运行中的浏览器版本信息
appName web浏览器全称
appVersion 以数字开始，并跟着包含浏览器厂商和版本信息的详细字符串
userAgent 浏览器在user-agent的http头部中发送的字符串
platform 操作系统字符串
9、top属性指向包含它的顶级窗口。顶级窗口的top代表他本身。
10、iframe元素的contentWindow属性，引用该窗体的window对象。
父页面或者子页面的内容，可以使用contentWindow，该属性是只读的，返回指定iframe的对象，不是标准的一部分，但是浏览器基本都支持。同时也有一个contentDocument属性，该属性支持不高。
11、_top 顶级祖先窗口， _parent 直接父级窗口。
12、target属性的值可以设置为 ‘_blank’ _top _parentQ:
p353
iframe的id表示的是window对象还是自身的element对象？
https://search.jd.com/Search?keyword=%E8%BD%AE%E8%83%8E&enc=utf-8&wq=%E8%BD%AE%E8%83%8E&pvid=a58f4ea0b08f4db0a3cbfaba01974b82
GET:
-
click事件是在mousedown 和 mouseup之后的。
click时的事件捕获与冒泡 -
DOM0就是直接通过 onclick写在html里面的事件;
DOM2是通过addEventListener绑定的事件, 还有IE下的DOM2事件通过attachEvent绑定;
DOM3是一些新的事件。DOM优化：
1）focusin 和 focusout （不冒泡）取代focus 和 blur （冒泡）
2）mouseenter 和 mouseleave （冒泡） 取代了 mouseover 和 mouseout（不冒泡）
Q:
- 调用顺序：（p457）
1）通过属性或者HTML属性注册的事件一直优先调用
2）使用addEventListerner注册的事件按顺序调用
3）使用attachEvent 注册的事件可能按照任何顺序调用
-
GET
addEventListener(event,functon,userCapture）useCapture:
ture 事件捕获阶段执行
false 冒泡阶段执行
如果没有指定， useCapture 默认为 false1、HTML5历史管理机制会触发popstate事件来响应浏览器的后退按钮。
2、unload是指用户离开当前文档转向其他文档时会出发，不能取消用户跳转到其他地方。beforeunload事件可以取消。
3、鼠标右键触发contextmenu事件
4、mouseover和mouseout事件会冒泡，但通常不方便的，因为触发这两个事件时，不得不检查鼠标是否真的离开了目标元素，还是仅仅从这个元素的一个子元素移动到另外一个。正因为如此，IE提供了这些事件的不冒泡版本mouseenter和mouseleave。
不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件
不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。
只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。
只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。
5、鼠标滚轮，mousewheel ff下是DOMMouseScroll
6、Ie8及之前的版本中，通过设置属性注册事件处理程序，当调用他们时并未传递事件对象。需要通过全局对象的event属性，所以出现了 window.event写法。
7、attachEvent中的this指向window对象。addEventListener，this指向事件目标。
8、通过设置对象属性或HTML属性注册的处理程序一直优先调用， 使用addEventListener注册的处理程序按照他们的注册顺序调用
使用attachEvent注册的处理程序可能按照任何顺序调用。
9、DOMContentLoaded 是$(document).ready() DOMContentLoaded是指初始化的html加载完的时候执行。
P459
Q:
html事件处理程序中修改作用域链是陷阱之源，因为作用域链中每个对象的属性在全局对象中都有相同的名字.......
p4561、dataTransfer对象提供了对于预定义的剪贴板格式的访问，也就是在拖拽过程中，可以用dataTransfer对象来传输数据，以便在拖拽操作结束的时候对数据进行其他操作。
2、mousewheel有wheelDelta属性，远离用户方向的一次鼠标滚轮120，接近用户的一次滚轮是-120.而ff下面，DOMMouseScroll事件有detail属性，detail值乘以-40和wheeldelta相等。
3、英文：
keydown用户任意键都触发，一直摁 一直触发
keypress 字符键触发，按住不放一直触发
keyup 释放时候触发，如果在keydown过程中点击鼠标，则释放键盘没有此事件
中文
chrome 触发keydown和keyup
firefox 首次触发keydown 不触发keypress 停止输入并改变内容（回车或者空格）触发keyupGET
键盘事件：keydown，keyup
键盘值 event.keycode
String.fromCharCode() 可接受一个指定的 Unicode 值，然后返回一个字符串div1.onmousedown = function(ev){ var oEvent = ev || event; var disX= oEvent.clientX - oDiv.offsetLeft; var disY = oEvent.clientY - oDiv.offsetTop; document.onmousemove = function(ev){ var oEvent = ev || event; oDiv.style.left = oEvent.clientX -disX +'px'; oDiv.style.top = oEvent.clientY - disY + 'px'; } document.onmouseup = function(){ document.onmousemove = null; document.onmouseup = null; } }https://github.com/Onlyfor3ver/manifest.git
1、初次加载
2、再次刷新
3、再次刷新
4、关闭服务器刷新
5、再次开启服务器
6、新增加一个文件 index2.css 继续 刷新
7、更改版本号 刷新
继续刷新 失败。。。。。。
8、禁止掉浏览器缓存 刷新
9、允许缓存 刷新
10、将新添加的css文件写入manifest 刷新
11、禁止掉缓存 将index2.html写入NETWORK选项 刷新
12、允许缓存 刷新
1、localStorage和sessionStorage两者的区别在于存储的有效期和作用域的不同：数据可以存储多久以及谁拥有数据的访问权。localstorage必须是才同一个浏览器下进行读写操作。同源的文档之间可以互相读取数据。sessoionStorage更限制在同一个标签页。
2、localStorage和存储事件采用广播机制，一旦触发，浏览器会对目前正在访问同样站点的所有窗口发送消息。
3、cookie的作用域是通过文档元和文档路径来确定，该作用域通过cookie的path和domain属性也是可配置的。默认情况下，cookie和创建他的web页面有关，并对该web页面以及和该web页面同目录或者子目录的其他web页面可见。
4、userData允许存储的数据流要比cookie大，但没有Storage大。userData的作用域限制在和当前文档同目录的文档中。
5、在清单文件中可以使用特殊的区域头来标识头信息之后清单项的类型，像该例中列举的简单缓存项事实上都属于cache区域，这也是默认的区域。另外两种区域是以network和fallback头信息开始的。
network标识该URL中的资源从不缓存，总要通过网络获取。支持*通配符，表示对任何不在清单中的资源，浏览器都通过网络获取。
fallback区域中的清单项每行都包含两个URL。第二个URL指的是需要加载和缓存在缓存中的资源，第一个URL是一个前缀。任何匹配到该前缀的都不会缓存起来。如果载入失败，则使用第二个URL指定的缓存来代替。
6、onchecking 检查清单文件
onnoupdate 清单没有变化
ondownloading 清单改动，下载并缓存新的资源
onprocess 下载过程 中每个文件下载完毕的时候
oncached 下载完成并且首次将应用程序下载到缓存中
onupdateready 下载完成并将缓存中的应用程序更新后，此时依然可以看到 老的应用程序。
onerror 处于离线状态，检查清单失败
onobsolete 如果一个缓存的应用程序引用一个不存在的清单文件
7、当前的缓存状态
ApplicationCache.UNCACHED 应用程序未设置manifest属性：未缓存
ApplicationCache.IDLE 清单文件已经检查完毕，并且已经缓存了最新的应用程序
ApplicationCache.CHECKING 浏览器正在检查清单文件
ApplicationCache.DOWNLOADING 浏览器正在下载并缓存清单中列举的所有文件。
ApplicationCache.UPDATEREADY 已经下载和缓存了最新版的应用程序
ApplicationCache.OBSOLETE 清单文件不存在，缓存将被删除1、controls属性指定是否在浏览器中显示播放控件。
loop属性指定是否需要循环播放
proload属性指定在用户开始播放媒体前，是否或者多少媒体内容需要预加载。none表示不需要预加载，metadata则表示则表示诸如时长、比特率、帧大小这样的元数据而不是媒体内容需要加载。 auto表示浏览器应当预加载适量的媒体内容。 autoplay表示当已经缓存足够多的媒体内容的时候是否需要自动开始播放。 true表示告诉浏览器需要预加载媒体内容。
2、媒体状态
duration 指定了媒体的时长，单位是s
initialTime指定了媒体的开始时间，单位是s 对于固定时长的媒体剪辑而言，该属性值通常为0，对于流媒体而言，该属性表示已经缓存的数据的最早时间以及能够回退到的最早时间。当这是currentTime属性时，其值不能小于initialTime的值。
played属性返回已经播放的时间段 buffered属性返回当前已经缓冲的时间段 seekable属性则返回当前播放器需要跳到的时间段 这三个对象都有一个length属性以及start以及end方法 length表示当前的一个时间段，start表示当前时间段的起始时间点 end表示结束时间点。
readyState指定当前已经加载了多少媒体内容，暗示着当前是否以及准备好播放了。
