Prefácio
Através dos métodos Call (), Aplicar () e Bind (), podemos facilmente emprestar métodos de outros objetos sem herdá -lo a partir desses objetos.
Métodos de empréstimos em JavaScript
No JavaScript, funções ou métodos de outros objetos às vezes podem ser reutilizados, não necessariamente definidos no próprio objeto ou no protótipo. Através dos métodos Call (), Aplicar () e Bind (), podemos facilmente emprestar métodos de outros objetos sem herdar -os. Este é um método comum usado pelos desenvolvedores profissionais de JavaScript.
Método do protótipo
No JavaScript, exceto por tipos de dados primitivos imutáveis, como string, número e booleano, quase todos os dados são objetos. A matriz é um objeto adequado para atravessar e converter sequências ordenadas. Seu protótipo possui métodos fáceis de usar, como fatia, unir, empurrar e pop.
Um exemplo comum é que, quando objetos e matrizes são estruturas de dados do tipo de lista, os objetos podem "emprestar" métodos de matrizes. O método mais comum a ser emprestado é Array.prototype.slice .
function myfunc () {// Erro, argumentos é uma matriz como objeto, não um argumentos de matriz real.sort (); // "Pegue emprestado" o método da matriz fatia de seu protótipo, que leva uma matriz como objeto (chave: value) // e retorna uma matriz real var args = array.prototype.slice.call (argumentos); // args agora é uma matriz real, portanto, pode usar o método stor () do Array args.sort (); } myfunc ('bananas', 'cerejas', 'maçãs');Os métodos de empréstimos funcionam porque os métodos de chamada e aplicação permitem a chamada de funções em diferentes contextos, o que também é uma boa maneira de reutilizar as funções existentes sem ter que herdar outros objetos. De fato, as matrizes definem muitos métodos comuns em protótipos, como junção e filtro:
// pegue uma string "abc" e produz "a | b | Carray.prototype.join.call ('abc', '|'); // pegue uma string e remove todos os não vwelsarray.protype.filter.call ('abcdefghijk', function (val) {return ['a' a ',', ',', 'e', 'e', 'e', 'e', 'e', 'e', 'e', 'e', 'e', 'e', 'e', 'e', 'e', ',', ',', ',', ',', ',', ',', ',' ''); -1;}). Junção (''); Pode -se observar que não apenas objetos podem emprestar métodos de matriz, mas também strings. Mas como os métodos genéricos são definidos no protótipo, você deve usar String.prototype ou Array.prototype sempre que deseja emprestar um método. Escrever assim é muito detalhado e logo se tornará irritante. Uma maneira mais eficiente é usar literais para alcançar o mesmo objetivo.
Usando métodos de empréstimos literais
Os literais são uma estrutura de sintaxe que segue as regras de JavaScript, o MDN explica assim:
No JavaScript, o uso de literais pode representar valores. São valores fixos, variáveis, ou dados literalmente no script.
Os literais podem ser abreviados como protótipo:
[] .slice.call (argumentos); []. junção.call ('abc', '|'); ''.Isso não parece tão detalhado, mas ainda é um pouco feio ter que operar diretamente em [] e "" para emprestar o método. Você pode usar variáveis para salvar referências a literais e métodos, o que facilita a redação:
var slice = [] .slice; slice.call (argumentos); var junção = [] .Join; junção.Call ('ABC', '|'); var touppercase = '' .touppercase; touppercase.call (['minúsculo', 'palavras', 'em', 'a', 'sentença']). split (',');Com referências aos métodos de empréstimos, podemos chamá -lo facilmente com Call (), que também pode reutilizar o código. Aderindo ao princípio de reduzir a redundância, vamos ver se podemos emprestar métodos sem ter que escrever Calling () ou Aplicar () toda vez que chamamos:
var slice = function.prototype.call.bind (array.prototype.slice); slice (argumentos); var junção = function.prototype.call.bind (array.prototype.join); junção ('abc', '|'); var touppercase = function.prototype.call.bind (string.prototype.TOUPCASE); touppercase (['minúsculo', 'palavras', 'em', 'a', 'sentença']). split (','); Como você pode ver, agora você pode usar Function.prototype.call.bind para ligar estaticamente o método "emprestado" de diferentes protótipos. Mas como a frase var slice = Function.prototype.call.bind(Array.prototype.slice) realmente funciona?
Compreenda function.prototype.call.bind
Function.prototype.call.bind pode parecer um pouco complicado à primeira vista, mas pode ser muito útil entender como funciona.
Function.prototype.call é uma referência que "chamada" de uma função e definirá seu valor "esse" para uso em uma função.
Observe que "Bind" retorna uma nova função com seu valor "Este". Portanto, o "isso" da nova função retornado por .bind(Array.prototype.slice) é sempre a função Array.prototype.slice.
Em resumo, a nova função chama a função "Call", e é "isso" é a função "Slice". Chamar Slice () apontará para o método previamente qualificado.
Métodos para personalizar objetos
A herança é ótima, mas os desenvolvedores geralmente a usam quando desejam reutilizar alguns recursos comuns entre objetos ou módulos. Não há necessidade de usar herança apenas para reutilização de código, porque métodos simples de empréstimos podem ser complicados na maioria dos casos.
Discutimos apenas o empréstimo de métodos nativos antes, mas emprestar qualquer método está ok. Por exemplo, o código a seguir pode calcular a pontuação do jogador de pontos:
var scorecalCulator = {getsum: function (resultados) {var score = 0; for (var i = 0, len = resulta.length; i <len; i ++) {score = score+resultados [i]; } pontuação de retorno; }, getScore: function () {return scorecalCulator.getSum (this.results) / this.Handicap; }}; var player1 = {Resultados: [69, 50, 76], handicap: 8}; var player2 = {Resultados: [23, 4, 58], Handicap: 5}; var score = function.prototype.call.bind (scorecalCulator.getScore); // Pontuação: 24.375console.log ('Score:' + Score (Player1)); // Pontuação: 17console.log ('Score:' + Score (Player2));Embora o exemplo acima seja muito franco, pode-se ver que, assim como os métodos nativos, os métodos definidos pelo usuário podem ser facilmente emprestados.
Resumir
Ligue, vincular e aplicar pode alterar a maneira como as funções são chamadas e são frequentemente usadas ao emprestar funções. A maioria dos desenvolvedores conhece os métodos nativos emprestados, mas raramente empresta métodos personalizados.
Nos últimos anos, a programação funcional do JavaScript se desenvolveu bem. Como usar function.prototype.call.bind para emprestar o método mais conveniente? Estima -se que esses tópicos se tornem cada vez mais comuns.
O exposto acima é o resumo dos métodos de empréstimos em JavaScript. Espero que seja útil que todos entendam os métodos de empréstimos em JavaScript.