JavaScriptの文字列と数値の変換


89

JavaScriptで以下を実行するにはどうすればよいですか?

  1. 「1」、「2」、「3」を「123」に連結

  2. 「123」を123に変換

  3. 123 + 100 = 223を加算します

  4. 223を「223」に変換


42
私が読んだほとんどすべてのJavaScriptの本はこれらの問題を扱っています。しかし、それは問題ありません。StackOverflowとは、質問に答えることです。@Shadi Almosri--SOには「卑劣な」ルールがあります。ここで質問をする人たちをけなす意味が分からない。
Nosredna

4
@Nosredna:私は質問することを完全に理解します、私はそれらに答えるのが大好きですが、あなたが試したという事実を示すことは、単にエチケットを期待するよりも良いエチケットであり、個人的な学習体験にとっても良いと思います。意地悪にしようとするのではなく、ただ私の意見です!:)
Shadi Almosri、2009年

1
@Shadi、それでは質問はどのように行われるべきですか?すでに答えを探したという宣言がありますか?
Nosredna

1
初めて見たときは宿題のようでしたが、読み直したところ、JavaScriptを試して予期せぬ結果を得て釘付けにしようとしているように思えました。とはいえ、stackoverflow.com / faqに学生向けの名誉コードのようなものが含まれるのではないかと思います。私たちはここではグローバル大学のようなものであり、この場所の一連の倫理が何であるかを理解しようとすることは狂気ではないと思います。または多分それはクレイジーです。:-)
artlung 2009年

6
@Shadi、まあ、良い面では、質問と回答はStackOverflowにあり、うまくいけば他の人々を助けるでしょう。特にJavaのような言語を使用している場合は特に、人々がこの問題に行き詰まっているのがわかります。人々が何度もこれを尋ねる理由があります-それは彼らがJavaScriptの式がどのように機能するかを知っていると思っているからです。彼らはJS外での経験に基づいて仮定を行います。そのため、文字列と数値を追加して単項プラスとマイナスを試して、いくつかの簡単なテストを試してみるのがとても便利です。
Nosredna 2009年

回答:


120

parseInt()およびに慣れる必要がありtoString()ます。

また、ツールキットで役立つのは、変数を調べて、それがどのタイプかを調べることtypeofです。

<script type="text/javascript">
    /**
     * print out the value and the type of the variable passed in
     */

    function printWithType(val) {
        document.write('<pre>');
        document.write(val);
        document.write(' ');
        document.writeln(typeof val);
        document.write('</pre>');
    }

    var a = "1", b = "2", c = "3", result;

    // Step (1) Concatenate "1", "2", "3" into "123"
    // - concatenation operator is just "+", as long
    //   as all the items are strings, this works
    result = a + b + c;
    printWithType(result); //123 string

    // - If they were not strings you could do
    result = a.toString() + b.toString() + c.toString();
    printWithType(result); // 123 string

    // Step (2) Convert "123" into 123
    result = parseInt(result,10);
    printWithType(result); // 123 number

    // Step (3) Add 123 + 100 = 223
    result = result + 100;
    printWithType(result); // 223 number

    // Step (4) Convert 223 into "223"
    result = result.toString(); //
    printWithType(result); // 223 string

    // If you concatenate a number with a 
    // blank string, you get a string    
    result = result + "";
    printWithType(result); //223 string
</script>

これをスクリプトタグに入れる特別な理由はありますか?
Julix、2016年

@Julix 2009年の初心者は、htmlファイルを開いて基本的な概念を学びます。今日、私がこの新鮮なことに答えていた場合、私は違う答えをするかもしれませんが、そうではないかもしれません。
artlung 2016年

53

ステップ(1)「1」、「2」、「3」を「123」に連結

 "1" + "2" + "3"

または

 ["1", "2", "3"].join("")

参加方法は、項目間の指定された区切り文字を入れ、文字列に配列のアイテムを連結します。この場合、「区切り文字」は空の文字列("")です。


ステップ(2)「123」を123に変換する

 parseInt("123")

ECMAScript 5以前は、基数10の基数を渡す必要がありました。parseInt("123", 10)


ステップ(3)123 + 100 = 223を追加

 123 + 100


ステップ(4)223を「223」に変換

 (223).toString() 


すべて一緒に置く

 (parseInt("1" + "2" + "3") + 100).toString()

または

 (parseInt(["1", "2", "3"].join("")) + 100).toString()

4
わかりやすい明確な例。また、良い形の称賛- 関数の基数parseIntは常に指定する必要があります
hotshot309 2012年

基数を含めると私は混乱し、私はそれが説明されている別の答えにスクロールしました。混乱した時点で正しくなるように、簡単な説明で編集しました。
ArtOfWarfare 2017

@ArtOfWarfareありがとう、良い編集。この回答の時点では基数が必要でした。最近、私はそれを省くために議論をすることができます。ES5、すべての「現代」のブラウザとのNode.jsのサポート、のparseInt(のみ0-9>と<a文字列)のとおり、常にベース10使用しています
パトリックMcElhaney

楽しい事実.. Netscapeの元のJavaScript(1995年頃)では、parseIntのデフォルトの基数は8でした(文字列が含まれておらず、8または9でない場合)
Justin Ohms

