異なるタイプの文字列の配列へのJs配列

Question

フォームからjsonを送信できるようにするためのフォームを作成しようとしています。

私の入力の一つは、私は、ユーザーがフォームから単一のフィールドに配列を渡すと問題を抱えているフォーム["1","2","3"]または["foo","bar"] の配列でなければなりません。

私は、ユーザーが入力（HTML）[1,2,3]のことができるように、それは[「foo」という、「バー」]に変換する["1","2","3"]または[foo,bar]に変換されていてもらいたいです。

json.Stringifyは明らかにそのような場合には機能しません。

私はこれをやっているのが難しいです。私は、入力フィールドが配列か文字列か数字かを事前に知っていません。

私は現在自分のコントローラのオブジェクトに自分のフォームのコンテンツを格納していますが、明らかに[1,2,3]を入力すると "[1,2,3]"が得られ、["1","2","3"]のデータが渡されると私は得る[\"1\",\"2\",\"3\"]

自動的にそれを行うためのツール/機能はありますか？

注：- 1フィールドの入力は配列になる必要があります。配列の型やアイテムの数は事前にわかりません。 - 私は角度を使用していますが、それは私が信じるjsの問題の多くです。ユーザーは、必要に応じて引用符を入力することができ

function cast(s) { 
 
    if (s.match(/^\s*\[.*\]\s*$/)) { // array notation 
 
     return s.trim().replace(/^\[|\]$/g, '').split(',').map(cast); 
 
    } 
 
    // remove wrapping quotes if present 
 
    return s.trim().replace(/^'(.*)'$|^"(.*)"$/g, '$1$2'); 
 
} 
 
// I/O for demo 
 
document.querySelector('input').addEventListener('input', function() { 
 
    var s = cast(this.value); 
 
    document.querySelector('span').textContent = JSON.stringify(s); 
 
});

Your input: <input><br> 
 
Output JSON: <span></span>

注：

Answer 1

あなたはこのcast機能を使用することができます。彼らがそうするかどうか、結果は同じになります。これは特異値に対しても同じように機能します。引用符が入力のまわりで折り返されると、引用符がない場合と同じ文字列が与えられます。

Answer 2

あなたはmap機能を使用できます。

var arr = [1,2,3]; 
arr = arr.map(function(el){return el.toString()}); 
//The output array will be ["1","2","3"] 

とのため

[FOO、バー]私はそれが変数だとあなたはそれの名前の代わりに、値の取得されますので、あなたはそれを変換することができないと思います。

私はあなたを助けて欲しいです。

Answer 3

ユーザー入力[1,2,3]の代わりに、ユーザーに1,2,3またはfoo,barを入力するように通知します。これを解決

let arr = []; 
 
for (let input of document.querySelectorAll("form input")) { 
 
    arr.push(input.value.split(",")); 
 
} 
 
console.log(
 
    JSON.stringify(arr[0]) 
 
    , JSON.stringify(arr[1]) 
 
)

<form> 
 
    <label>input number,number,number:</label> 
 
    <input placeholder="input number,number,number" value="1,2,3"/> 
 
    <br> 
 
    <label>input word,word,word:</label> 
 
    <input placeholder="input word,word,word" value="foo, bar"/> 
 
</form>