Develop Reference

How do I view the contents of a set in Javascript in Visual Studio Code?

I am using Visual Studio Code Insiders.
I am teaching myself this as well as Javascript at the same time using a textbook from SitePoint.
I noticed that when I tried to display the contents of my set as shown in the book, I could only display the number of elements in the set. However, I was supposed to see the contents of the set. When using the command line, the contents did indeed show.
Is it my text editor settings, or is this normal? What can I do to be able to see the contents of my sets on my text editor? Am I supposed to keep copying and pasting my sets into the command line to see if they work?
This is what I entered:
const letters = new Set ('hello');
console.log(letters);
This is what VS Code Insider printed:
>>Set(4) {}
This is what the command line printed:
const letters = new Set('hello');
>>undefined
console.log(letters);
>>Set { 'h', 'e', 'l', 'o' }
I find I have no problem printing the contents of an array, so I'm not sure what's wrong.

I noticed that when I tried to display the contents of my set as shown in the book, I could only display the number of elements in the set
Displaying the contents of a variable in JavaScript depends on the environment in which JavaScript runs.
As you pointed out, VS Code displays differently than the command line. Each of them are different interpreters.
is this normal?
Yes
What can I do to be able to see the contents of my sets on my text editor? [...] I find I have no problem printing the contents of an array
Since it works for an array (which indicates that both interpreters have very similar implementation for this type) you can convert the Set into an array when displaying:
const letters = new Set ('hello');
console.log(Array.from(letters));
console.log([...letters]) // or this way

Visual studio 2015: can't see objects content in javascript console

I used to see all my javascript objects content like this before:
But now, I don't know why but it doesn't show their content at all:
I use visual studio 2015 community with cordova and Ripple emulator.
I tried to create a new project or even tried to uninstall / reinstall VS2015, but it didn't work.
To make it more clearly, I don't have the "expando-toggly" button on the left of my objects any more.
Do you have any idea about the reason ? I just use console.log and console.error as I always did before.

To make it more clearly, I don't have the "expando-toggly" button on the left of my objects any more. Do you have any idea about the reason ?
console.log/console.error take two arguments, the first is argument is the string message, which will be printed as a string in js console. The second is the object message, which can be expanded like an object.
So if you want to log the object in javascript console. You simply need to pass the object as the second argument to console.log/console.error.
ex:
var parentElement = document.getElementById('deviceready');
console.log("parentElement: ", parentElement);
and the result:

How to disable "special commands" in node.js REPL?

Problem Node REPL has some "special commands" like .break and .save. I never use these, but I do very frequently try and paste into the REPL code that's formatted like so:
words.append('ul')
.classed('my-class', true)
.selectAll('li.new-class')
.data((tuple, tupleIdx) => obj[tupleIdx])
.enter()
.append('li')
.classed('new-class', true)
.text(d => '' + foo(d));
(This is d3.js code but similar things happen when using Promises, a chain of .then(...)s starting on each line.)
Of course node complains about "invalid REPL keyword" when it sees .classed or .then on its own line and proceeds to print a sequence of error messages several screens long.
Tenuous pseudo-workaround I've worked around this with a regexp in Vim that moves any whitespace between closing parens and dots to after the dot (:%s/)\n\(\s*\)\./).\r\1/ for completeness) but this is tedious and often I want to copy-paste from a browser and not switch to Vim to reformat some code.
Question Is there any way to disable node REPL "features" which, while well-intentioned, conflict with standard JavaScript practices, such as lines starting with dots?
Or is this too complicated for a terminal application, and if so, is there a way I can communicate with the node REPL via a browser's JS console (not node-monkey which only handles console.log)
PS. This question is mainly about lines starting with . but another such conflict is _ (worked around thankfully by n_).

You can make your own custom REPL. That option should give you maximal control over how your repl behaves.
Since the main problem here is pasting multi-line code into the default repl, as a workaround, try using the .editor special command.
Enter editor mode (Ctrl+D to finish, Ctrl+C to cancel).
It's also mentioned in the answer to this question about writing multiple lines in the node repl
If you're also interested in saving keystrokes, when entering the editor, autocomplete seems to kick in after typing ".ed" so you can shave off three keystrokes in that sense.

You can simply delete the command from the instance:
const replServer = repl.start(/* ... */)
delete replServer.commands.load;
You can even define the whole commands object, take a look at the reference implementation:
https://github.com/nodejs/node/blob/main/lib/repl.js

Here's something tentative: using node-copy-paste, I wrote a tiny module that allows me to paste() the contents of clipboard and evals it after fixing lines starting with ..
This goes in paste.js:
var cp = require('copy-paste'); // npm install node-copy-paste
module.exports = function() {
return eval(cp.paste().replace(/\n\s*\./g, "."));
};
Then in node REPL, paste = require('./paste'); paste() will make it go. Very brittle but it might solve the problem often enough to be valuable.

How to prevent certain warning on IntelliJ?

What's the correct way to prevent warnings on IntelliJ, for example this code:
the .children_str gives warning Unresolved variable children_str. The children_str property is a string, and row is an Object.
Normally I would add a namespace (I don't know what is it, but it removes those warnings):
But then another warning appeared Unresolved function or method split()
What's the correct way to tell IntelliJ that children_str is a string to remove those warning message?

You can hit Alt+Enter to see Idea's way to resolve this warning. If there are none, you can always disable JavaScript Inspections. There are two ways:
Alt+Enter then click right arrow and select Disable Inspection
Go to File -> Settings -> Inspections and find JavaScript inspections options. There you can disable any inspections that annoy you, like Unresolved JavaScript function or Unresolved JavaScript variable

The warning can be removed by assigning and adding || operator, for example:
row.children_str = row.children_str || '';

how to align javascript's equals sign in webstorm

all
when i config my Webstorm9 settings like this ,it turns out that the sample code in the right aligns the equals sign properly
but when i formatting my javascript code in the editor it doesn't work,it still shows
and what i want is align the equals sign
anyone who can take a look?
-------EDIT------
maybe i misunderstand the checked option,but i copy the sample code to my editor then reformat it, oh,bad result..

In Webstorm 10,
Go to Settings> Editor> Code Style > JavaScript
Go to the "Other" tab and check "Align multiple 'var' statements and assignment" and click Ok.
Go to Code > Reformat code (Ctrl + Alt + L)
Voila!

In PHPStorm 2017 (and, I assume, by extension WebStorm) that behavior can be achieved by:
going to Settings > Editor > Code Style > JavaScript
Wrapping and Braces tab
scroll down to Variable declarations and set Align to When Grouped
Additionally, setting Variable declarations to Wrap always will result in this when reformatting:
Update: unchanged in version 2018 and in WebStorm/PHPStorm version 2019, the steps I described above still work the same.

Update for WebStorm 2017.3
Apparently, since version 2017.3, the Other tab has been removed from Code Style > JavaScript.
Now you have a couple of alignment options under the Wrapping and Braces tab (scroll down to the bottom):
It took me a while to figure this out, hope this helps

Update for Webstorm 2016.1
#Hudvoy still has the right answer for this. I've updated with a visual of where you need to look in Webstorm 2016.1

Take note that the exact phrasing of the option is
Align multiline variable declaration
(emphasis mine) and that the example code shows:
var myLink = {
....
},
local = true,
initial = -1;
This option only aligns the equal signs of multiline variable declarations, not a bunch of single line variable declarations in a row like in your code.
To have it automatically align them you would need to change your code to
a = 1,
bbbbb = 2,
thisisc = 3;
Note that you also have to add a var before it all, as WebStorm will assume a=1 to be a reference to a global variable, not a variable definition.
Also note that code formatting is not automatic. You have to select Code->Reformat Code... from the menu, or hit Ctrl + Alt + L to reformat your code.
I also found that Webstorm could perform code formatting on the Javascript within either a .html or .js file, but would not work within a .php file - in PHP files it only performs syntax highlighting.