Konvertera strängar till tal
Konvertera tal till strängar
Konvertera datum till siffror
Konvertera siffror till datum
Konvertera booleaner till tal
Konvertera tal till booleaner
JavaScript-variabler kan konverteras till en ny variabel och en annan datatyp:
Genom att använda en JavaScript-funktion
Automatiskt av JavaScript själv
Den globala metoden Number()
omvandlar en variabel (eller ett värde) till ett tal.
En numerisk sträng (som "3.14") konverteras till ett tal (som 3.14).
En tom sträng (som "") konverteras till 0.
En icke-numerisk sträng (som "John") konverteras till NaN
(Inte ett tal).
Dessa kommer att konvertera:
Number("3.14")
Number(Math.PI)
Number(" ")
Number("")
Dessa konverterar inte:
Number("99 88")
Number("John")
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Numbers</h1>
<h2>The Number() Method</h2>
<p>The Number() metod converts a variable (or value) into a number:</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
Number("3.14") + "<br>" +
Number(Math.PI) + "<br>" +
Number(" ") + "<br>" +
Number("") + "<br>" +
Number("99 88") + "<br>" +
Number("John") + "<br>";
</script>
</body>
</html>
I kapitlet Nummermetoder kan du hittar fler metoder som kan användas för att konvertera strängar till tal:
Beskrivning
Returnerar ett tal, konverterat från dess argument
Analyserar en sträng och returnerar ett flyttal
Analyserar en sträng och returnerar ett heltal
Operatorn unary + kan användas för att konvertera en variabel till ett tal:
let y = "5";
// y is a string
let x = + y;
// x is a number
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>The JavaScript typeof Operator</h2>
<p>The typeof operator returns the type of a variable or expression:</p>
<p id="demo"></p>
<script>
let y = "5";
let x = + y;
document.getElementById("demo").innerHTML = typeof y + "<br>" + typeof x;
</script>
</body>
</html>
Om variabel kan inte konverteras, den blir fortfarande ett tal, men med värdet NaN
(Inte ett nummer):
let y = "John";
// y is a string
let x = + y; // x is a number (NaN)
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>The JavaScript typeof Operator</h2>
<p>The typeof operator returns the type of a variable or expression:</p>
<p id="demo"></p>
<script>
let y = "John";
let x = + y;
document.getElementById("demo").innerHTML = typeof y + "<br>" + typeof x;
</script>
</body>
</html>
Den globala metoden String()
kan konvertera tal till strängar.
Den kan användas på alla typer av tal, bokstaver, variabler eller uttryck:
String(x) // returns a string from a number variable x
String(123) // returns a string from a number literal 123
String(100 + 23) // returns a string from a number from an expression
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>The JavaScript String() Method</h2>
<p>The String() method can convert a number to a string.</p>
<p id="demo"></p>
<script>
let x = 123;
document.getElementById("demo").innerHTML =
String(x) + "<br>" +
String(123) + "<br>" +
String(100 + 23);
</script>
</body>
</html>
Number-metoden toString()
gör samma sak.
x.toString()
(123).toString()
(100 + 23).toString()
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Number Methods</h2>
<p>The toString() method converts a number to a string.</p>
<p id="demo"></p>
<script>
let x = 123;
document.getElementById("demo").innerHTML =
x.toString() + "<br>" +
(123).toString() + "<br>" +
(100 + 23).toString();
</script>
</body>
</html>
I kapitlet Nummermetoder kan du hittar fler metoder som kan användas för att konvertera tal till strängar:
Returnerar en sträng, med ett tal avrundat och skrivet med exponentiell notation.
Returnerar en sträng, med ett tal avrundat och skrivet med ett angivet antal decimaler.
Returnerar en sträng, med ett tal skrivet med en angiven längd
Den globala metoden Number()
kan användas för att konvertera datum till tal.
d = new Date();
Number(d) // returns 1404568027739
Datummetoden getTime()
gör samma sak.
d = new Date();
d.getTime() // returns 1404568027739
Den globala metoden String()
kan konvertera datum till strängar.
String(Date()) // returns "Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)"
Datummetoden toString()
gör samma sak.
Date().toString() // returns "Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)"
I kapitlet Date Methods, you hittar fler metoder som kan användas för att konvertera datum till strängar:
Få dagen som ett nummer (1-31)
Få veckodagen ett nummer (0-6)
Få det fyrsiffriga året (åååå)
Få timmen (0-23)
Få millisekunderna (0-999)
Hämta minuterna (0-59)
Få månaden (0-11)
Få sekunderna (0-59)
Få tiden (millisekunder sedan 1 januari 1970)
Den globala metoden Number()
kan också konvertera booleaner till tal.
Number(false) // returns 0
Number(true) // returns 1
Den globala metoden String()
kan konvertera booleaner till strängar.
String(false) // returns "false"
String(true) // returns "true"
Den booleska metoden toString()
gör samma sak.
false.toString() // returns "false"
true.toString() // returns "true"
När JavaScript försöker använda en "fel" datatyp kommer den att försöka göra det konvertera värdet till en "rätt" typ.
Resultatet är inte alltid som du förväntar dig:
5 + null // returns 5 because null is converted to 0
"5" + null // returns "5null" because null is converted to "null"
"5" + 2 // returns
"52" because 2 is converted to "2"
"5" - 2 // returns 3 because "5" is converted to 5
"5" * "2" // returns
10 because "5" and "2" are
converted to 5 and 2
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
(5 + null) + "<br>" +
("5" + null) + "<br>" +
("5" + 2) + "<br>" +
("5" - 2) + "<br>" +
("5" * "2") + "<br>" +
("5" / "2") + "<br>"
</script>
</body>
</html>
JavaScript anropar automatiskt variabelns toString()
-funktion när du försöker för att "mata ut" ett objekt eller en variabel:
document.getElementById("demo").innerHTML = myVar;
// if myVar = {name:"Fjohn"} // toString converts to "[object Object]"
// if myVar = [1,2,3,4] // toString converts to "1,2,3,4"
// if myVar = new Date() // toString converts to "Fri Jul 18 2014 09:08:55 GMT+0200"
Tal och booleaner konverteras också, men detta är inte särskilt synligt:
// if myVar = 123 // toString converts to "123"
// if myVar = true // toString converts to "true"
// if myVar = false // toString converts to "false"
Den här tabellen visar resultatet av att konvertera olika JavaScript-värden till Number, String och Boolean:
Ursprungligt värde:
false
Konverterat till nummer:
0
Konverterat till sträng:
"false"
Konverterat till booleskt:
false
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting false to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = false;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
true
Konverterat till nummer:
1
Konverterat till sträng:
"true"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting true to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = true;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
0
Konverterat till nummer:
0
Konverterat till sträng:
"0"
Konverterat till booleskt:
false
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting the number 0 to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = 0;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
1
Konverterat till nummer:
1
Konverterat till sträng:
"1"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting the number 1 to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = 1;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
"0"
Konverterat till nummer:
0
Konverterat till sträng:
"0"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting the string "0" to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = "0";
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
"000"
Konverterat till nummer:
0
Konverterat till sträng:
"000"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting the string "000" to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = "000";
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
"1"
Konverterat till nummer:
1
Konverterat till sträng:
"1"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting the string "1" to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = 1;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
NaN
Konverterat till nummer:
NaN
Konverterat till sträng:
"NaN"
Konverterat till booleskt:
false
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting NaN to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = NaN;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
Infinity
Konverterat till nummer:
Infinity
Konverterat till sträng:
"Infinity"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting Infinity to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = Infinity;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
-Infinity
Konverterat till nummer:
-Infinity
Konverterat till sträng:
"-Infinity"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting -Infinity to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = -Infinity;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
""
Konverterat till nummer:
0
Konverterat till sträng:
""
Konverterat till booleskt:
false
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting an empty string to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = "";
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
"20"
Konverterat till nummer:
20
Konverterat till sträng:
"20"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting a numeric string to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = "20";
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
NaN
Konverterat till nummer:
"twenty"
Konverterat till sträng:
"twenty"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting a text string to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = "twenty";
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
[ ]
Konverterat till nummer:
0
Konverterat till sträng:
""
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<p>Converting an empty array to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
var x = [];
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
[20]
Konverterat till nummer:
20
Konverterat till sträng:
"20"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<p>Converting an array with one numeric element to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
var x = [20];
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
[10,20]
Konverterat till nummer:
NaN
Konverterat till sträng:
"10,20"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<p>Converting an array with two numeric elements to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
var x = [10,20];
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
["twenty"]
Konverterat till nummer:
NaN
Konverterat till sträng:
"twenty"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<p>Converting an array with one string element to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
var x = ["twenty"];
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
["ten","twenty"]
Konverterat till nummer:
NaN
Konverterat till sträng:
"ten,twenty"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<p>Converting an array with two string element to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
var x = ["ten","twenty"];
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
function(){}
Konverterat till nummer:
NaN
Konverterat till sträng:
"function(){}"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting a function to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
const x = function(){};
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
{ }
Konverterat till nummer:
NaN
Konverterat till sträng:
"[object Object]"
Konverterat till booleskt:
true
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting an object to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
const x = {};
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
null
Konverterat till nummer:
0
Konverterat till sträng:
"null"
Konverterat till booleskt:
false
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting null to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = null;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Ursprungligt värde:
undefined
Konverterat till nummer:
NaN
Konverterat till sträng:
"undefined"
Konverterat till booleskt:
false
Prova →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Type Conversions</h2>
<p>Converting undefined to other types:</p>
<p id="demo" style="font-family:courier"></p>
<script>
let x = undefined;
document.getElementById("demo").innerHTML =
"Number : " + Number(x) + "<br>" +
"String : " + String(x) + "<br>" +
"Boolean: " + Boolean(x);
</script>
</body>
</html>
Värden inom citattecken indikerar strängvärden.
Röda värden indikerar värden (vissa) programmerare kanske inte förväntar sig.