JavaScript系列-----Objectj基于哈希存储<Key,Value>之Value(转)

from:https://www.cnblogs.com/renlong0602/p/4235533.html

<wbr style="line-height: 28px; color: rgb(0, 0, 0); font-family: "Hiragino Sans GB W3", "Hiragino Sans GB", Arial, Helvetica, simsun, 宋体; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px;">

1.问题提出

JavaScript系列-----Object之基于Hash<Key,Value>存储之Key篇 (1)中,我们推理出:对象是以Hash结构存储的,对象的属性被表示为多个<Key,Value>键值对。

其中,Key的数据类型是字符串,但是,我们并没有说Value是以什么数据结构存储的,在本文中,我们将继续讨论:

Value的存储类型-----博文的核心

既然在JavaScript中,对象的属性是以键值对的形式存储的,那么我们知道必须需要知道对象属性的三种类型:

    1. 基本数据类型的属性
    2. 引用数据类型的属性
    3. 数据访问器属性

我们用一个例子来分别说明这三种属性类型:

<a title="复制代码" style="line-height: 21px; margin: 0px; padding: 0px; color: rgb(7, 93, 179); text-decoration: underline; border: none !important;">
复制代码

</a>

<pre style="line-height: 21px; margin-top: 0px; margin-bottom: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important;">

var

person =

{};
person.name

= '张三'

;  //第一种,基本数据类型属性
person.age

= 18

;
peron.getName

=

function

() { //第二种,引用数据类型的属性,因为在js中函数也是对象

return

this

.name;
}
Object.defineProperty(person,

'isAdult'

, { //第三种,访问器属性
get:

function

() {

if

(person.age >= 18

) {

return

true

;
}

else

{

return

false

;
}
}
});
console.log(person.isAdult); //true

</pre>

<a title="复制代码" style="line-height: 21px; margin: 0px; padding: 0px; color: rgb(7, 93, 179); text-decoration: underline; border: none !important;">
复制代码

</a>

通过上例,我们认识到三种属性类型后,那么,接下来我们来谈谈Value是怎么表示这三种属性的!

2.<Key,Value>中Value的数据结构

在JavaScript高级程序设计(第三版)中,是这么描素属性的:属性在创建时都带有一些特征值,JavaScript引擎通过这些特征值来定义他们的行为。

下面,分别讨论这三种属性分别用哪些特征值来描述:

(1).基本数据类型的属性

<a title="复制代码" style="line-height: 21px; margin: 0px; padding: 0px; color: rgb(7, 93, 179); text-decoration: underline; border: none !important;">
复制代码

</a>

<pre style="line-height: 21px; margin-top: 0px; margin-bottom: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important;">

var

person =

{};
person.name

= '张三'

;

var

descriptor=Object.getOwnPropertyDescriptor(person,"name"

);
console.log(descriptor);               //输出结果:

</pre>

|

configurable

| |

true

|

|

enumerable

| |

true

|

|

value

| |

"张三"

|

|

writable

| |

true

|

<a title="复制代码" style="line-height: 21px; margin: 0px; padding: 0px; color: rgb(7, 93, 179); text-decoration: underline; border: none !important;">
复制代码

</a>

(2).引用数据类型的属性

<a title="复制代码" style="line-height: 21px; margin: 0px; padding: 0px; color: rgb(7, 93, 179); text-decoration: underline; border: none !important;">
复制代码

</a>

<pre style="line-height: 21px; margin-top: 0px; margin-bottom: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important;">

var

person =

{};
person.getName

=

function

() {

return

this

.name;
}
person.child={name:"张四"};

var

descriptor = Object.getOwnPropertyDescriptor(person, 'getName'

);
console.log(descriptor); //输出结果:

</pre>

|

configurable

| |

true

|

|

enumerable

| |

true

|

|

writable

| |

true

|

|

value

| | <a class="objectLink objectLink-function a11yFocus " style="line-height: 28px; margin: 0px; padding: 0px;">function()</a> |

