어제 JS에서 객체를 반복적으로 반복하는 유틸리티 함수를 공유했습니다. JS의 특징 중 하나는 중첩된 객체에 대한 경로가 포함된 배열을 얻을 수 있다는 것입니다. 현재 루팅 중입니다. 그러나 중첩된 객체로 작업할 때 특정 순간에 특정 경로에서 데이터를 검색하거나 확인하고 싶을 수 있는데, 이것이 오늘날의 유틸리티 기능이 하는 일입니다.
이 코드를 자유롭게 복사하여 붙여넣으세요
/** * Retrieves data from an object on a given path * @param {Object} obj the object to get the data from * @param {string[]} path an array of strings containing the keys of the object to look at * @returns {*} the retrieved data or a Reference Error if not found */ function getDataFromObj(obj, path){ // Validate arguments if(getType(obj) != "object"){ throw TypeError("The `obj` argument is not an object"); } if(getType(path) != "array"){ throw TypeError("The `path` argument is not an array"); } // Get the data or a ReferenceError if not found const data = (()=>{ let currentData = obj; for(let i = 0; i < path.length; i +=1 ){ if(Object.keys(currentData).includes(path[i])){ currentData = currentData[path[i]]; continue; } else{ currentData = ReferenceError("The object path is not defined"); break; } } return currentData; })(); return data; } /** * A method to detect data types more accurately * Credits: Chris Ferdinandi, https://gomakethings.com/ * @param {*} data the data to be verified * @returns {String} the data type */ function getType(data){ return Object.prototype.toString.call(data).toLowerCase().slice(8, -1) } /** * License: MIT, https://opensource.org/license/mit * Copyright (c) 2024 Rodrigo Isaias Calix */
2개의 인수를 전달해야 합니다:
obj: 데이터를 검색하려는 개체
path: 따라야 할 시퀀스를 나타내는 배열
경로가 존재하면 값을 반환하고(값이 정의되지 않은 경우에도) 경로가 존재하지 않으면 ReferenceError 개체를 반환하며 오류를 발생시키지 않고 오류 개체만 반환합니다.
const products = { computers: { laptop: 20, desktop: 15, mini: 8 }, cameras: 20, externalDevices: { keyboard: { usb: 45, bluetooth: 25, other: undefined } } } // This would log 25 console.log(getDataFromObj(products, ["externalDevices", "keyboard", "bluetooth"])) // this would return a ReferenceError object (not a throw, just the error object) console.log(getDataFromObj(products, ["externalDevices", "mouse"])) // this would return `undefined` console.log(getDataFromObj(products, ["externalDevices", "keyboard", "other"]))
유틸리티 코드:
/** * verify if an object has an specific path * @param {Object} obj the object to be verified * @param {string[]} path an array of strings containing the keys of the object to look at * @returns {Boolean} `true` if found, otherwise `false` */ function isValidObjPath(obj, path){ // Validate arguments if(getType(obj) != "object"){ throw TypeError("The `obj` argument is not an object"); } if(getType(path) != "array"){ throw TypeError("The `path` argument is not an array"); } // shallow copy of the object to be verified let currentData = obj; // Verify the path for(let i = 0; i < path.length; i +=1 ){ if(Object.keys(currentData).includes(path[i])){ currentData = currentData[path[i]]; continue; } else{ return false; } } return true; } /** * A method to detect data types more accurately * Credits: Chris Ferdinandi, https://gomakethings.com/ * @param {*} data the data to be verified * @returns {String} the data type */ function getType(data){ return Object.prototype.toString.call(data).toLowerCase().slice(8, -1) } /** * License: MIT, https://opensource.org/license/mit * Copyright (c) 2024 Rodrigo Isaias Calix */
2개의 인수를 전달해야 합니다:
obj: 경로가 존재하는지 확인하려는 객체
path: 따라야 할 시퀀스를 나타내는 배열
검색 중인 경로가 존재하면 true를 반환하고, 그렇지 않으면 false를 반환합니다
const products = { computers: { laptop: 20, desktop: 15, mini: 8 }, cameras: 20, externalDevices: { keyboard: { usb: 45, bluetooth: 25, other: undefined } } } // This would log true console.log(isValidObjPath(products, ["externalDevices", "keyboard", "bluetooth"])) // this would log false console.log(isValidObjPath(products, ["externalDevices", "mouse"])) // this would log true console.log(isValidObjPath(products, ["externalDevices", "keyboard", "other"]))
객체 속성 이름은 점을 포함하는 광범위한 문자 집합이 포함된 문자열일 수도 있으므로 예를 들어 "computers.laptop": {[...]}는 유효한 객체인 배열입니다. 유연성과 정확성이 향상됩니다.
이 내용이 유용했다면 DEV에서 이와 같은 콘텐츠를 더 많이 공유하겠습니다!
X: https://x.com/schemetastic
에서도 저를 만나실 수 있습니다.나중을 위해 저장해 두세요 ?
위 내용은 중첩된 객체의 경로 가져오기 및 확인 - 유틸리티 함수 #2의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!