DEV Community

D\sTro

Posted on • Updated on

[javascript] Array Partitioning by Length

Post #8

i am starting a new initiative today as "Building Custom Algorithm in Javascript without using inbuilt method"

i hope you guy will find this interesting. i will be writing a Polyfill/Vanilla of one javascript method everyday. starting today with a custom one

Algorithm : Partitioning array elements by range!
Workaround: [1, 2, 3, 4, 5, 6] should produce ["12", "34", "56"] or ["123", "456"] without using map() reduce() filter()

this is my implementation:
Note: always use arrow method. its not just a trend but it protects you from getting into severe undetectable bugs sometime.

Method 1 : using splice()

`````` let groupInString = (array, length)=>
{
let newArr = []; init = 0;
for(let i=0; i <= parseInt(array.length/length); i++){
newArr.push(
array.splice(init, length, null).join("")
);
init++;
}
return newArr;
}

// Testing:
groupInString([1, 2, 3, 4, 5, 6], 2); //["12", "34", "56"]
groupInString([1, 2, 3, 4, 5, 6], 3); //["123","456"]

``````

you can also try it on code pen here: Link

Method 2: Replicating same using slice()

``````let groupInString = (array, length)=>
{
let newArr = []; init = 0;
let lth = length;
for(let i=0; i < parseInt(array.length/length); i++){
newArr.push(
array.slice(init, lth).join("")
);
init = lth; lth += length;
}
return newArr;
}
``````

thanks for catching the point @avalander

i will keep posting new scripts everyday and in case you have some algo you want it scripted(vanilla) then you can just comment it and i will post!

Avalander

Are you aware that your function is both returning a new instance of an array and mutating the array provided as an input? That's bound to be confusing to anyone using that function, maybe it should just do one or the other.

D\sTro

yeah you're right. its returning new array to keep things clear. like on demand you can say which means its total new instead tempering oute properties. this one you asked right :

array.forEach(function(x, y) {
// partition
}, array);

// this would not yield new instance but i didnt infroce use of map/reduce/filter etc. its like a plain pure javascript touch

Avalander

I don't really understand how `forEach` is supposed to help here, the thing is that you are using Array.prototype.splice, which mutates the original array.

If you run this code:

``````const a = [ 1, 2, 3, 4 ]
groupInString(a, 2)
console.log(a)
``````

You'll see that your function, besides returning the array `[ '12', '34' ]` mutated `a` into `[ null, null ]` as a side effect, which is inconvenient if somebody intended to use that array in several operations.

It is a lot better if functions return new values without modifying the input values. Without making big changes, you can fix your function not to modify the input array by using slice instead of splice.

``````const groupInString = (array, length) => {
const newArr = []
for(let i = 0; i < array.length; i+= length) {
newArr.push(
array.slice(i, i + length).join('')
)
}
return newArr
}
``````

D\sTro

i got your point now. i have added both thru splice() as well as slice(). thanks for pointing out this friction. appreciate it

DEV Community

The JavaScript Brief

1. Top 5 MERN STACK projects to improve your practical understanding

Boost your MERN Stack development skills by undertaking interesting beginner projects. These five engaging projects cover web applications and range from social media website applications to geo-social networking maps. Hone your understanding and apply modern techniques backed up by hands-on experience.

2. How To Optimize Your React App’s Performance

Learn the best optimizing techniques to make your React applications faster and more efficient. Focusing on the identification of performance bottlenecks and common pitfalls to avoid, these optimization strategies will keep your applications running smoothly even when faced with growing complexity.

3. A story of let, const, object mutation, and a bug in my code

In the pursuit of bug-free code, explore an incident involving a mix-up between `const` and `let`, making sure your custom code works effectively with third

party documentation. Discover best practices on program flow and learn about JavaScript's unpredictable aspects to ensure your core code is robust.