1. Sträng
2. Nummer
3. Bigint
4. Boolean
5. Odefinierat
6. Null
7. Symbol
8. Objekt
Objektdatatypen kan innehålla:
1. Ett objekt
2. En array
3. En dejt
// Numbers:
let length = 16;
let weight = 7.5;
// Strings:
let color = "Yellow";
let lastName = "Johnson";
// Booleans
let x = true;
let y = false;
// Object:
const person = {firstName:"John", lastName:"Doe"};
// Array object:
const cars = ["Saab", "Volvo", "BMW"];
// Date object:
const date = new Date("2022-03-25");
En JavaScript-variabel kan innehålla vilken typ av data som helst.
Inom programmering är datatyper ett viktigt begrepp.
För att kunna operera på variabler är det viktigt att veta något om typen.
Utan datatyper kan en dator inte lösa detta på ett säkert sätt:
let x = 16 + "Volvo";
Är det någon mening med att lägga till "Volvo" till sexton? Kommer det att producera en fel eller kommer det att ge ett resultat?
JavaScript kommer att behandla exemplet ovan som:
let x = "16" + "Volvo";
När du lägger till ett nummer och en sträng kommer JavaScript att behandla numret som ett sträng.
let x = 16 + "Volvo";
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>When adding a number and a string, JavaScript will treat the number as a string.</p>
<p id="demo"></p>
<script>
let x = 16 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
let x = "Volvo" + 16;
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>When adding a string and a number, JavaScript will treat the number as a string.</p>
<p id="demo"></p>
<script>
let x = "Volvo" + 16;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
JavaScript utvärderar uttryck från vänster till höger. Olika sekvenser kan ger olika resultat:
let x = 16 + 4 + "Volvo";
Resultat :
20Volvo
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>JavaScript evaluates expressions from left to right. Different sequences can produce different results:</p>
<p id="demo"></p>
<script>
let x = 16 + 4 + "Volvo";
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
let x = "Volvo" + 16 + 4;
Resultat :
Volvo164
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>JavaScript evaluates expressions from left to right. Different sequences can produce different results:</p>
<p id="demo"></p>
<script>
let x = "Volvo" + 16 + 4;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
I det första exemplet behandlar JavaScript 16 och 4 som siffror, tills det når "Volvo".
I det andra exemplet, eftersom den första operanden är en sträng, är alla operander det behandlas som strängar.
JavaScript har dynamiska typer. Det betyder att samma variabel kan användas att hålla olika datatyper:
let x; // Now x is undefined
x = 5; // Now x is a Number
x = "John"; // Now x is a String
En sträng (eller en textsträng) är en serie tecken som "John Doe".
Strängar skrivs med citattecken. Du kan använda enkla eller dubbla citattecken:
// Using double quotes:
let carName1 = "Volvo XC60";
// Using single quotes:
let carName2 = 'Volvo XC60';
Du kan använda citattecken i en sträng, så länge de inte matchar citattecken runt strängen:
// Single quote inside double quotes:
let answer1 = "It's alright";
// Single quotes inside double quotes:
let answer2 = "He is called 'Johnny'";
// Double quotes inside single quotes:
let answer3 = 'He is called "Johnny"';
Du kommer att lära dig mer om strängar senare i den här självstudien.
Alla JavaScript-nummer lagras som decimaltal (flytande komma).
Tal kan skrivas med eller utan decimaler:
// With decimals:
let x1 = 34.00;
// Without decimals:
let x2 = 34;
Extra stora eller extra små tal kan skrivas med scientific (exponentiell) notation:
let y = 123e5; // 12300000
let z = 123e-5; // 0.00123
De flesta programmeringsspråk har många nummertyper:
Heltal (heltal):
byte (8-bitars), kort (16-bitars), int (32-bitars), lång (64-bitars)
Reella tal (flytande komma):
flytande (32-bitars), dubbel (64-bitars).
Javascript-nummer är alltid en typ:
dubbel (64-bitars flyttal).
Du kommer att lära dig mer om nummer senare i den här självstudien.
Alla JavaScript-nummer lagras i ett 64-bitars flyttalsformat.
JavaScript BigInt är en ny datatyp (ES2020) som kan användas för att lagra heltalsvärden som är för stora för att representeras med ett normalt JavaScript-nummer.
let x = BigInt("123456789012345678901234567890");
Du kommer att lära dig mer om BigInt senare i den här självstudien.
Boolean kan bara ha två värden: true
eller false
.
let x = 5;
let y = 5;
let z = 6;
(x == y)
// Returns true
(x == z) // Returns
false
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Booleans</h2>
<p>Booleans can have two values: true or false:</p>
<p id="demo"></p>
<script>
let x = 5;
let y = 5;
let z = 6;
document.getElementById("demo").innerHTML =
(x == y) + "<br>" + (x == z);
</script>
</body>
</html>
Booleans används ofta i villkorlig testning.
Du kommer att lära dig mer om booleans senare i den här handledningen.
JavaScript-matriser är skrivna med hakparenteser.
Matrisobjekt separeras med kommatecken.
Följande kod deklarerar (skapar) en array som heter bilar
, som innehåller tre föremål (bilnamn):
const cars = ["Saab", "Volvo", "BMW"];
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Arrays</h2>
<p>Array indexes are zero-based, which means the first item is [0].</p>
<p id="demo"></p>
<script>
const cars = ["Saab","Volvo","BMW"];
document.getElementById("demo").innerHTML = cars[0];
</script>
</body>
</html>
Arrayindex är nollbaserade, vilket betyder att det första objektet är [0], det andra är [1] och så vidare.
Du kommer att lära dig mer om matriser senare i den här självstudien.
JavaScript-objekt skrivs med klammerparenteser {}
.
Objekt egenskaper skrivs som namn:värde-par, separerade med kommatecken.
const person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Objects</h2>
<p id="demo"></p>
<script>
const person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};
document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>
</body>
</html>
Objektet (personen) i exemplet ovan har fyra egenskaper: förnamn, efternamn, ålder och ögonfärg.
Du kommer att lära dig mer om objekt senare i den här handledningen.
Du kan använda JavaScript-operatorn typeof
för att hitta typen av en JavaScript-variabel.
Operatorn typeof
returnerar typen av en variabel eller ett uttryck:
typeof "" // Returns
"string"
typeof "John" // Returns
"string"
typeof "John Doe" // Returns
"string"
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof "" + "<br>" +
typeof "John" + "<br>" +
typeof "John Doe";
</script>
</body>
</html>
typeof 0 // Returns
"number"
typeof 314 // Returns
"number"
typeof 3.14 // Returns
"number"
typeof (3) // Returns
"number"
typeof (3 + 4) // Returns
"number"
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The typeof operator returns the type of a variable or an expression.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
typeof 0 + "<br>" +
typeof 314 + "<br>" +
typeof 3.14 + "<br>" +
typeof (3) + "<br>" +
typeof (3 + 4);
</script>
</body>
</html>
Du kommer att lära dig mer om typ av senare i den här självstudien.
I JavaScript har en variabel utan värde värdet undefined
. Typen är också odefinierad
.
let car; // Value is undefined,
type is undefined
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>The value (and the data type) of a variable with no value is <b>undefined</b>.</p>
<p id="demo"></p>
<script>
let car;
document.getElementById("demo").innerHTML =
car + "<br>" + typeof car;
</script>
</body>
</html>
Vilken variabel som helst kan tömmas genom att sätta värdet på odefinierad
. Typen kommer också att vara odefinierad
.
car = undefined; // Value is undefined,
type is undefined
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Operators</h1>
<h2>The typeof Operator</h2>
<p>Variables can be emptied if you set the value to <b>undefined</b>.</p>
<p id="demo"></p>
<script>
let car = "Volvo";
car = undefined;
document.getElementById("demo").innerHTML = car + "<br>" + typeof car;
</script>
</body>
</html>
Ett tomt värde har ingenting att göra med odefinierad
.
En tom sträng har både ett juridiskt värde och en typ.
let car = ""; // The value is "", the typeof is "string"
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript</h2>
<p>An empty string has both a legal value and a type:</p>
<p id="demo"></p>
<script>
let car = "";
document.getElementById("demo").innerHTML =
"The value is: " +
car + "<br>" +
"The type is: " + typeof car;
</script>
</body>
</html>