Classe sintaxe básica


Em programação orientada a objetos, uma classe é extensível-programa de código-modelo para a criação de objetos, fornecendo valores iniciais para o estado (variáveis de membro) e implementações de comportamento (funções ou métodos).

na prática, muitas vezes precisamos criar muitos objetos do mesmo tipo, como usuários, ou bens ou o que quer que seja.como já sabemos pelo construtor do capítulo, o operador “novo”, new function pode ajudar com isso.,

mas no JavaScript moderno, há uma construção mais avançada de “classe”, que introduz grandes novas características que são úteis para a programação orientada a objetos.

“classe” sintaxe

A sintaxe básica é:

class MyClass { // class methods constructor() { ... } method1() { ... } method2() { ... } method3() { ... } ...}

em Seguida, use new MyClass() para criar um novo objeto com todos os métodos listados.

O método é chamado automaticamente pornew, então podemos inicializar o objeto lá.,

Por exemplo:

class User { constructor(name) { this.name = name; } sayHi() { alert(this.name); }}// Usage:let user = new User("John");user.sayHi();

Quando new User("John") é chamado de:

  1. Um novo objeto é criado.
  2. o constructorexecuta com o argumento dado e atribui-o athis.name.

…então podemos chamar métodos de objetos, tais como user.sayHi().

No vírgula between class methods

A common pitfall for novice developers is to put a vírgula between class methods, which would result in a syntax error.,

a notação aqui não deve ser confundida com literais de objetos. Dentro da classe, não são necessárias vírgulas.

o que é uma classe?

So, what exactly is a class? Não é uma entidade totalmente nova, como se pode pensar.vamos revelar qualquer magia e ver o que é realmente uma classe. Isso ajudará a entender muitos aspectos complexos.

em JavaScript, uma classe é um tipo de função.,

Aqui, dê uma olhada:

class User { constructor(name) { this.name = name; } sayHi() { alert(this.name); }}// proof: User is a functionalert(typeof User); // function

o Que class User {...} construir realmente é:

  1. Cria uma função chamada User, que se torna o resultado da declaração da classe. O código da função é retirado do método constructor (assumido vazio se não escrevermos esse método).
  2. armazena métodos de classe, tais como sayHi, em User.prototype.,

Afternew User object is created, when we call its method, it’s taken from the prototype, just as described in the chapter F. prototype. Então o objeto tem acesso a métodos de classe.,de class User declaração como:

este é o código que a introspecção é:

Não é apenas um açúcar sintático

às Vezes as pessoas dizem que class é um “açúcar sintático” (sintaxe, que é projetada para tornar as coisas mais fáceis de ler, mas não introduz nada de novo), porque nós realmente poderíamos declarar o mesmo sem class palavra-chave em tudo:

O resultado desta definição é sobre o mesmo., Então, existem de fato razões pelas quais class pode ser considerado um açúcar sintático para definir um construtor juntamente com seus métodos protótipos.ainda assim, existem diferenças importantes.

  1. primeiramente, uma função criada por classé rotulada por uma propriedade interna especial]:"classConstructor". Então não é inteiramente o mesmo que criá-lo manualmente.

    os controlos linguísticos dessa propriedade em vários locais., Por exemplo, ao contrário de uma função normal, ele deve ser chamado com new:

    class User { constructor() {}}alert(typeof User); // functionUser(); // Error: Class constructor User cannot be invoked without 'new'

    Também, uma representação de seqüência de caracteres de um construtor de classe na maioria dos mecanismos de JavaScript inicia-se com a “aula”.

    class User { constructor() {}}alert(User); // class User { ... }

    Existem outras diferenças, nós vamos vê-los em breve.os métodos de classe

  2. são não enumeráveis.,A class definition sets enumerable flag tofalse for all methods in the"prototype".

    isso é bom, porque se nós for..in sobre um objeto, normalmente não queremos seus métodos de classe.

  3. Classes sempre use strict.Todo o código dentro da construção da classe está automaticamente em modo estrito.

além disso,class a sintaxe traz muitas outras características que iremos explorar mais tarde.,

expressão de classe

assim como funções, As classes podem ser definidas dentro de outra expressão, passadas, devolvidas, atribuídas, etc.

Aqui está um exemplo de uma classe de expressão:

let User = class { sayHi() { alert("Hello"); }};

Semelhante a Função de Chamada de Expressões, classe expressões podem ter um nome.,

Se uma classe de expressão tem um nome, é visível dentro da sala de aula somente:

podemos até fazer classes dinamicamente “on-demand”, como este:

Getters/setters

assim como literal de objetos, classes podem incluir getters/setters, propriedades calculadas etc.

este é um exemplo de user.name implementado usando get/set:

Tecnicamente, tal declaração de classe funciona através da criação de getters e setters, no User.prototype.,

Calculada nomes

Aqui está um exemplo com um computado o nome do método a utilizar parênteses :

class User { () { alert("Hello"); }}new User().sayHi();

Estas características são fáceis de lembrar, como eles se assemelham que literal objetos.os campos de classe

navegadores antigos podem necessitar de um polifill

os campos de classe são uma adição recente à linguagem.

anteriormente, as nossas classes só tinham métodos.

“campos de classe” é uma sintaxe que permite adicionar quaisquer propriedades.,

Por exemplo, vamos adicionar name propriedade class User:

class User { name = "John"; sayHi() { alert(`Hello, ${this.name}!`); }}new User().sayHi(); // Hello, John!

Então, vamos apenas escrever ” = ” na declaração, e é isso.,

A diferença importante de campos de classe é que elas são definidas em objetos individuais, e não User.prototype:

class User { name = "John";}let user = new User();alert(user.name); // Johnalert(User.prototype.name); // undefined

podemos também atribuir valores de uso mais complexo de expressões e chamadas de função:

class User { name = prompt("Name, please?", "John");}let user = new User();alert(user.name); // John

Fazendo métodos de limite com a classe de campos

Como demonstrado no capítulo Função de ligação funções em JavaScript tem uma dinâmica this., Depende do contexto da chamada.

assim, se um método de objeto é passado e chamado em outro contexto, this não será mais uma referência ao seu objeto.

Por exemplo, este código irá mostrar undefined:

o problema é chamado “perder “.

Existem duas abordagens para fixá-lo, como discutido na função de ligação do capítulo:

  1. passa uma função de invólucro, comosetTimeout(() => button.click(), 1000).
  2. vincula o método ao objeto, por exemplo, no construtor.,

os campos de Classe fornecer outro, muito elegante sintaxe:

O campo classe click = () => {...} é criado por objeto base, há uma função separada para cada Button objeto, com this dentro dela fazendo referência a esse objeto. Podemos passar button.click em qualquer lugar, e o valor de this será sempre correto.

isso é especialmente útil no ambiente de navegador, para ouvintes de eventos.,

Resumo

A classe básica de sintaxe se parece com isso:

MyClass é, tecnicamente, uma função (o que nós fornecemos constructor), enquanto que os métodos getters e setters são escritas MyClass.prototype.

nos próximos capítulos vamos aprender mais sobre classes, incluindo herança e outras características.

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *