Palavra-chave da classe em Javascript

Eu sei que este é um post antigo, mas a partir de hoje i. e. Com o advento de ECMAScript 6 podemos declarar classes javascript.

A sintaxe é a seguinte:

class Person{
  constructor(name){
    this.name = name;
  }
  printName(){
    console.log('Name is '+this.name);
  }
}
var john = new Person('John Doe');
john.printName(); // This prints 'Name is John Doe'

Um guia completo para isto pode ser encontrado em este post

Você ainda pode construir aulas em JS, é claro, usando protótipo!

var foo = function() {
  this.hurrah = "yay!";
  return this;
}

foo.prototype.doit() {
  alert(this.hurrah);
}

Se você tem um fundo Java ou C#, Aqui está como definir uma classe em JavaScript

var MyClass = function (f, l){//constructor 
    //private members
    var firstName = f,
        lastName = l,
        fullName = function () { //fullName is a private function
            return firstName + " " + lastName;
        };
    return {
        //public members
        getFullName: fullName 
    };
}

var output = document.getElementById('Output'); //<div id="Output"></div>
var myName = new MyClass("First", "Last");
output.innerHTML = myName.getFullName();

Só para adicionar a forma ECMA5 de fazer Classe.

Note que não tem uma função de construtor desta forma (mas pode activar uma função init se quiser)

        var Class = {
          el: null,
          socket: null,

          init: function (params) {

            if (!(this.el instanceof HTMLElement)) {
              throw new Error('Chat room has no DOM element to attach on.');
            }

            return this.doStuff();

          },
          doStuff: function (params) {
            return this;
          }
        };

    var instanceofClass = Object.create(Class, {
      el: {
        value: document.body.querySelector('.what ever')
      },
      someMoreData: {
        value: [0,5,7,3]
      }
    }).init();

*edit moved description out of code block

Resumo

Em ES6 foi introduzida a palavra-chave class. A palavra-chave class não é mais do que açúcar sintático em cima do padrão de herança prototípica já existente. Classes em javascript é basicamente uma outra maneira de escrever funções de construtor que pode ser usado para criar um novo objeto usando a palavra-chave new.

Exemplo

class Person {

  constructor(name) {
    this.name = name;
  }
  talk() { console.log('hi'); }
}

const me = new Person('Willem');

console.log(typeof Person) 
// logs function, Person class is just another constructor function under the hood

console.log(me.__proto__ === Person.prototype) 
// logs true, classes just use the same prototypal inheritance pattern which is used by constructor functions. 
// An object created with the new keyword gets a __proto__ property on it which is a reference to the prototype property on a constructor function.

Na amostra acima pode observar-se no primeiro registo que: classes criar a partir da palavra-chave class realmente são funções sob o capô.

console.log(typeof Person) // logs 'function'

es6 classes usam o mesmo padrão de herança prototípica que é usado por funções construtoras. Aqui está outro exemplo para demonstrar este comportamento:

class Dog {

  constructor (name) {
      this.name = name;
  }
  
  bark () { console.log('bark') };

}

let doggie = new Dog('fluffy');

doggie.bark(); // logs bark


Dog.prototype.bark = () => console.log('woof');  
// changing the prototype of Dog, doggie refers to this with its __proto__ property. 
//Therefore doggie bark method has also changed.


doggie.bark(); // logs woof

O takeaway no exemplo acima é que o método da casca de qualquer instância do cão pode ser alterado no tempo de execução. Isto é porque o método do bark de qualquer objeto criado com a classe do cão é estou a referir-me a esta função.