<pre style="line-height: 21px; margin-top: 0px; margin-bottom: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important;">var descriptor1 = Object.getOwnPropertyDescriptor(person, 'child'

);
console.log(descriptor1); //输出结果:

</pre>

|

configurable

| |

true

|

|

enumerable

| |

true

|

|

value

| | <a class="objectLink objectLink-object a11yFocus " style="line-height: 28px; margin: 0px; padding: 0px;">Object

{ name

=

"张四"

}</a> |

|

writable

| |

true

|

<a title="复制代码" style="line-height: 21px; margin: 0px; padding: 0px; color: rgb(7, 93, 179); text-decoration: underline; border: none !important;">
复制代码

</a>

  (3).访问器类型的属性

<a title="复制代码" style="line-height: 21px; margin: 0px; padding: 0px; color: rgb(7, 93, 179); text-decoration: underline; border: none !important;">
复制代码

</a>

<pre style="line-height: 21px; margin-top: 0px; margin-bottom: 0px; padding: 0px; white-space: pre-wrap; word-wrap: break-word; font-family: "Courier New" !important;">

var

person =

{};
Object.defineProperty(person,

'isAdult'

, {
get:

function

() {

if

(person.age >= 18

) {

return

true

;
}

else

{

return

false

;
}
}
});

var

descriptor=Object.getOwnPropertyDescriptor(person,"isAdult"

);
console.log(descriptor); //输出结果:

</pre>

|

configurable

| |

false

|

|

enumerable

| |

false

|

|

set

| |

undefined

|

|

get

| | <a class="objectLink objectLink-function a11yFocus " style="line-height: 28px; margin: 0px; padding: 0px;">function()</a> |

<a title="复制代码" style="line-height: 21px; margin: 0px; padding: 0px; color: rgb(7, 93, 179); text-decoration: underline; border: none !important;">
复制代码

</a>

  从上面三个例子可以看书,Value也是用一对对<Key,Value>表示的一个结构体。当然,我们也可以将Value看做一个对象,因为对象本来就是结构体。

  那么,问题的答案就显而易见了:

对象是以Hash结构存储的,用<Key,Value>键值对表示对象的属性,Key的数据类型为字符串,Value的数据类型是结构体,即对象是以<String,Object>类型的HashMap结构存储的。


3.Value中的各种特性值的含义

(1)数据类型的特性(基本数据类型属性和引用数据类型属性)

从第二部分我们可以看出,数据类型的属性的特性值有四个:

| 特性 | 数据类型 | 意义 |
| configurable | boolean | 表示能否修改此属性特性,为false时,此属性不能删除(针对delete),且不能修改 |
| enumerable | booelan | 表示此属性是否能被枚举,为false时,不能被枚举得到(针对 for-(in)) |
| writeable | boolean | 表示是否能够修改属性的值,为false时,此属性的值不能被修改 |
| value | 根据具体值设定 | 属性的数据值,写入属性的时候把新值保存在这个位置 |

(2)访问器类型的特性(访问器类型的属性)                   

| 特性 | 数据类型 | 意义 |
| configurable | boolean | 表示能否修改此属性特性,为false时,此属性不能删除(针对delete),且不能修改 |
| enumerable | booelan | 表示此属性是否能被枚举,为false时,不能被枚举得到(针对 for-(in)) |
| get | function | 通过该函数返回该属性的值 |
| set | function | 修改该属性的值,参数为属性的值. |

一点引申(Value中其他的特性):

          <Key,Value>中Value是一个结构体,其保存的难道就只有上述列举出的特性吗?------当然不是

  例如: 在描述数据类型的四个特性的value中,value也可以表示一个对象,也可以表示字符串,也可以表示数字,那么也就肯定存在对value所表示类型的描述,只不过JS引擎是在后台处理,我们 看不到而已。

当然,在<Key,Vaule>的Value中还肯定存在另外一个特性,(base)-----base是一中引用类型的数据,指向拥有该属性的对象。当value是函数类型的时候,该函数被调用时,用base来于初始化this指针,(当然,这些已超出我们要讨论的范围)。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容