递归搜索
这是我写的关于recently 的主题。这是一个通用的deepFind。它以递归方式工作，可以“搜索”任何输入值。
下面我们构造一个简单的data集合，然后展示deepFind如何搜索数据并返回匹配项
const data =
[ { a: 1, b: 1 }
, { a: 2, b: 2, c: { d: [ { e: 2 } ] } }
, { a: 3, b: { c: { d: { e: { f: 3 } } } } }
]
const deepFind = (f, obj = {}) =>
{ if (Object (obj) === obj)
{ if (f (obj) === true)
return obj
for (const [ k, v ] of Object.entries (obj))
{ const res =
deepFind (f, v)
if (res !== undefined)
return res
}
}
return undefined
}
console.log
( deepFind (x => x.a === 1, data) // { a: 1, b: 1 }
, deepFind (x => x.e === 2, data) // { e: 2 }
, deepFind (x => Array.isArray(x.d), data) // { d: [ { e: 2 } ] }
, deepFind (x => x.f === 3, data) // { f: 3 }
, deepFind (x => x.e && x.e.f === 3, data) // { e: { f: 3 } }
, deepFind (x => x.z === 9, data) // undefined
)
deepFind 以上仅适用于直接使用 === 匹配值。因为它接受高阶函数f，所以我们可以用有意义的方式专门化它的行为。
字符串匹配使用deepFind
下面我们使用deepFind对我们的通用字符串匹配search函数进行编码
const search = (query = "", data) =>
deepFind
( o =>
Object.values (o) .some (v =>
String (v) === v && v .includes (query))
, data
)
search ("D", result)
// { name: "Donna Shomaker", ... }
search ("Du", result)
// { name: "Ron Duluth", ... }
search ("ng3", result)
// { name: "Jimmy Dawson", sneak: "string3 string3 string3", ... }
search ("zzz", result)
// undefined
在您自己的浏览器中验证结果
const deepFind = (f, obj = {}) =>
{ if (Object (obj) === obj)
{ if (f (obj) === true)
return obj
for (const [ k, v ] of Object.entries (obj))
{ const res =
deepFind (f, v)
if (res !== undefined)
return res
}
}
return undefined
}
const search = (query = "", data) =>
deepFind
( o =>
Object.values (o) .some (v =>
String (v) === v && v .includes (query))
, data
)
const result =
[ { name: 'Donna Shomaker'
, custNumber: '6658924351'
, sneak: 'string1 string1 string1'
, foo: false
, bar: false
}
, { name: 'Ron Duluth'
, custNumber: '8812654434'
, sneak: 'string2 string2 string2'
, foo: false
, bar: false
}
, { name: 'Jimmy Dawson'
, custNumber: '8908198230'
, sneak: 'string3 string3 string3'
, foo: false
, bar: false
}
]
console.log (search ("D", result))
// { name: "Donna Shomaker", ... }
console.log (search ("Du", result))
// { name: "Ron Duluth", ... }
console.log (search ("ng3", result))
// { name: "Jimmy Dawson", sneak: "string3 string3 string3", ... }
console.log (search ("zzz", result))
// undefined
返回多个搜索结果
上面的程序只返回 first 匹配。如果您想返回所有结果，我们可以使用非常适合此任务的生成器来实现
const deepFindAll = function* (f, o = {})
{ if (Object (o) === o)
{ if (f (o) === true)
yield o
for (const [ _, v ] of Object.entries (o))
yield* deepFindAll (f, v)
}
}
现在我们使用我们的新生成器实现searchAll
const searchAll = (query = "", data = {}) =>
Array.from
( deepFindAll
( o =>
Object.values (o) .some (v =>
String (v) === v && v .includes (query))
, data
)
)
searchAll ("81", result)
// [ { custNumber: '8812654434', ... }
// , { custNumber: '8908198230', ... }
// ]
searchAll ("Du", result)
// [ { name: "Ron Duluth", ... } ]
searchAll ("zzz", result)
// []
在下面的浏览器中运行searchAll
const deepFindAll = function* (f, o = {})
{ if (Object (o) === o)
{ if (f (o) === true)
yield o
for (const [ _, v ] of Object.entries (o))
yield* deepFindAll (f, v)
}
}
const searchAll = (query = "", data = {}) =>
Array.from
( deepFindAll
( o =>
Object.values (o) .some (v =>
String (v) === v && v .includes (query))
, data
)
)
const result =
[ { name: 'Donna Shomaker'
, custNumber: '6658924351'
, sneak: 'string1 string1 string1'
, foo: false
, bar: false
}
, { name: 'Ron Duluth'
, custNumber: '8812654434'
, sneak: 'string2 string2 string2'
, foo: false
, bar: false
}
, { name: 'Jimmy Dawson'
, custNumber: '8908198230'
, sneak: 'string3 string3 string3'
, foo: false
, bar: false
}
]
console.log (searchAll ("81", result))
// [ { custNumber: '8812654434', ... }
// , { custNumber: '8908198230', ... }
// ]
console.log (searchAll ("Du", result))
// [ { name: "Ron Duluth", ... } ]
console.log (searchAll ("zzz", result))
// []
不区分大小写的搜索
在上面，我们的search 函数使用v .includes (query)，但是因为我们使用的是高阶函数，所以我们可以根据需要使行为具体化。
以searchAll 为例，我们可以如下修改
const searchAll = (query = "", data = {}) =>
Array.from
( deepFindAll
( o =>
Object.values (o) .some (v =>
String (v) === v && v .includes (query))
String (v) === v
&& v .toLowerCase () .includes (query .toLowerCase ()))
, data
)
)
但这会让我们的功能变得一团糟。是时候抽象一点，并通过给我们的意图命名来解释我们在做什么
const anyString = f => o =>
Object.values (o) .some (v =>
String (v) === v && f (v))
const caseInsenstiveMatch = (x, y) =>
x.toLowerCase () .includes (y.toLowerCase ())
const searchAll = (query = "", data = {}) =>
Array.from
( deepFindAll
( anyString (v =>
caseInsenstiveMatch (v, query))
, data
)
)
隔离行为和定义单独的函数是编写好的程序的重要部分。并排显示search 和searchAll 突出了这一重要性。新的帮助器anyString 和caseInsensitiveSearch 保持代码清晰，但也更容易在需要的地方重用行为。
const search = (query = "", data) =>
deepFind
( anyString (v =>
caseInsenstiveMatch (v, query))
, data
)
const searchAll = (query = "", data = {}) =>
Array.from
( deepFindAll
( anyString (v =>
caseInsenstiveMatch (v, query))
, data
)
)
对比图
高阶函数有各种各样的用途来保持我们的代码简洁和描述性。下面，我们定义了match 和lower 的简单版本。然后使用contramap，将我们的程序整合在一起。
这里的重点是每个功能的简单性。一个简单的函数更容易测试，更容易调试，也更容易与其他简单函数结合。 Unix 哲学"Do one thing and do it well" 现在应该在你耳边响起
const contramap = (f, g) =>
(x, y) => f (g (x), g (y))
const match = (x = "", y = "") =>
x .includes (y)
const lower = (x = "") =>
x .toLowerCase ()
const caseInsenstiveMatch =
contramap (match, lower)
const anyString = (f) => (o = {}) =>
Object.values (o) .some (v =>
String (v) === v && f (v))
const searchAll = (query = "", data = {}) =>
Array.from
( deepFindAll
( anyString (v =>
caseInsenstiveMatch (v, query))
, data
)
)
Contramap 可以解锁其他可能不会立即显现的能力。如果你感兴趣，我推荐 Brian Lonsdorf 的 Monoidal Contravariant Functors are actually useful!。不要让标题吓到你；作者有使这些东西变得简单的诀窍。