matriz forEach JavaScript de aplicações, mapa, filtrar, reduzir

matriz JavaScript de métodos para explicar

 

Os métodos método ES5.0 ES3.0 respectivamente:

  1. Alterar a matriz original: reverso, tipo, empurrar, pop, unshift, turno, emenda
  2. matriz de origem não pode ser alterado: a operação não muda a matriz original, a matriz pode ser alterado usando o extraído : forEach, filtro, Mapa, a reduzir, reduceRight, Fatia, o concat, o Join, -> Split, toString

Um, push pode receber qualquer número de parâmetros, a adicioná-los para o final da matriz por um, e retorna o comprimento da matriz é modificado.

Empurre para conseguir uma matriz: na cadeia de protótipos, tudo contribui para uma variedade de programação chamada diretamente, sem a necessidade de chamar uma função para uso.

Matriz .prototype. impulso  =  função  () {

var  len = argumentos.Length;

para ( var  i  =  0 ; i  <  len ; i  ++ ) {

esta [ este .length] =  argumentos [ i ];

}

voltar  este .length;

}

pop: remover o último uma extremidade da matriz, a redução do comprimento da matriz de valores e, em seguida, retorna o item removido

deslocamento (): Eliminar a primeira matriz original, e retorna o valor do elemento removido; matriz vazia retornos indefinido 

parâmetros adicionar ao início da matriz original e retorna o comprimento da matriz: unshift.

tipo (): entrada ordem crescente matriz - ou seja, o valor mínimo é localizado na parte da frente, o valor máximo na superfície inferior. Fornece uma interface para as pessoas a definir a sua própria função de função desejada.

Método de classificação -> fornece funções de interface

1, dois parâmetros devem

2, ver o valor de retorno 1) quando o valor é negativo, então o número de fichas na frente da frente

2) um número positivo, o número na frente deste último

3) é de 0, fixado

arr . tipo ( função  ( a, b ) {

// retorna ab; // ascendente

// retorno ba; Decrescente

voltar  a matemática. Aleatório () -  0,5 ; // ordenação aleatória

});

S plice: muito poderosa gama de métodos, há muitos usos que podem ser alcançados DELETE, INSERT e substituir. splicing (vários posição de partida, para ser suprimido, [número a ser inserido (s)])

II.

 C oncat: adicionar parâmetros para a matriz original. Este método irá criar uma cópia da matriz atual, e em seguida, adicione o parâmetro recebido até o fim desta cópia, e, finalmente, retorna uma matriz de recém-construído

T Ostring: será pregado parâmetros em uma string

S piolhos: Retorna o índice para a extremidade inicial do índice original a partir da matriz ( excluindo o sobrescrito terminando ) uma nova matriz de itens entre. fatia () método pode aceitar um ou dois parâmetros, isto é, para retornar à posição inicial e final do produto.

J OIN: a Junte-se (separador): o conjunto elemento de entre o grupo de uma cadeia , como o separador no separador, é omitido, o padrão é um separador de vírgula, que recebe apenas um parâmetro: o separador.

S Plit: Split (separador): uma corda dividida em uma matriz , em um separador como um separador, que recebe apenas um parâmetro: o separador.

Estes métodos ES3.0 é uma matriz de

O novo método ES5.0 você tem os seguintes métodos:

. 1, forEach: matriz ciclo de deslocação de operação de cada item na matriz a uma determinada função. Este método não tem valor de retorno. os parâmetros da função de tipo são o padrão parâmetros ter passado, os parâmetros são: uma matriz de travessia conteúdo; correspondente ao índice da primeira matriz, a matriz propriamente dito.

Definir uma matriz para facilitar chamadas subsequentes para os vários métodos dos Exemplos;

foi arr = [

{Name: "Liu Fei", des: 'bad cervical', sexo: 'm', idade: 23},

{Name: 'LiuYingJian', des: 'Eucaristia bom', o sexo: 'f', idade: 19},

{Name: 'Wang Shu', des: 'Não Eucaristia', sexo: 'f', idade: 20},

{Name: 'Lei Wang', des: 'homem que você não tenha visto', o sexo: 'm', idade: 21},

{Name: 'Liu Lang', des: 'muito pele', o sexo: 'm', idade: 22}

];

A func parâmetro função de transferência obrigatória (ELE cada elemento, pouco índice de índice, auto em si), a segunda passagem não pode passar este ponto não pode passar o ponto em que a função de janela é executado

var oLiArray = document.getElementsByTagName ( 'li');

arr.forEach (função (ELE, índice, auto) {

esta [índice] .innerText = ele.name;

}, OLiArray)

saída:

O resultado é uma matriz de pregar cada vez chamar esta função, para atingir uma determinada função da matriz (neste exemplo está na matriz para ser inserida em cada um da li)

Claro, podemos reescrevê-lo para obter a mesma funcionalidade: fácil programação é claro, ser usado diretamente no array cadeia de protótipos

Array.prototype.myForEach = função (FUNC) {

// você pode passar dois parâmetros, e esta função (função durante o uso apontando), para receber esta com parma2

// _ chamada arr para receber gama atual (que invocam que ponto)

var _arr = este, len = _arr.length, parma2 = argumentos [1] || janela;

para (var i = 0; i <len; i ++) {

func.apply (parma2, [_arr [i], i, _arr]);

}

}

