Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is :: before this keyword in React JS?

I see some syntax like below in some react-js libraries. What is that mean and how can help me in my codes?

const inputAttributes = {
  id: 'events-playground',
  placeholder: 'Where are you now?',
  onChange: ::this.onInputChanged,
  onBlur: ::this.onInputBlurred
};

Thanks.

like image 891
Amin Mousavi Avatar asked Oct 05 '15 15:10

Amin Mousavi


People also ask

What is this keyword in react JS?

It goes like this. A JavaScript class is just a syntactical sugar of a constructor function, an important concept of JavaScript, which is used to create objects. And the this keyword inside the constructor function refers to an object which consists of all the properties and methods declared using the this keyword.

Why this keyword is used in react JS?

In React when we use event handlers we basically give a reference of a function to that event handler and when that event occurs that function gets invoked, here's a catch, it's invoked at some point of time not immediately, and when its invoked, it's invoked as its own, there is now any components instance object ...

What does ${} mean in React?

the ${} is the syntax for variables (or other code to be executed) inside template literals (`).

What does 3 dots mean in React?

(three dots in JavaScript) is called the Spread Syntax or Spread Operator. This allows an iterable such as an array expression or string to be expanded or an object expression to be expanded wherever placed. This is not specific to React. It is a JavaScript operator.


1 Answers

It is new ES7 syntax for .bind,

equivalent in ES5

const inputAttributes = {
  id: 'events-playground',
  placeholder: 'Where are you now?',
  onChange: this.onInputChanged.bind(this),
  onBlur: this.onInputBlurred.bind(this)
};
like image 92
Oleksandr T. Avatar answered Sep 28 '22 16:09

Oleksandr T.