Почему вы должны использовать ключевое слово «это» вместо имени класса? - PullRequest
Новая
       17

Почему вы должны использовать ключевое слово «это» вместо имени класса?

0 голосов
/ 28 мая 2018

это код из учебного кодаact.js, а ключевое слово "this" представляет класс приложения.Поэтому мой вопрос: почему я не могу просто написать имя класса? 

import React, { Component } from 'react';
import './App.css';
import Person from './Person/Person';

class App extends Component {

state = {
 persons: [
  { name: 'Max', age: 28 },
  { name: 'Manu', age: 29 },
  { name: 'Stephanie', age: 26 }
 ]
}

render() {
 return (
  <div className="App">
    <h1>Hi, I'm a React App</h1>
    <p>This is reallyyyyyyyy working!</p>
    <button> switch name</button>
    <Person name={App.state.persons[0].name} age={this.state.persons[0].age} />
    <Person name={this.state.persons[1].name} age={this.state.persons[1].age}>My Hobbies: Racing</Person>
    <Person name={this.state.persons[2].name} age={this.state.persons[2].age} />
  </div>
 );
// return React.createElement('div', {className: 'App'}, 
React.createElement('h1', null, 'Hi, I\'m a React App!!!'));
}
}

export default App;

Ответы [ 2 ]

0 голосов
/ 28 мая 2018

Потому что

Это ключевое слово относится к текущему экземпляру класса.Его можно использовать для доступа к членам внутри конструкторов, методов экземпляров и методов доступа к экземплярам.

Это правило следует любому объектно-ориентированному языку программирования.Однако, если вы заставляете ваш класс использовать экземпляр с его именем, тогда он должен быть статическим (не сам класс, а свойства и методы).

Для вашей цели мы можем создать App класс как модуль 

class App {
  hello() { return 'Hello World'; }
}

export let AppInstance = new App ();

Использование 

import { AppInstance } from './App';
AppInstance.hello();
0 голосов
/ 28 мая 2018

Потому что в JavaScript, когда вы указываете имя класса (в частности, внутри класса), вы получаете ссылку на класс, а не на текущий экземпляр класса.Свойства и методы экземпляра недоступны через его класс.Между тем this представляет текущий экземпляр. 

class App {
    test() {
        console.log(App); // "class App ..."
        console.log(this); // "[object Object]"
        console.log(App.foo()); // "1"
        console.log(this.foo()); // "2"
        console.log(this.constructor.foo()); // "1"; this.constructor is a reference to the current object class
    }

    static foo() {
        return 1;
    }

    foo() {
        return 2;
    }
}
...