86

What is this?

This is a collection of questions that come up every now and then about syntax in JavaScript. This is also a Community Wiki, so everyone is invited to participate in maintaining this list.

Why is this?

Stack Overflow does not allow searching for particular characters. As a consequence, many questions about operators and other syntax tokens are not found easily when searching for them. This also makes closing duplicates more difficult. The list below is to help with this issue.

The main idea is to have links to existing questions on Stack Overflow, so it's easier for us to reference them, not to copy over content from the ECMAScript Spec.

Additionally, this is a blatant copy of the PHP symbol reference. We needed a JS one.


Please help. Edit and add links to other operators/syntax references, or if you can't find good questions/answers on a particular piece of syntax, add an answer to this question and link it

7
  • @amnotiam: Doesn't really matter, but this may be much easier to find/remember than any of the individual posts this links to. I had such a hard time searching for info on the | operator. The PHP version has been very useful as a go-to for closing dupes. Commented Mar 3, 2012 at 21:17
  • 1
    I'm of the opinion that this should, barring an official policy change, remain. ...or, perhaps, added to the tag-wiki. But the wiki doesn't seem an appropriate place for this content. It seems, despite the lack of potential for any 'answers' like enough a 'canonical question' that I'd be tempted to reopen. Though I'd yield to a mod's review. Commented Mar 3, 2012 at 21:40
  • 1
    @David Thomas: Unfortunately, tag wikis still suck. This is why even the book question remains a question today. Commented Mar 3, 2012 at 21:44
  • @ruakh yet see this obviously much-loved community wiki: stackoverflow.com/questions/388242/… - most of the content in in the question, with answers adding on additional information. That's the idea here. Commented Mar 3, 2012 at 21:59
  • @ruakh I rolled it back to fit the format of the PHP question that's linked - which, i may note, has not been closed or changed in format. It's much simpler to compile a list of common questions in a community wiki format than ask a very broad set of questions (as you edited it) and have to browse dozens of answers trying to find the one you want. I'll go with community on this one, but so far, it seems people generally like it the way it is. Commented Mar 3, 2012 at 22:12

1 Answer 1

275

See the documentation on MDN about expressions and operators and statements.

Basic keywords and general expressions

this keyword:

var x = function() vs. function x()  —  Function declaration syntax

(function(){})()  —  IIFE (Immediately Invoked Function Expression)

someFunction()()  —  Functions which return other functions

=>  —  Equal sign, greater than: arrow function expression syntax

|>  —  Pipe, greater than: Pipeline operator

function*, yield, yield*  —  Star after function or yield: generator functions

[], [ value ], Array()  —  Square brackets: array notation

If the square brackets appear on the left side of an assignment ([a] = ...), or inside a function's parameters, it's a destructuring assignment.

{}, { key: value }, { [key]: value }  —  Curly brackets: object literal syntax (not to be confused with blocks)

If the curly brackets appear on the left side of an assignment ({ a } = ...) or inside a function's parameters, it's a destructuring assignment.

`${}`  —  Backticks, dollar sign with curly brackets: template literals

//  —  Slashes: regular expression literals

$  —  Dollar sign in regex replace patterns: $$, $&, $`, $', $n

()  —  Parentheses: grouping operator


Property-related expressions

obj.prop, obj[prop], obj["prop"]  —  Square brackets or dot: property accessors

?., ?.[], ?.()  —  Question mark, dot: optional chaining operator

::  —  Double colon: bind operator

new operator

...iter  —  Three dots: spread syntax; rest parameters


Increment and decrement

++, --  —  Double plus or minus: pre- / post-increment / -decrement operators


Unary and binary (arithmetic, logical, bitwise) operators

delete operator

void operator

+, -  —  Plus and minus: addition or concatenation, and subtraction operators; unary sign operators

|, &, ^, ~  —  Single pipe, ampersand, circumflex, tilde: bitwise OR, AND, XOR, & NOT operators

%  —  Percent sign: remainder operator

&&, ||, !  —  Double ampersand, double pipe, exclamation point: logical operators

??  —  Double question mark: nullish-coalescing operator

**  —  Double star: power operator (exponentiation)


Equality operators

==, ===  —  Equal signs: equality operators

!=, !==  —  Exclamation point and equal signs: inequality operators


Bit shift operators

<<, >>, >>>  —  Two or three angle brackets: bit shift operators


Conditional operator

?:…  —  Question mark and colon: conditional (ternary) operator


Assignment operators

=  —  Equal sign: assignment operator

This symbol is also used for default parameters or default values in a destructuring assignment:

%=  —  Percent equals: remainder assignment

+=  —  Plus equals: addition assignment operator

&&=, ||=, ??=  —  Double ampersand, pipe, or question mark, followed by equal sign: logical assignments

<<=, >>=, >>>=, &=, ^=, |= — Double less than, double greater than, triple greater than, ampersand, caret, or pipe followed by equal sign: bitwise assignments

Destructuring


Comma operator

,  —  Comma operator (not to be confused with the comma used in variable declarations)


Control flow

{}  — Curly brackets: blocks (not to be confused with object literal syntax)

Declarations

var, let, const  —  Declaring variables


Label

label:  —  Colon: labels


Other

123n  —  n after integer: BigInt

#  —  Hash (number sign): Private methods or private fields

_  —  Underscore: separator in numeric literals

Sign up to request clarification or add additional context in comments.

6 Comments

what is it? object!.someKey
@AlexeyNikonov I don't think that there is the object!.somKey syntax in JavaScript, but in most languages it indicates that you are force-unwrapping a value, saying that you are sure that the object is defined and that it is not optional
@AlexeyNikonov That's typescript
@Bergi but what is the name of this operator ? i'd like to google about it more
@AlexeyNikonov It’s easy to just type the symbol names into Google.
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.