web-dev-qa-db-ja.com

文字列要素の配列のJavaScriptマップメソッド

Forループを使用するのではなく、mapメソッドを実装してパリンドロームの文字列をチェックし、マップされた配列要素が元の配列要素と同じかどうかのブール値を返す方法を理解しようとしています。 mapメソッドの構文を理解できないようです。元の配列の各要素でマップを機能させるにはどうすればよいですか？値は何ですか？以下は、未定義の値のみを記録する作業コードです。

function palindromeChecker(string) {
    var myString = string.toLowerCase();
    var myArray = myString.split(" ");
    var newArray = myArray.map(function (item) {
        item.split("").reverse().join("");
        return newArray === myArray;
    });
}

console.log(palindromeChecker("What pop did dad Drink today"));

フィドルへのリンクは次のとおりです。 https://jsfiddle.net/minditorrey/3s6uqxrh/1/

関連する質問が1つあります。

Javascript配列マップメソッドコールバックパラメーター

しかし、文字列の配列で関数を実行するためにmapメソッドを使用するときのmapメソッドの構文に関する混乱には答えません。

javascriptarraysdictionary
11
Mindi Torrey

mapメソッドは、配列内の各要素に文字通り関数呼び出しを「マッピング」します。これは、配列内の各整数の値を1だけ増やす簡単な例として考えてください。

var items = [1,2,3];
items.map(function(item) { 
  return item + 1;
});

// returns [2,3,4]

あなたの場合、mapを使用して、それが回文である場合に文字列を受け入れるか拒否しようとしているので、単純な実装は次のようになります。

var items = ['mum', 'dad', 'brother'];
items.map(function(item) {
  return item.split('').reverse().join('') === item;
});

// returns [true, true, false]

mapを使用する理由が100％確信できません。配列をフィルタリングして回文ではない文字列を削除しようとする場合は、おそらくfilterを使用する必要があるからです。代わりに、同じ方法で機能しますが、falseを返すものはすべて削除します。

var items = ['mum', 'dad', 'brother'];
items.filter(function(item) {
  return item.split('').reverse().join('') === item;
});

// returns ['mum', dad']

あなたの場合、最初に文字列を分割して文字の配列を取得しています。また、その文字列を小文字にし、句読点を削除することもできます。そのため、実装は次のようになります。

var string = 'I live at home with my Mum, my Dad and my Brother!';
var items = string.toLowerCase().replace(/[^a-z0-9-\s]+/, '').split(' ');
items.filter(function(item) {
  return item.split('').reverse().join('') === item;
});

// returns ['i', 'mum', dad']

質問のコメントの1つで述べたように、チェックを実行するために別の関数を使用している場合は、関数の値をreturnにする必要があります。したがって、関数は次のようになります。

function checkPalindromes(string) {
  var items = string.toLowerCase().replace(/[^a-z0-9-\s]+/, '').split(' ');
  items.filter(function(item) {
    return item.split('').reverse().join('') === item;
  });

  return items;
}

そして、あなたはそれを使ってそれを呼び出すでしょう：

checkPalindromes('I live at home with my Mum, my Dad and my Brother!'); // ['i', 'mum', 'dad']
10
toomanyredirects

newArrayには、myArrayのすべてのアイテムの逆バージョンを含める必要があります。その後、入力文字列の逆バージョンを取得するために、newArrayを逆にしてスペースで結合する必要があります。

コードは次のとおりです。

function palindromeChecker(string) {
  var myString = string.toLowerCase();
  var myArray = myString.split(" ");
  var newArray = myArray.map(function (item) {
        return item.split("").reverse().join("");
    });
  console.log(newArray);
  return newArray.reverse().join(" ") === string;
}

console.log(palindromeChecker("dad did what"));
1
Cem Ekici

Javascriptのmap関数（およびほとんどすべての言語）は、リスト上の各アイテムの関数を呼び出して、リスト自体を変更できる小さな関数です。引数として渡す（匿名の）関数は、引数自体を受け入れます。引数は、呼び出されるたびに、作業中のリストの項目で埋められます。

したがって、リスト_[1,2,3,4]_の場合、関数function(item) { return item + 1 }は、結果の_[2,3,4,5]_のリストを提供します。 $.map()に渡した関数は、リストの各要素に対して実行されるため、リストが変更されます。

したがって、コードの場合：$.map()に引数として渡す関数では、古い配列と新しい配列が等しい（falseである）かどうかを返します。したがって、ブール値を返すため、最終的にリストはブール値のリストになります。私がやりたいと思うのは、$.map()に渡す関数から_newArray == myArray_を抽出し、$.map()呼び出しの後に配置することです。次に、$.map()に渡す関数内で、分割しているアイテムなどを返します。したがって、newArrayはmyArrayのような文字列の配列になります。

0
Glubus

ご意見ありがとうございます。これが私が結んだコードです。元の投稿でスコープの問題を修正しました。私の主な問題は、mapメソッドの構文を理解することでした。特に、コールバック関数の値を決定する方法を他のオンラインリソースから理解できませんでした。したがって、上記の多くの助けを借りて、mapメソッドをpalindromeChecker内に配置し、map関数内の配列に対してすべての作業を実行しました。

var palindromeChecker = function(string) {
var newString = string.toLowerCase().split(' ');
newString.map(function(item) {
  console.log(item.split('').reverse().join('') === item);
  });
}; 

palindromeChecker("What pop did dad drink today");

//Returns false, true, true, true, false, false
0
Mindi Torrey

次のようなものを試してください：

let str = 'hello';
let tab = [...str];

tab.map((x)=> {
    console.log("|"+x+"|");
    return x;
})
0
marqn

スコープの問題（定義されている関数の外で「newArray」と「myArray」を参照しているため、「未定義」になるなど）のコードでのいくつかの小さなミスは別です。

あなたが抱えていた主な問題は、map関数内のENTIRE配列に対処し、コンセプト全体が単一の要素に物事を分解していることです（そして、関数はすべてを配列に収集します）。

私の例では「フィルター」関数を使用しました。これは同様の方法で機能し、希望どおりに機能すると感じましたが、「フィルター」を「マップ」に変更して何が起こるかを確認できるからです。

乾杯:)

HTML：

<body>

<p id="bla">
BLA
</p>

<p id="bla2">
BLA2
</p>

</body>

Javascript：

function palindromeChecker(string) {
  var myString = string.toLowerCase();
  var myArray = myString.split(" ");
  var newArray = myArray.filter(function (item) {
    var reversedItem = item.split('').reverse().join('');
    return  item == reversedItem;
});

document.getElementById("bla").innerHTML = myArray;
document.getElementById("bla2").innerHTML = newArray;

}

palindromeChecker("What pop did dad Drink today");
0
DougieHauser

Map は、ES5で使用可能な高階関数です。 newArrayにはブール値の配列が含まれると思います。

本質的に、mapは配列内のすべての値を反復処理し、関数を適用します。戻り値は配列の新しい値になります。また、マップを使用して、必要な情報を別の場所に保存し、もちろん結果を無視することもできます。

var arr = [1,2,3,4];
var newArray = arr.map(function(i) {
  return i * 2;
});
//newArray = [2,4,6,8]
0
froginvasion