26
r = ("1"+"2"+"3")           // step1 | build string ==> "123"
r = +r                      // step2 | to number    ==> 123
r = r+100                   // step3 | +100         ==> 223
r = ""+r                    // step4 | to string    ==> "223"

//in one line
r = ""+(+("1"+"2"+"3")+100);

高速文字列をありがとう->数値変換
mcont

数値かどうかを確認する場合は、parseInt()を使用してください。たとえば、parseInt( "")はNaNですが、+ ""は0です!

15

JavaScriptのタイピングシステムにより、これらの質問は常に出てきます。人々は、数字の文字列を取得しているときに数字を取得していると思います。

JavaScriptが文字列と数値を処理する方法を利用するいくつかのことを次に示します。個人的には、JavaScriptが文字列連結に+以外の記号を使用したことを願っています。

ステップ(1)「1」、「2」、「3」を「123」に連結

result = "1" + "2" + "3";

ステップ(2)「123」を123に変換する

result = +"123";

ステップ(3)123 + 100 = 223を追加

result = 123 + 100;

ステップ(4)223を「223」に変換する

result = "" + 223;

これらが機能する理由を知っていれば、JavaScript式で問題が発生する可能性は低くなります。


3
何が起こっているのかについてはかなり不透明であるため、これは実際には非常に悪い習慣だと思います。特定の操作が暗黙的キャストに影響を与えることを知ることはトリックであり、知っておくと良いことですが、まったく理解できません。コミュニケーションがすべてです。
アナカタ09年

1
コードを読んだときに何が起こっているのかを理解できるように、これらのことを正確に理解することが重要だと思います。多くのJavaScriptはソースとして送信されるため簡潔であり、小さなコードはサーバーのコスト削減を意味します。
Nosredna、2009年

6
ただし、圧縮ツールを使用してこれを実現する必要があります。この形式では、保守の非常に現実的なコストで最適化されます。
アナカタ09年

6
それでも、これらのことを知ることは、JavaScriptが文字列と数値をどのように処理するかについての知識の欠如であった最初の質問を防ぐのに役立ちます。それは知的好奇心の問題です。文字列に数値を追加するとどうなりますか?単項プラスはどのように機能しますか?答えがわからない、JavaScriptがわからない、などの質問が出てきます。
Nosredna

11

あなたはこのようにそれを行うことができます:

// step 1 
var one = "1" + "2" + "3"; // string value "123"

// step 2
var two = parseInt(one); // integer value 123

// step 3
var three = 123 + 100; // integer value 223

// step 4
var four = three.toString(); // string value "223"

16
ベストプラクティスは、radixパラメーターをparseInt()関数に追加することです。したがって、parseInt(one、10)は、スローしたものが誤って変換されないことを保証します。
artlung 2009年

3
同意した。そうでない場合、で始まる値08進数(8進数)と見なされます。
hotshot309

1
さらに、予期しない、値が始まる0と、その後含む8または9失敗し、0例:の復帰につながるparseInt('034') = 28、とparseInt('09') = 0
Robert Martin

9

文字列を数値に変換するには、0を引きます。数値を文字列に変換するには、 ""(空の文字列)を追加します。

5 + 1は6を与えます

(5 + "")+ 1は "51"を返します

( "5"-0)+ 1は6を与えます


1
このような言語の癖に基づくトリックに依存すると、本当のあいまいさが生じる可能性があります。たとえば、「5」-0は実際には数値5になりますが、「5」+0は文字列「50」になります。(はい、私はそれが何年も後であることを知っています、そして私がこれを読んでさえいたことはおそらく少し悲しいです。)
Nick Rice

6

parseIntはscanfのように機能が間違っています。

parseInt( "12 monkeys"、10)は値 '12'の数値です
+「12匹の猿」は、値「NaN」の数値です
Number( "12 monkeys")は値 'NaN'の数値です


1

以下は、JavaScriptを使用してトラブルを起こす方法の非常に苛立たしい例です。

あなただけを使用しようとすると parseInt()して数値に変換し、別の数値を結果に追加と、2つの文字列が連結されます。

ただし、次の例に示すように、かっこ内に合計式を置くことで問題を解決できます。

結果:年齢の合計は98です。彼らの年齢合計は5048ではありません:

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
function Person(first, last, age, eye) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eye;
}

var myFather = new Person("John", "Doe", "50", "blue");
var myMother = new Person("Sally", "Rally", 48, "green");

document.getElementById("demo").innerHTML = "Their age sum is: "+
 (parseInt(myFather.age)+myMother.age)+"; Their age sum is NOT: " +
 parseInt(myFather.age)+myMother.age; 
</script>

</body>
</html>


0

最も簡単なのは、整数を文字列にする場合です

var a,b, c;
a = 1;
b = a.toString(); // This will give you string

これで、文字列型の変数bから整数を取得できます

c = b *1; //This will give you integer value of number :-)

上記確認したい場合は番号です。bに整数が含まれているかどうかわからない場合は、

if(isNaN(c*1)) {
  //NOt a number
}
else //number

0

これを行うには、単項プラス演算子を使用して、まず数値に変換し、単純に加算します。下記参照:-

var a = "4";
var b = "7";
var sum = +a + +b; 
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.