Sep 15, 2016

arguments 对象与形参联动关系

strict mode 中，函数的 arguments 对象的属性值，就是传入该函数的实参的简单拷贝，它们与形参之间的值不存在动态的联动关系。

非严格模式下的函数，函数的 arguments 对象的属性与绑定在该函数执行环境中的形参共享值。换句话说，改变该 arguments 对象的属性将改变对应的形参值，反之亦然。不过，如果其中一个属性被删除然后再重设值，则会打破这种联动关系。

下面用一个简单的例子来说明这些现象。

代码

1
// strict mode
2
;(function test(a) {
3
  'use strict';
4

5
  console.log(arguments[0]) // 1
6
  console.log(a) // 1
7

8
  a = 2
9
  console.log(arguments[0]) // 1
10
  console.log(a) // 2
11
})(1)
12

13
// 非strict mode
14
;(function test2(a) {
15
  // 初始一一对应
16
  console.log(arguments[0]) // 1
17
  console.log(a) // 1
18

19
  // 修改形参 a，参数对象联动变化
20
  a = 2
21
  console.log(arguments[0]) // 2
22
  arguments[0] = 1
23
  console.log(a) // 1
24

25
  // delete 属性再重新设值，则不在联动
26
  delete arguments[0]
27
  arguments[0] = 3
28
  console.log(arguments[0]) // 3
29
  console.log(a) // 1
30
})(1)

构造函数的返回值

构造函数不需要显式 return，如果指定了返回值，则根据返回值的类型有不同的结果。

代码：

1
function PrimitiveUndefined() { }
2
function PrimitiveNull() { return null }
3
function PrimitiveBoolean() { return true }
4
function PrimitiveNumber() { return 123 }
5
function PrimitiveString() { return 'string' }
6
function PrimitiveSymbol() { return Symbol() }
7
function BooleanObject() { return new Boolean(true) }
8
function NumberObject() { return new Number(123) }
9
function StringObject() { return new String('string') }
10
function DateObject() { return new Date() }
11
function RegExpObject() { return /test/ }
12
function FunctionObject() { return function(){} }
13
function LiteralObject() { return {} }
14
function LiteralArray() { return [] }
15

16
const FUNCTIONS = [
17
    'PrimitiveUndefined',
18
    'PrimitiveNull',
19
    'PrimitiveBoolean',
20
    'PrimitiveNumber',
21
    'PrimitiveString',
22
    'PrimitiveSymbol',
23
    'BooleanObject',
24
    'NumberObject',
25
    'StringObject',
26
    'DateObject',
27
    'RegExpObject',
28
    'FunctionObject',
29
    'LiteralObject',
30
    'LiteralArray'
31
]
32

33
FUNCTIONS.forEach(func => {
34
    let obj = eval('new ' + func)
35
    let type = obj.constructor.name
36

37
    console.log('%c%s %c: %c%s',
38
        'color:#607ed8', func,
39
        'color:#888',
40
        'color:#d87860', type)
41
})

测试结果打印：

1
PrimitiveUndefined : PrimitiveUndefined
2
PrimitiveNull : PrimitiveNull
3
PrimitiveBoolean : PrimitiveBoolean
4
PrimitiveNumber : PrimitiveNumber
5
PrimitiveString : PrimitiveString
6
PrimitiveSymbol : PrimitiveSymbol
7
BooleanObject : Boolean
8
NumberObject : Number
9
StringObject : String
10
DateObject : Date
11
RegExpObject : RegExp
12
FunctionObject : Function
13
IteralObject : Object
14
IteralArray : Array

总结

若手动 return 一个原始类型的值 (primitive value)，则 return 语句不会起作用，仍然返回构造函数隐式创建的对象。
若手动 return 一个对象类型的值，则会丢弃构造函数隐式创建的对象，返回 return 语句指定的对象。

离线应用与 manifest.appcache

manifest 文件是一个文本文件，用来告诉浏览器缓存资源的规则，可以用来构建一个离线可用的应用。

manifest 文件的 MIME 类型是 text/cache-manifest

manifest 文件使用时只需简单地在 html 文件中引入。具体方法是，在 <html> 标签中，增加一个 manifest 属性，该属性引用一个 manifest.appcache 文件来描述资源的缓存情况。

代码如下：

1
<!DOCTYPE html>
2
<html lang="en" manifest="manifest.appcache">
3
<head>
4
  <meta charset="UTF-8">
5
  <title>Document</title>
6
</head>
7
<body>
8
</body>
9
</html>

浏览器兼容性

在使用前，我们都关心的兼容性…

IE 10+
Chrome 4+
Safari 4+
Firefox 3.5+
Opera 11.5+
Safari (iOS)
Android Browser
Edge

现代浏览器都有支持，尽管实现上据说都有坑。

manifest 已从标准中移除，将来浏览器随时可能会枪毙该特性…
然而，后继者 service workers 还未获得广泛的支持。

arguments 对象与形参联动关系

代码

构造函数的返回值

代码：

总结

离线应用与 manifest.appcache

浏览器兼容性

Tags

Categories

arguments 对象与形参联动关系

代码

构造函数的返回值

代码：

总结

离线应用与 manifest.appcache

浏览器兼容性

Subscribe

Tags

Categories