Continue com o artigo anterior "Como escrever código JS de alta qualidade" desta vez, resolverei os pontos de conhecimento das funções JavaScript.
2. Use funções
As funções fornecem aos programadores as principais funções abstratas e mecanismos de implementação. As funções podem implementar independentemente vários recursos diferentes em outros idiomas, como procedimentos, métodos, construtores e até classes ou módulos.
2.1 Entenda as diferenças entre chamadas de função, chamadas de método e chamadas de construtor
Para programação orientada a objetos, o construtor de funções, métodos e classes são três conceitos diferentes.
Modo de uso:
1. Chamada de função
A cópia do código é a seguinte:
função hello (nome de usuário) {
retornar "Hello" + Nome de usuário;
}
2. Chamada de método
A cópia do código é a seguinte:
var obj = {
Olá: function () {
Retorne "Hello", This This.username;
},
Nome de usuário: "Floralam"
};
Ohj.hello (); // "Olá, Floralam"
Essa variável está vinculada ao objeto porque o método Hello é definido no objeto OBJ. Também podemos atribuir uma cópia da mesma referência de função em outro objeto e obter a mesma resposta.
A cópia do código é a seguinte:
var obj2 = {
Olá: obj.hello (),
Nome de usuário: "Floralam"
};
3. Use o construtor
A cópia do código é a seguinte:
Função Usuário (Nome, PasswordHash) {
this.name = nome;
this.passwordhash = senhahash;
}
Chamar o usuário usando o novo operador é considerado um construtor.
A cópia do código é a seguinte:
var u = novo usuário ("floralam", "123");
Diferentemente das chamadas de função e chamadas de método, a chamada do construtor toma um objeto completamente novo como o valor dessa variável e retorna implicitamente esse novo objeto como resultado da chamada. A principal responsabilidade do construtor é inicializar o novo objeto.
2.2 Proficiente em funções avançadas
As funções de ordem superior nada mais são do que funções que recebem funções como parâmetros ou valores de retorno e usam funções como parâmetros (geralmente chamados funções de retorno de chamada, porque funções de ordem superior "a chamam posteriormente") é um idioma particularmente poderoso e expressivo e também é amplamente utilizado em programas JS.
Considere o método padrão de matrizes. Para trabalhar para todas as matrizes, o método de classificação exige que o chamador decida como comparar dois elementos na matriz.
A cópia do código é a seguinte:
função compareNumber (x, y) {
if (x <y) {
retornar -1;
}
if (x> y) {
retornar 1;
}
retornar 0;
}
[3,1,4,1,5,9] .Sort (comparaNumbers); // [1,1,3,4,5,9]
A cópia do código é a seguinte:
[3,1,4,1,5,9] .Sort (função (x, y) {
if (x <y) {
retornar -1;
}
if (x> y) {
retornar 1;
}
retornar 0;
}); // [1,1,3,4,5,9]
O exemplo acima usa uma função anônima para simplificar ainda mais.
Aprender a usar funções de ordem superior geralmente pode simplificar o código e eliminar o código de caldeira tedioso. Para uma simples conversão de matrizes de string, podemos usar um loop para implementá -lo assim:
A cópia do código é a seguinte:
var nomes = ["Fred", "Wilma", "Pebbles"];
var superior = [];
for (var i = 0, n = names.length; i <n; i ++) {
superior [i] = nomes [i] .toupPercase ();
}
superior; // ["Fred", "Wilma", "Pebbles"];
Usando o método de matrizes do mapa conveniente, você pode eliminar loops e converter elementos um por um usando apenas uma função local.
A cópia do código é a seguinte:
var nomes = ["Fred", "Wilma", "Pebbles"];
var superior = nomes.map (função (nome) {
retornar name.TOUPPERCASE ();
});
superior; // ["Fred", "Wilma", "Pebbles"];
Além disso, por exemplo, queremos criar vários métodos para criar strings diferentes com a lógica de implementação comum, e cada loop cria uma string conectando os resultados do cálculo de cada peça independente.
A cópia do código é a seguinte:
função bulidString (n, retorno de chamada) {
var resultado = "";
for (var i = 0; i <n; i ++) {
resultado += retorno de chamada (i);
}
resultado de retorno;
}
var alphabet = BulidString (26, função (i) {
return string.fromCharcode (AIndex + i);
});
alfabet; // "abcdefghijklmnopqrxtuvwxyz";
var digits = BuildString (10, função (i) {return i;})
dígitos; // "0123456789"
var aleatória = BuildString (9, function () {
Random += String.FromCharCode (Math.floor (Math.random ()*26) +Aindex
});
aleatório; // "yefjmcef" (aleatório)
Isso dará aos leitores uma compreensão mais clara do que o código pode fazer sem detalhes aprofundados da implementação.
Observação
JavaScript retorna a fórmula para números aleatórios (entre MNs) da faixa especificada: Math.Random ()*(nm)+M
Ao mesmo tempo, preste atenção aos requisitos da questão e se é necessário retornar um número inteiro positivo.
2.3 Modo de chamada
Chamar uma função Pausará a execução da função atual e dos direitos de controle e parâmetros de controle para a nova função. Além dos parâmetros formais definidos no momento da declaração, cada função recebe dois novos parâmetros adicionais: isso e argumentos.
Este é um parâmetro muito importante e seu valor é determinado pelo padrão de chamada.
Aqui estão 4 padrões de chamada muito importantes em JavaScript:
um. Padrão de invocação de método
b. O padrão de invocação de funções
c. O padrão de invocação do construtor
d. Aplicar padrão de chamada O padrão de invocação Aplicar
Existem diferenças na forma como esses padrões inicializam os principais parâmetros
1. Método de invocação do método
Quando uma função é um método de objeto, chamamos de método. Quando um método é chamado, isso está ligado ao objeto chamado.
A cópia do código é a seguinte:
var myobj = {
Val: 0,
incremento: função (inc) {
this.val+= typeof inc === "número"? Inc: 1;
},
get_val: function () {return this.val;}
}
myObj.increment (); // 1
myobj ["incremento"] (2); // 3
resumo:
1. O método em que o contexto do objeto ao qual pertencem pode ser obtido por isso é chamado de método público
2. Ao usar uma função com a. ou expressão subscrita, é o modo de chamada do método e esse objeto está ligado ao objeto anterior.
3. Uma função pode usar isso para acessar um objeto, para que possa recuperar o valor do objeto ou alterar o valor do objeto. Vincule isso ao objeto quando chamado.
2. O padrão de invocação da função
Quando uma função não é a propriedade de um objeto, ela é chamada de função. Quando uma função é chamada de padrão de chamada de função, isso está ligado ao objeto global. Este é um erro de design de JavaScript e continua.
A cópia do código é a seguinte:
função add (x, y) {
retornar x+y;
}
myobj.double = function () {
var que = this;
var helper = function () {
that.val = add (that.value, that.value);
// A maneira errada de escrever pode ser assim, por que está errado? Porque quando a função é chamada de função interna, isso está vinculado ao objeto errado e o objeto global não possui uma propriedade Val, portanto o valor incorreto é retornado.
//this.val = this.val+this.val;
}
ajudante();
}
myobj.double (); // 6
3. O padrão de invocação do construtor
JavaScript é uma linguagem baseada na herança do protótipo, o que significa que os objetos podem herdar diretamente atributos de outros objetos, e o idioma não tem classe.
Se você chamar uma função com a nova, obterá um novo objeto que oculta o membro do protótipo conectado à função, e isso também estará vinculado ao novo objeto.
O novo prefixo também altera o comportamento da declaração de retorno. Este também não é o método de programação recomendado.
A cópia do código é a seguinte:
var foo = function (status) {
this.status = status;
}
Foo.prototype.get_status = function () {
devolver este.status;
}
// Construa uma instância foo
var myfoo = new Foo ("bar");
myfoo.get_status (); // "bar"
4. Aplique chame o padrão o padrão de invocação de aplicação
Como o JavaScript é uma linguagem funcional orientada a objetos, as funções podem ter métodos.
O método Aplicar possui dois parâmetros. O primeiro é vincular o valor a isso, e o segundo é a matriz de parâmetros. Ou seja, o método Apply nos permite criar uma matriz e usá -lo para chamar a função, o que nos permite selecionar o valor disso e também nos permite selecionar o valor da matriz.
A cópia do código é a seguinte:
var Array = [3,4];
var sum = add.apply (nulo, matriz); // 7
var statusobj = {status: "abcdefg"};
Foo.prototype.pro_get_status = function (prefixo) {
retornar prefixo +"-" +this.status;
}
var status = foo.prototype.get_status.apply (statusobj); // "abcdefg"
var pro_status = foo.prototype.get_status.apply (statusobj, ["prefixo"]); // "prefix -abcdefg"
Normalmente, o receptor de uma função ou método (nível ligado ao valor dessa palavra -chave especial) é determinado pela sintaxe do chamador. Em particular, a sintaxe da chamada do método liga o método a essa variável pelo objeto de pesquisa. No entanto, às vezes é necessário chamar funções usando um receptor personalizado. No momento, você precisa usar o método de chamada ou vincular para personalizar o receptor para chamar o método
2.4 Extrair métodos com definição de destinatários usando o método de ligação
Como o método não é diferente dos atributos cujos valores são funções, também é fácil extrair o método do objeto e extrair a função como uma função de retorno de chamada e passá-lo diretamente para a função de ordem superior.
Mas também é fácil esquecer de vincular a função extraída ao objeto extraído.
A cópia do código é a seguinte:
var buffer = {
entradas: [],
Adicionar: funções {
this.entries.push (s);
}
}
Var Source = ["867", "-", "5309"];
fonte.ForEach (Butter.add); // Erro: entradas é indefinido
Neste momento, o destinatário da manteiga. Add não é o objeto de manteiga. O receptor da função depende de como ela é chamada, e o método foreach é chamado no escopo global; portanto, a implementação do método foreach usa o objeto global como o receptor padrão. Como não há atributo de entradas no objeto global, esse código lança um erro.
O método foreach permite que o chamador forneça um parâmetro opcional como o receptor da função de retorno de chamada.
A cópia do código é a seguinte:
Var Source = ["867", "-", "5309"];
fonte.foreach (manteiga.add, manteiga);
Mas nem todas as funções de ordem superior são cuidadosas e atenciosas para fornecer aos usuários o destinatário das funções de retorno de chamada.
Existem duas soluções:
1) Crie um método de objeto de buffer explícito para chamar a função de encapsulamento. Independentemente de como a função de encapsulamento é chamada, ela sempre garante que seus parâmetros sejam empurrados para a matriz de destino.
A cópia do código é a seguinte:
Var Source = ["867", "-", "5309"];
fonte.ForEach (função (s) {
manteiga.Add (s);
});
2) O método de ligação do objeto de função requer um objeto receptor e gera uma função de encapsulamento que chama a função original com o método chamado pelo objeto receptor.
A cópia do código é a seguinte:
Var Source = ["867", "-", "5309"];
fonte.foreach (butter.add.bind (buffer));
Observação
buffer.add.bind (buffer) cria uma nova função em vez de modificar a função buffer.add:
buffer.add === buffer.add.bind (buffer); //falso
O exposto acima é tudo sobre este artigo, espero que gostem.