What does this symbol mean in JavaScript?

ghz 1years ago ⋅ 3032 views

Question

This question's answers are a[community effort](/help/privileges/edit- community-wiki). Edit existing answers to improve this post. It is not currently accepting new answers or interactions.

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](https://stackoverflow.com/questions/3737139/reference-what-does-this- symbol-mean-in-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

Answer

See the documentation on MDN about [expressions and operators](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Operators) and [statements](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/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](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Operators/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](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Operators/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](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#Bitwise_logical_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](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators#Bitwise_shift_operators)

Conditional operator

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

[Assignment operators](https://developer.mozilla.org/en-

US/docs/Web/JavaScript/Reference/Operators#Assignment_operators)

= — Equal sign: assignment operator

This symbol is also used for default parameters or default values in a [destructuring assignment](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment):

%= — Percent equals: remainder assignment

+= — Plus equals: addition assignment operator

[&&=](https://developer.mozilla.org/en-

US/docs/Web/JavaScript/Reference/Operators/Logical_AND_assignment), [||=](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Operators/Logical_OR_assignment), [??=](https://developer.mozilla.org/en- US/docs/Web/JavaScript/Reference/Operators/Logical_nullish_assignment) — 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

#javascript