snippetjavascriptMinor
SQL LIKE search in Angular filter objects
Viewed 0 times
searchobjectssqlangularlikefilter
Problem
I made this AngularJS 1.x filter, to search using a the same SQL
Under the hood I'm simply building a RegExp from a format string passed as a parameter (ie. the search string), then I'm looping over all the object properties inside an input array (first parameter).
I'm looking for some feedback about performance, and in particular about any possible "edge cases" in which it would perform bad or could possibly break.
Here's the code (ES6/ES2015 syntax):
Example usage:
JS code (angular filters module):
HTML code (angular template):
LIKE syntax. Right now only the percentage symbol (%) is supported, the underscore symbol (_) is not.Under the hood I'm simply building a RegExp from a format string passed as a parameter (ie. the search string), then I'm looping over all the object properties inside an input array (first parameter).
I'm looking for some feedback about performance, and in particular about any possible "edge cases" in which it would perform bad or could possibly break.
Here's the code (ES6/ES2015 syntax):
"use strict";
export default function likeFilter() {
return (input, format) => {
if (!(input instanceof Array && "string" === typeof format && format.length)) {
return input;
}
const like = format.indexOf("%") >= 0;
const startLike = like && format.charAt(0) === "%";
const endLike = like && format.charAt(format.length - 1) === "%";
const split = [];
split.splice(0, 0, ...format.split("%"));
if (startLike) {
split.shift();
}
if (endLike) {
split.pop();
}
let regexp = split.join(".*");
if (!startLike) {
regexp = "^" + regexp;
}
if (!endLike) {
regexp += "$";
}
regexp = new RegExp(regexp, "mi");
return input.filter(el => {
for (let key in el) {
if (el.hasOwnProperty(key)) {
if (regexp.test(el[key])) {
return true;
}
}
}
return false;
});
}
};Example usage:
JS code (angular filters module):
"use strict";
import likeFilter from "./like";
filtersModule.filter("like", likeFilter);HTML code (angular template):
Solution
I think you inverted startLike with endLike.
When I read startLike I could misunderstand with startWith, that is the popular term used in APIs.
So it's complicated to read the code, as you work with an inverted logic.
I will use startWith(== endLike) and endWith (== startLike), instead.
Another point about naming is:
I think it is meaningless and a very bad choice for an array name.
Consider the case in a future time if you need to use Array.split():
Not so good in readability.
Consider the code:
Not sure why you want to do all this work to just assign an array.
You could just use:
const like = format.indexOf("%") >= 0;
const startLike = like && format.charAt(0) === "%";
const endLike = like && format.charAt(format.length - 1) === "%";When I read startLike I could misunderstand with startWith, that is the popular term used in APIs.
So it's complicated to read the code, as you work with an inverted logic.
I will use startWith(== endLike) and endWith (== startLike), instead.
Another point about naming is:
const split = [];I think it is meaningless and a very bad choice for an array name.
Consider the case in a future time if you need to use Array.split():
split.split(...);Not so good in readability.
Consider the code:
const split = [];
split.splice(0, 0, ...format.split("%"));Not sure why you want to do all this work to just assign an array.
You could just use:
const split = format.split("%");Code Snippets
const like = format.indexOf("%") >= 0;
const startLike = like && format.charAt(0) === "%";
const endLike = like && format.charAt(format.length - 1) === "%";const split = [];split.split(...);const split = [];
split.splice(0, 0, ...format.split("%"));const split = format.split("%");Context
StackExchange Code Review Q#148353, answer score: 3
Revisions (0)
No revisions yet.