แก้ไข : ทุกด้านล่างตัวอย่างในคำตอบนี้ได้รับการแก้ไขจะรวมตัวแปรเส้นทางใหม่ให้ผลจาก iterator ตาม@ คำขอ ตัวแปรเส้นทางคืออาร์เรย์ของสตริงที่แต่ละสตริงในอาร์เรย์แสดงถึงแต่ละคีย์ที่เข้าถึงเพื่อรับค่าซ้ำที่เกิดขึ้นจากวัตถุต้นฉบับ ตัวแปรเส้นทางสามารถป้อนเข้าฟังก์ชั่นได้รับ lodash ของ / วิธีการ หรือคุณสามารถเขียนรุ่น Lodash ของคุณเองซึ่งจัดการเฉพาะอาร์เรย์เช่น:
function get (object, path) {
return path.reduce((obj, pathItem) => obj ? obj[pathItem] : undefined, object);
}
const example = {a: [1,2,3], b: 4, c: { d: ["foo"] }};
// these paths exist on the object
console.log(get(example, ["a", "0"]));
console.log(get(example, ["c", "d", "0"]));
console.log(get(example, ["b"]));
// these paths do not exist on the object
console.log(get(example, ["e", "f", "g"]));
console.log(get(example, ["b", "f", "g"]));
แก้ไข : คำตอบที่แก้ไขนี้แก้ traversals วนลูปไม่สิ้นสุด
การหยุด Traversals ของวัตถุที่ไม่มีที่สิ้นสุดน่าชัง
คำตอบที่แก้ไขนี้ยังให้หนึ่งในประโยชน์เพิ่มเติมของคำตอบเดิมของฉันซึ่งช่วยให้คุณใช้ฟังก์ชันตัวสร้างที่ให้ไว้เพื่อใช้ส่วนต่อประสานที่เรียบง่ายและเป็นระเบียบ(คิดว่าใช้for ofลูปเหมือนในfor(var a of b)ที่ที่bสามารถทำซ้ำได้และaเป็นองค์ประกอบของ ) โดยใช้ฟังก์ชั่นเครื่องกำเนิดไฟฟ้าพร้อมกับการเป็น API ง่ายมันก็จะช่วยให้มีรหัสนำมาใช้ใหม่โดยการทำให้มันเพื่อให้คุณไม่ต้องทำซ้ำตรรกะซ้ำทุกที่ที่คุณต้องการที่จะย้ำลึกเกี่ยวกับคุณสมบัติของวัตถุและมันยังทำให้มันเป็นไปได้ที่จะbreakออกจาก วนรอบหากคุณต้องการหยุดการทำซ้ำก่อนหน้านี้
สิ่งหนึ่งที่ฉันสังเกตเห็นว่ายังไม่ได้รับการแก้ไขและที่ไม่ได้อยู่ในคำตอบเดิมของฉันคือคุณควรระมัดระวังการข้ามวัตถุ (เช่นชุดสุ่ม) ใด ๆ โดยพลการเนื่องจากวัตถุ JavaScript สามารถอ้างอิงตัวเองได้ สิ่งนี้จะสร้างโอกาสที่จะมีการวนรอบแบบไม่สิ้นสุด ข้อมูล JSON ที่ไม่ได้แก้ไข แต่ไม่สามารถอ้างอิงตัวเองได้ดังนั้นหากคุณใช้ชุดย่อยของวัตถุ JS นี้คุณไม่ต้องกังวลกับการวนซ้ำวนวนวนไม่สิ้นสุดและคุณสามารถอ้างอิงคำตอบดั้งเดิมของฉันหรือคำตอบอื่น ๆ ได้ นี่คือตัวอย่างของการแวะผ่านที่ไม่มีที่สิ้นสุด (โปรดทราบว่ามันไม่ใช่โค้ดที่รันได้เพราะมิฉะนั้นมันจะทำให้แท็บเบราว์เซอร์ของคุณเสียหาย)
นอกจากนี้ในวัตถุตัวสร้างในตัวอย่างที่แก้ไขของฉันฉันเลือกที่จะใช้Object.keysแทนfor inซึ่งจะทำซ้ำเฉพาะคีย์ที่ไม่ใช่ต้นแบบบนวัตถุ คุณสามารถสลับได้ด้วยตัวคุณเองหากคุณต้องการให้มีปุ่มตัวต้นแบบรวมอยู่ด้วย ดูในส่วนคำตอบของฉันเดิมด้านล่างสำหรับการใช้งานทั้งที่มีและObject.keysfor in
เลวลง - นี่จะวนซ้ำไม่ จำกัด บนวัตถุที่อ้างอิงตนเอง:
//your object
var o = {
foo:"bar",
arr:[1,2,3],
subo: {
foo2:"bar2"
}
};
// this self-referential property assignment is the only edited line
// from the below original example which makes the traversal
// non-terminating (i.e. it makes it infinite loop)
o.o = o;
function* traverse(o, path=[]) {
for (var i of Object.keys(o)) {
const itemPath = path.concat(i);
yield [i,o[i],itemPath];
if (o[i] !== null && typeof(o[i])=="object") {
//going one step down in the object tree!!
yield* traverse(o[I], itemPath);
}
}
}
//that's all... no magic, no bloated framework
for(var [key, value, path] of traverse(o)) {
// do something here with each key and value
console.log(key, value, path);
}
เพื่อช่วยตัวคุณเองจากสิ่งนี้คุณสามารถเพิ่มชุดภายในการปิดดังนั้นเมื่อมีการเรียกใช้ฟังก์ชั่นครั้งแรกมันจะเริ่มสร้างหน่วยความจำของวัตถุที่มันเห็นและไม่ดำเนินการทำซ้ำเมื่อมันเจอวัตถุที่เห็นอยู่แล้ว ตัวอย่างโค้ดด้านล่างทำเช่นนั้นและจัดการกรณีการวนลูปไม่สิ้นสุด
ดีกว่า - สิ่งนี้จะไม่วนซ้ำไม่ จำกัด บนวัตถุที่อ้างอิงตนเอง:
//your object
var o = {
foo:"bar",
arr:[1,2,3],
subo: {
foo2:"bar2"
}
};
// this self-referential property assignment is the only edited line
// from the below original example which makes more naive traversals
// non-terminating (i.e. it makes it infinite loop)
o.o = o;
function* traverse(o) {
const memory = new Set();
function * innerTraversal (o, path=[]) {
if(memory.has(o)) {
// we've seen this object before don't iterate it
return;
}
// add the new object to our memory.
memory.add(o);
for (var i of Object.keys(o)) {
const itemPath = path.concat(i);
yield [i,o[i],itemPath];
if (o[i] !== null && typeof(o[i])=="object") {
//going one step down in the object tree!!
yield* innerTraversal(o[i], itemPath);
}
}
}
yield* innerTraversal(o);
}
console.log(o);
//that's all... no magic, no bloated framework
for(var [key, value, path] of traverse(o)) {
// do something here with each key and value
console.log(key, value, path);
}
คำตอบเดิม
สำหรับวิธีที่ใหม่กว่าที่จะทำถ้าคุณไม่รังเกียจที่จะปล่อย IE และสนับสนุนเบราว์เซอร์ปัจจุบันเป็นส่วนใหญ่ (ตรวจสอบตาราง es6 ของ kangaxเพื่อความเข้ากันได้) คุณสามารถใช้เครื่องกำเนิดไฟฟ้า es2015 สำหรับสิ่งนี้ ฉันได้อัปเดตคำตอบของ @ TheHippo แล้ว แน่นอนถ้าคุณต้องการการสนับสนุน IE จริงๆคุณสามารถใช้transpiler ของ babel JavaScript
//your object
var o = {
foo:"bar",
arr:[1,2,3],
subo: {
foo2:"bar2"
}
};
function* traverse(o, path=[]) {
for (var i in o) {
const itemPath = path.concat(i);
yield [i,o[i],itemPath];
if (o[i] !== null && typeof(o[i])=="object") {
//going one step down in the object tree!!
yield* traverse(o[i], itemPath);
}
}
}
//that's all... no magic, no bloated framework
for(var [key, value, path] of traverse(o)) {
// do something here with each key and value
console.log(key, value, path);
}
หากคุณต้องการให้มีคุณสมบัติที่นับได้เท่านั้น (โดยทั่วไปไม่ใช่คุณสมบัติของลูกโซ่ต้นแบบ) คุณสามารถเปลี่ยนเป็นวนซ้ำโดยใช้Object.keysและfor...ofวนซ้ำแทน:
//your object
var o = {
foo:"bar",
arr:[1,2,3],
subo: {
foo2:"bar2"
}
};
function* traverse(o,path=[]) {
for (var i of Object.keys(o)) {
const itemPath = path.concat(i);
yield [i,o[i],itemPath];
if (o[i] !== null && typeof(o[i])=="object") {
//going one step down in the object tree!!
yield* traverse(o[i],itemPath);
}
}
}
//that's all... no magic, no bloated framework
for(var [key, value, path] of traverse(o)) {
// do something here with each key and value
console.log(key, value, path);
}