日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 前端技术 > javascript >内容正文

javascript

JavaScript服务器端开发技术(对象属性的枚举与查询)

發布時間:2023/12/19 javascript 17 豆豆
生活随笔 收集整理的這篇文章主要介紹了 JavaScript服务器端开发技术(对象属性的枚举与查询) 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

既然對象是屬性的集合,那么檢測與枚舉集合中的屬性就是一項重要任務。對此,我們來分別看一下ES3ES5提供的解決方案。

1)?????ES3枚舉方案

示例代碼:

var contacts={

??? ID:[0,1,2,3,4,5],

??? names:["Zero","One","Two","Three","Four","Five"],

??? addresses:[

??? {

??????? Street:"ABC",

??????? State: "0"

??? },

??? {

??????? Street:"ABC",

??????? State: "1"

??? },

??? {

??????? Street:"ABC",

??????? State: "2"

??? },

??? {

??????? Street:"ABC",

??????? State: "3"

??? },

??? {

??????? Street:"ABC",

??????? State: "4"

??? },

??? {

??????? Street:"ABC",

??????? State: "5"

??? }

??? ]

};

//ES3 solutions

console.log('"ID" in contacts: ',"ID" in contacts);

console.log("'toString' in contacts: ",'toString' in contacts );

for(var key in contacts){

??? console.log("key: ",key);

??? console.log("value: ",contacts[key]);

}

上面代碼的輸出結果如下:

"ID" in contacts:? true

'toString' in contacts:? true

key:? ID

value:? [ 0, 1, 2, 3, 4, 5 ]

key:? names

value:? [ 'Zero', 'One', 'Two', 'Three', 'Four', 'Five' ]

key:? addresses

value:? [ { Street: 'ABC', State: '0' },

? { Street: 'ABC', State: '1' },

? { Street: 'ABC', State: '2' },

? { Street: 'ABC', State: '3' },

? { Street: 'ABC', State: '4' },

? { Street: 'ABC', State: '5' } ]

注意:

  • 運算符in的左側是屬性名,是字符串類型,右側是對象。無論是對象的自有屬性還是繼承屬性中包含這個屬性都會返回true

  • 對象的hasOwnProperty()方法用于檢測給定的名字是否是對象的自有屬性。對于繼承屬性則返回false。例如:

var? o={a:111,b:222};

o.hasOwnProperty("a");//true

o.hasOwnProperty("x");//false:不存在此屬性

o.hasOwnProperty("toString");//falsetoString是繼承屬性

  • propertyIsEnumerable()hasOwnProperty()方法的增強版本,用于檢測自有且可枚舉的屬性。通常JS創建的屬性都是可枚舉的,除非使用ES5中特殊方法改變了屬性的可枚舉性。例如:

var? o=inherit({a:111,b:222});

o.x=10000;

o. propertyIsEnumerable ("x");//true

o. propertyIsEnumerable ("a");//false:繼承來的屬性

Object.prototype. propertyIsEnumerable ("toString");//falsetoString是不可枚舉的屬性

?

2)?????ES5枚舉方案

除了使用ES3中的for...in循環方式來枚舉對象中的屬性外,對于前面定義的對象直接量,ES5還支持如下的枚舉方案:

console.log(Object.keys(contacts));

console.log(Object.getOwnPropertyNames(contacts));

輸出結果如下:

[ 'ID', 'names', 'addresses' ]

[ 'ID', 'names', 'addresses' ]

其中,靜態方法Object.keys()返回一個數組,這個數組由對象中可枚舉的自有屬性的名稱組成。

靜態方法Object. getOwnPropertyNames ()也是返回一個數組,這個數組由對象中所有的自有屬性的名稱組成。注意:ES3中無法實現這樣的方法,因為ES3中無法獲取對象的不可枚舉的屬性。

3)?????!==in運算符用于屬性存在判斷

前面介紹使用in運算符判斷指定屬性在否存在于某對象中。其實,有些簡單情況下,也可以使用!==運算符來決斷一個屬性是否是undefined

var oo1=new Object({lan:"JavaScript",degree:"Difficult"});

console.log("使用!==運算符的例子");

console.log(oo1.lan!==undefined);? //true

console.log(oo1.language!==undefined); //false

console.log(oo1.toString!==undefined); //true

切記:只有in運算符能夠區分不存在的屬性和存在但值為undefined的屬性。此時,!==已經無能為力。參考如下代碼片斷:

var ou={key1:undefined};

console.log("只能使用in運算符的例子");

console.log(ou.key1!==undefined);//false

console.log(ou.key2!==undefined);//false

console.log("key1" in ou);//true

console.log("key2" in ou);//false

delete ou.key1; //delete property 'key1'

console.log("key1" in ou);//false

4)?????與屬性枚舉相關的幾個工具函數

?

在本節給出的工具函數中,我們把對象看作屬性集合,所給的圖示試圖從集合論角度給出這些函數的功能示意。

求并集1

示意圖:

此工具函數并兩個對象中屬性的并集,但對于相同的屬性,使用present對象的屬性覆蓋對象orig中同名屬性。

function extend(orig,present){

??? for(var prop in present){

??????? orig[prop]=present[prop];

??? }

??? return orig;

}

?

求并集2

示意圖:

此工具函數并兩個對象中屬性的并集,但對于相同的屬性,使用保留對象orig中的屬性而舍棄present中同名屬性。

function merge(orig,present){

??? for(var prop in present){

??????? if(orig.hasOwnProperty(prop)) continue;

??????? orig[prop]=present[prop];

??? }

??? return orig;

}

求交集1

此工具函數并兩個對象中屬性的交集,但對于相同的屬性,使用保留對象orig中的屬性而舍棄present中同名屬性。

function restrict(orig,present) {

??? for(var prop in orig){

??????? if(!(prop in present)){

??????????? delete orig[prop];

??????? }

??????? return orig;

??? }

}

求交集2

此工具函數并兩個對象中屬性的交集,但對于相同的屬性,使用保留對象orig中的屬性而舍棄present中同名屬性。因此,交集結果同上面“求交集1”,但是返回新集合。

function intersection(o,p) {

??? return restrict(extend({},o),p);

}

求集合減法

function subtract(orig,present) {

??? for (var prop in present) {

??????? delete? orig[prop];

??? }

??? return orig;

}

?

求并集3

實際上等同于“求并集1”,但是返回一個新對象。

function union(orig,present) {

??? return extend(extend({},orig),present);

}

類似于ES5版本的Object.keys(o)

function keys(obj){

??? if(typeof obj!=="object") throw TypeError("The parameter 'obj' must be an object!");

??? var result=[];

??? for(var prop in obj){

??????? if(obj.hasOwnProperty(prop)){

??????????? result.push(prop);

??????? }

??? }

??? return result;

}

求多個集合并集的函數

下面這個工具函數在許多JS庫中都有它的影子,來自于
Pomelo
示例工程中的文件
chatofpomelo-websocket\game-server\node_modules\pomelo\node_modules\cliff\node_modules\winston\lib\winston\config.js
,可以實現多個集合并集求解。

但對于相同屬性,使用后面加入的集合中同名屬性覆蓋前面集合中屬性。

function mixin (targetObj) {

??? //下面代碼把函數的參數轉換成一個數組,并取得從第1個元素開始直到最后的參數組成的子數組

??? var args = Array.prototype.slice.call(arguments, 1);

??? args.forEach(function (a) {

??????? var keys = Object.keys(a);//ES5:?返回對象所有自有屬性的名稱

??????? for (var i = 0; i < keys.length; i++) {

??????????? targetObj[keys[i]] = a[keys[i]];

??????? }

??? });

??? return targetObj;

};

?

以上屬性操作工具函數還存在不同程度的缺點,僅供學習者參考。
















本文轉自朱先忠老師51CTO博客,原文鏈接:http://blog.51cto.com/zhuxianzhong/1653360?,如需轉載請自行聯系原作者


總結

以上是生活随笔為你收集整理的JavaScript服务器端开发技术(对象属性的枚举与查询)的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。