Create a gist now

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Solutions in JavaScript to return a Array as a String and manipulate it with performance tests and examples
/* eslint-disable
require-jsdoc,
no-var,
camelcase,
no-console,
no-unused-vars
*/
/**
* @fileOverview string2Array
Solutions in JavaScript to return a Array as a String and manipulate it
with performance tests and examples
* @author Simon Gattner <github@0x38.de>
* @license MIT
* @version 1.1.0
*/
//
// function array2String()
// @param arr (array) [0,1,2,3,4,5,6,7,8,9...]
// @param delimiter (string) ', '
// @param list (string) ''
// function array2String(arr, delimiter, list) {
// for (var i = 0, l = arr.length; i < l; i++) {
// list = list + delimiter + arr[i];
// }
// return list;
// }
//
// (I)
// Take a look at https://youtu.be/o8NPllzkFhE?t=14m20s
//
// (Q)
// Maintainable
// Readable
// Inteligent
// Performant
// Scalable
//
// Do we always return a string?
// Do we use speaking var names?
// Do we have a scale and readable solution?
// What do we need to change if we like to render an unordered-list?
// What do we need to change if we like to render a hash-tag list?
//
// Do it better
// - params object
// - params.delimiter
// - ..args / ...params
// - error handling (try, catch / typeof)
// - () =>
// - are there other options?
// - yield
// - next Iterators
// - for, while, join ...
// (R)
// You may run this script by copy and past it into your browser console
//
// examples
// examples 000
// base
function array2String__000(arr, delimiter, list) {
for (var i = 0, l = arr.length; i < l; i++) {
list = list + delimiter + arr[i];
}
return list;
}
// example 100
function array2String__100(arr, delimiter, list) {
for (var i = 1, l = arr.length; i < l; i++) {
list = list + delimiter + arr[i];
}
return arr[0] + list;
}
// example 101
function array2String__101(arr, delimiter, list) {
for (const item of arr) {
list = list + delimiter + item;
}
return list.slice(delimiter.length);
}
// example 102
function array2String__102(arr, delimiter, list) {
for (const index in arr) {
list = list + delimiter + arr[index];
}
return list.slice(delimiter.length);
}
// example 200
function array2String__200(arr, delimiter, list) {
var deli = '';
for (var i = 0, l = arr.length; i < l; i++) {
if (i > 0) deli = delimiter;
list = list + deli + arr[i];
}
return list;
}
// example 300
function array2String__300(arr, delimiter, list) {
for (var i = 0, l = arr.length; i < l; i++) {
list = (i === 0) ? arr[i] : list + delimiter + arr[i];
}
return list;
}
// example 400
function array2String__400(arr, delimiter, list) {
for (var i = 0, l = arr.length; i < l; i++) {
list = list + delimiter + arr[i];
}
return list.slice(delimiter.length);
}
// example 500
function array2String__500(arr, delimiter, list) {
var n = 0;
while (n < arr.length) {
list = list + delimiter + arr[n];
n++;
}
return list.substring(delimiter.length);
}
// example 600
function array2String__600(arr, delimiter, list) {
function replacer(key, value) {
return value.toString().replace(/,/g, delimiter);
}
return list + JSON.stringify(arr, replacer)
.slice(1, -1);
}
// example 700
function array2String__700(arr, delimiter, list) {
return list + arr.join(delimiter);
}
// example 800
function array2String__800(arr, delimiter, list) {
return list + arr
.toString()
.replace(/,/g, delimiter);
}
//
//
// improve
function array2String__550(arr, delimiter, list) {
var n = 1;
while (n < arr.length) {
list = list + delimiter + arr[n];
n++;
}
return arr[0] + list;
}
// improve
function array2String__110(arr, delimiter, list) {
for (const [index, value] of arr.entries()) {
list = (index > 0) ? list + delimiter + value : value;
}
return list;
}
// scale
function array2String__998(arr, delimiter, list) {
var n = 1;
var l = arr.length;
while (n < l) {
list = list + delimiter + arr[n++];
}
return arr[0] + list;
}
// params / handle errors
function array2String__990(params) {
if (
typeof params === 'object' &&
typeof params.array === 'object'
) {
var delimiter = ', ' || params.delimiter;
var list = '' || params.list;
for (const [index, value] of params.array.entries()) {
list = (index > 0) ? list + delimiter + value : value;
}
return list;
} else {
return false;
}
}
function array2String__999(params) {
if (
typeof params === 'object' &&
typeof params.array === 'object'
) {
var delimiter = ', ' || params.delimiter;
var list = '' || params.list;
var n = 1;
var len = params.array.length;
while (n < len) {
list = list + delimiter + params.array[n++];
}
return arr[0] + list;
} else {
return false;
}
}
// iterator / next
function array2String__910(arr, delimiter, list) {
var iterable = {
[Symbol.iterator]() {
var data = arr.slice();
return {
next() {
return {
done: data.length === 0,
value: (data.length > 1) ? delimiter + data.pop() : data.pop(),
};
},
};
},
};
for (var e of iterable) {
list = e + list;
}
return list;
}
//
//
// testing
// helper
function makeNumberArray(from, to) {
var arr = [];
var n = from;
to = to + 1;
while (n < to) {
arr.push(n++);
}
return arr;
}
// var arr = makeNumberArray(0, 99); // dev
var arr = makeNumberArray(0, 99999); // testing
var list = '';
var delimiter = ', ';
var t0;
var t1;
//
// integration test
function testing(debug) {
[
'000', 100, 101, 102, 110, 200, 300, 400, 500,
600, 700, 800, 550, 910, 990, 998, 999,
].forEach(function(e) {
var evaled;
var currentFunction = 'array2String__' +
e.toString() + '(arr,delimiter,list)';
console.log(currentFunction + ':');
if (e !== 999 && e !== 990) {
evaled = eval(currentFunction);
if (debug) console.log(evaled);
} else {
evaled = eval('array2String__' + e.toString() +
'({array: arr, delimiter: delimiter, list: list})');
if (debug) console.log(evaled);
}
if (evaled === array2String__200(arr, delimiter, list)) {
console.info(currentFunction + ' OK.');
} else {
console.warn(currentFunction + ' Error.');
}
});
}
//
// perform test
function perform() {
t0 = performance.now();
array2String__000(arr, delimiter, list); // return ', 1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__000 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__100(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__100 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__101(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__101 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__102(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__102 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__110(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__110 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__200(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__200 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__300(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__300 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__400(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__400 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__500(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__500 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__600(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__600 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__700(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__700 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__800(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__800 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__550(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__550 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__910(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__910 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__990({
'array': arr,
'delimiter': delimiter,
'list': list,
}); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__990 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__998(arr, delimiter, list); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__998 took ' + (t1 - t0) + ' milliseconds.');
t0 = performance.now();
array2String__999({
'array': arr,
'delimiter': delimiter,
'list': list,
}); // return '1, 2, 3, 4, 5 ...'
t1 = performance.now();
console.log('Call to array2String__999 took ' + (t1 - t0) + ' milliseconds.');
}
console.info('Run perform() to show performance of each function.');
console.info(
'Run testing() to test each function. ' +
'Run testing(true) will also show the return values of each function'
);
/*
Chrome
Call to array2String__000 took 11.499999993247911 milliseconds.
VM1410:302 Call to array2String__100 took 10.49999997485429 milliseconds.
VM1410:307 Call to array2String__101 took 15.400000003864989 milliseconds.
VM1410:312 Call to array2String__102 took 28.200000000651926 milliseconds.
VM1410:317 Call to array2String__110 took 16.900000016903505 milliseconds.
VM1410:322 Call to array2String__200 took 13.999999995576218 milliseconds.
VM1410:327 Call to array2String__300 took 10.300000023562461 milliseconds.
VM1410:332 Call to array2String__400 took 13.699999981326982 milliseconds.
VM1410:337 Call to array2String__500 took 13.000000006286427 milliseconds.
VM1410:342 Call to array2String__600 took 25.30000000842847 milliseconds.
VM1410:347 Call to array2String__700 took 12.799999996786937 milliseconds.
VM1410:352 Call to array2String__800 took 20.600000018021092 milliseconds.
VM1410:357 Call to array2String__550 took 19.99999998952262 milliseconds.
VM1410:362 Call to array2String__910 took 25.199999974574894 milliseconds.
VM1410:371 Call to array2String__990 took 11.200000008102506 milliseconds.
VM1410:376 Call to array2String__998 took 10.900000022957101 milliseconds.
VM1410:385 Call to array2String__999 took 7.400000002235174 milliseconds.
Firefox
Call to array2String__000 took 9 milliseconds. debugger eval code:297:3
Call to array2String__100 took 9 milliseconds. debugger eval code:302:3
Call to array2String__101 took 18 milliseconds. debugger eval code:307:3
Call to array2String__102 took 37 milliseconds. debugger eval code:312:3
Call to array2String__110 took 19 milliseconds. debugger eval code:317:3
Call to array2String__200 took 17 milliseconds. debugger eval code:322:3
Call to array2String__300 took 10 milliseconds. debugger eval code:327:3
Call to array2String__400 took 8 milliseconds. debugger eval code:332:3
Call to array2String__500 took 8 milliseconds. debugger eval code:337:3
Call to array2String__600 took 17 milliseconds. debugger eval code:342:3
Call to array2String__700 took 3 milliseconds. debugger eval code:347:3
Call to array2String__800 took 59 milliseconds. debugger eval code:352:3
Call to array2String__550 took 4 milliseconds. debugger eval code:357:3
Call to array2String__910 took 23 milliseconds. debugger eval code:362:3
Call to array2String__990 took 17 milliseconds. debugger eval code:371:3
Call to array2String__998 took 9 milliseconds. debugger eval code:376:3
Call to array2String__999 took 9 milliseconds. debugger eval code:385:3
Safari
[Log] Call to array2String__000 took 7 milliseconds.
[Log] Call to array2String__100 took 7 milliseconds.
[Log] Call to array2String__101 took 35 milliseconds.
[Log] Call to array2String__102 took 32.999999999992724 milliseconds.
[Log] Call to array2String__110 took 44 milliseconds.
[Log] Call to array2String__200 took 10 milliseconds.
[Log] Call to array2String__300 took 28 milliseconds.
[Log] Call to array2String__400 took 25 milliseconds.
[Log] Call to array2String__500 took 11 milliseconds.
[Log] Call to array2String__600 took 12 milliseconds.
[Log] Call to array2String__700 took 5.000000000007276 milliseconds.
[Log] Call to array2String__800 took 9 milliseconds.
[Log] Call to array2String__550 took 7.999999999992724 milliseconds.
[Log] Call to array2String__910 took 22 milliseconds.
[Log] Call to array2String__990 took 47 milliseconds.
[Log] Call to array2String__998 took 7 milliseconds.
[Log] Call to array2String__999 took 8 milliseconds.
*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment