Hello,
I'm not sure, but in find items -> one item:

reduce returns sum of the array, as I'd expect, while reduceRight 'flatten' arrays. Shouldn't it be also sum?

Three people on Chrome on a Mac had an issue with the output not showing up. I think it has to do with the timing of the scale in gsap. Need to investigate.

As specified by the "Important note", .sort() does not always behave as expcted when using numbers.
I think that the example should either sort an array of strings or provide a compare function.

e.g.

arr.sort((x, y) => x > y ? 1 : -1)

Sort should have a warning like the MDN docs

as a coder

Hi @sdras , I noticed that you're using let everywhere for default case, even when no reassignment occurs. Is this intentional ? I thought as default we'd use const.

in store/index.js

const languages = (ctx => {
  ....
})(require.context("./", true, /[a-z]{2}/));

What are these things?
when I console.log(require.context) or console.log(require) it's get error
so Amazing...
this code Related to webpack? or vue?

thanks

Problem with installation.
While running

npm run dev

internal/modules/cjs/loader.js:651
    throw err;
    ^

Error: Cannot find module 'webpack-cli/bin/config-yargs' 

Prod building goiing without problems
Test on Mac OS amd Windows PC

Update webpack - no results

Awesome tool btw, thanks! I have been working up the courage to contribute open source and maybe this could be the start of it.

I had to recently clone an array for a work project.
I see that you have a feature to do that in the ObjectExplorer.

Could we look at adding one here too?

The labels in AppMethodPrimary.vue and MethodChoice.vue use I (first person), whereas shortDesc in the store uses you (second person).

Perhaps the store should be changed to I to match the labels?

hi
please add Persian language

In slice() method description of English version of the service, the text states:

The slice() method returns a shallow copy of a portion of an array into a new array object. You can specify either just the ending element (where begin will default to zero) or both the beginning and the end, comma-separated. The original array will not be modified.

But in fact, we cannot specify only ending element, but the beginning one. To prove my words I will refer to w3schools.com, admitting that the signature of the method is the following: slice(start, end), where both parameters are optional. The start parameter comes first, so we cannot specify end parameter leaving the former out.

A PR (#97) was recently merged where we bumped the webpack-dev-server version from 2.11.3 to 3.1.11
This seems to cause some issues.
When running npm run dev
I get the error

The CLI moved into a separate package: webpack-cli
Please install 'webpack-cli' in addition to webpack itself to use the CLI
-> When using npm: npm i -D webpack-cli
-> When using yarn: yarn add -D webpack-cli
module.js:538
    throw err;
    ^

Error: Cannot find module 'webpack-cli/bin/config-yargs'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/km047841/myProjects/WebDev/array-explorer/node_modules/webpack-dev-server/bin/webpack-dev-server.js:84:1)
    at Module._compile (module.js:635:30)
    at Object.Module._extensions..js (module.js:646:10)
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)

Even after installing webpack-cli, I still get the error

module.js:538
    throw err;
    ^

Error: Cannot find module 'webpack-cli/bin/config-yargs'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/km047841/myProjects/WebDev/array-explorer/node_modules/webpack-dev-server/bin/webpack-dev-server.js:84:1)
    at Module._compile (module.js:635:30)
    at Object.Module._extensions..js (module.js:646:10)
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
    at Function.Module._load (module.js:489:3)

When I rolled back to webpack-dev-server 2.11.3, the error isn't there anymore. I'm no webpack expert, but I imagine it has to do with some changes needed in the webpack config for the latest webpack-dev-server. Maybe even webpack 4. I'll investigate more. Maybe use this as a way to learn about webpack, but obviously, if someone else/Sarah knows the solution or can figure it out quicker, feel free to fix it :)

Hi, when I choose a dropdown, then I need to click on another dropdown to see the full list, it's quite inconvenient.
I think it's better that when I choose a dropdown, it will display the next list on UI (e.g. with ul li tags) so that I can view and can click to choose the option.

In turkish language some sentences was not clear. I will fix that.

In the codepen, for the choice "find items", "one item", "the last index of a particular item" the example is using indexOf instead of lastIndexOf.

Hi,
Great work with this project! Would you consider adding immutable examples too? I could try to help

I was hoping to turn this tool into an Alfred extension, and the only way I can see to do that is to possibly deal with query params from the URL. Would you be interested in adding this to the current version?

Something like selecting "I would like to "add…" and "element/s to an array" would result in the URL as follows: https://sdras.github.io/array-explorer/add/?splice. Thoughts?

The line code numbers are approximate
src/App.vue
line 7: 'Array Explorer' Although this text could be the name of the application. In that case it should not be translated

line 8: 'Find the array method you need without digging through the docs'
line 12: 'Usage'

src/components/AppCode.vue
line 14: 'Output'

src/components:MethodBase.vue
line 5: 'see the docs'

It's not important or urgent. It's just details to leave it 100% translated.

I find that syntax highlighting makes code easier / faster to mentally parse.

scale: 0 from this line hides the animation and content.

Removing it with dev tools shows the animation as intended.

OS: Windows 10
Browser: Chrome 65

Can you provide reverse operation
For example, I choose Array.unshift()
result is:
I have an array, I would like to ....
I need to ad...

tks..

https://array-explorer.netlify.com/ instead https://arrayexplorer.netlify.com/

In codepen...

but I saw code is ok. ¯_(ツ)_/¯

Hi

Maybe you should allow user to play and experiments with snippet in "usage" and see the result in "output". So new javascript user could easily try these functions.

The tool contains array methods from ES5 up to ES7. A lot of these methods wouldn't work in IE11 for instance. Either the ECMAScript version or a ES6+ warning could let users know if they use said method they'd have to use a polyfill for pre-evergreen browser support or Node.js 4 or earlier.

Currently, it doesn't mention JavaScript anywhere, so someone with no context wouldn't know which programming language this tool is using.

The readme mentions the possibility of adding additional programming language support, but for now, since it's only JavaScript, perhaps change the text from Array Explorer to JavaScript Array Explorer.

Either way, this is an amazing tool. Thanks so much for building it!

I feel like indexOf's optional second parameter: fromIndex, is an unsung hero.

It has saved me many times from having to slice an array before calling indexOf.

Would you consider a PR with an example using fromIndex?

There's been a lot of interest supporting a bunch of different languages, and the first PR is in, so I need to build out a language switcher for the repo.