Re-chamadas podem obter mais resultados.

Filtro: filtro", cada matriz executando uma determinada função, retorna a matriz da condição do filtro.

por exemplo:

var newArr = arr.filter (função (ELE, índice, auto) {

se (ele.sex == 'm')

return true;

});

resultados;

Dentro da função para determinar verdadeiro ou falso, se for verdade o item atual é retornado, caso contrário, filtrar o item atual.

Reescrevê-lo:

Array.prototype.myFilter = função (FUNC) {

// definir uma nova adição de receber a última matriz vazia e devolve os resultados

var _arr = isso, len = _arr.length; parma2 = argumentos [1] || janela, newArr = [];

para (var i = 0; i <len; i ++) {

func.apply (parma2, [_arr [i], i, _arr])? newArr.push (deepClone ({}, _arr [i])): '';

}

voltar newArr;

}

M o AP: refere-se ao "mapeamento" de cada item na matriz executar a função dada, cada chamada de função retorna o resultado de uma matriz.

Se X --------------- + --------- 10> Y i.e. aumentaram cada X 10 é então enviado para um conjunto diferente de mapeamentos entre

Como usar:

var newArr = arr.map (função (ELE, índice, auto) {

ele.name + = 10;

voltar ELE; ou cada retorno do original //

})

Os resultados são:

 

Reescreva:

Array.prototype.myMap = função (FUNC) {

var _arr = este, len = _arr.length, parma2 = argumentos [1] || janela, newArr = [];

para (var i = 0; i <len; i ++) {

newArr.push (deepClone ({}, func.apply (parma2, [_arr [i], i, _arr]))); // clone usando a profundidade não afecta a matriz original

}

retorno newArr; // retorna uma nova matriz aceito

}

I & lt Educe a e reduceRight: o método de reduzir () a partir do primeiro item na matriz, atravessado por uma extremidade, então da direita para a esquerda reduceRight travessia. Função passado para reduzir () e reduceRight () recebeu quatro parâmetros: o valor anterior, o valor corrente do índice, e uma matriz de entrada de objecto. Qualquer valor retornado por esta função serão passados automaticamente para a próxima como o primeiro parâmetro. Ocorre na primeira iteração do segundo conjunto, de modo que o primeiro item na matriz é o primeiro parâmetro, o segundo parâmetro é o segundo item na matriz.

Como usar:

var initialValue = {name: '22'};

var lastValue = arr.reduce (função (preValue, curValue, índice, auto) {

preValue.name + = 1;

retorno preValue

}, valor inicial);

Resultado da chamada:

Além disso, um da esquerda para a direita, o resultado não é a última chamada como o tempo acumulando inferior;

Reescrevendo pode ser alcançado:

Array.prototype.myReduce = function (func, initialValue) {// Aqui passar dois parâmetros devem, é claro, o segundo e parâmetros de terceiros como acima podem não estar disponíveis para transmissão

var _arr = isso, len = _arr.length, parma2 = argumentos [2];

para (var i = 0; i <len; i ++) {

initialValue = func.apply (parma2, [initialValue, _arr [i], i, _arr]);

}

voltar initialValue;

}

Aplicação: uma corda e separada em uma matriz, na sua totalidade, os seus atributos e os valores do número da cadeia original:

por exemplo:

var biscoito = "1 = A; 2 = b; 3 = C; 4 = d; 5 = E; 6 = F; 7 = g";

função parseCookie (str) {

var cookieArr = str.split ( ";");

foi cookObj = {};

cookieArr.reduce (função (pré, seguinte, índice, auto) {

var nextArr = next.split ( '=');

cookObj [nextArr [0]] = nextArr [1];

retornar pré;

} Chokobj)

voltar cookObj;

}

var cozinheiro = parseCookie (cookie);

console.log (cozinhar);

 

saída:

Embora o método é difícil reduzir um pouco difícil, mas ainda é um bom uso;

cada Método: Analisando a matriz não está em linha com os requisitos de cada caso ele retorna falso (o que corresponde &&)

algum método de: determinação da presença da matriz não é satisfatória, se ele devolve verdadeiro. (Equivalente a ||)

var bandeira = arr.every (função (ELE, índice, auto) {

retorno ele.age> 20;

});

var Sinalizador1 = arr.some (função (ELE, índice, auto) {

retorno ele.age> 20;

});

saída

 

Reescrevê-lo:

Array.prototype.myEvery = função (FUNC) {

// Adicionar uma determinação variável facilitar retornar true

var _arr = isso, len = _arr.length; parma2 = argumentos [1] || janela, bandeira = true;

para (var i = 0; i <len; i ++) {

if (! func.apply (parma2, [_arr [i], i, _arr])) {

bandeira = false;

}

}

bandeira retornar;

}

um método análogo

 

 

O objetivo principal é reescrever para que possamos entender melhor os princípios subjacentes, fácil de usar

Ele não precisa ser muito dependente de métodos de outras pessoas para aumentar a autonomia

 

A descrição acima é de uma variedade de métodos vulgarmente utilizados no JavaScript. Obrigado a adotar, a gravação propôs o seu próprio

Publicado 19 artigos originais · ganhou elogios 58 · vê 50000 +

Acho que você gosta

Origin blog.csdn.net/cyg_l02/article/details/82286432
Recomendado
Clasificación