Maison > interface Web > Questions et réponses frontales > Il existe plusieurs types en javascript

Il existe plusieurs types en javascript

青灯夜游
Libérer: 2022-09-30 15:37:09
original
8105 Les gens l'ont consulté

Il existe 9 types de données : 1. Le type chaîne, qui est un morceau de texte entouré de guillemets ; 2. Le type numérique, utilisé pour définir des valeurs ; 3. Le type booléen, avec seulement deux valeurs ; une valeur « Vide » signifie qu'il n'y a pas de valeur ; 5. Un type non défini signifie indéfini ; 6. Un type de symbole signifie une valeur unique ; 7. Un type d'objet, qui est un ensemble non ordonné composé de clés et de valeurs ; collecte de données classées dans l'ordre ; 9. Le type de fonction est un bloc de code avec une fonction spécifique.

Il existe plusieurs types en javascript

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

Le type de données fait référence au type de valeur qui peut être stockée et manipulée dans le programme. Chaque langage de programmation a ses types de données pris en charge. Différents types de données sont utilisés pour stocker différentes données, telles que du texte, des valeurs numériques, des images, etc. .

JavaScript est un langage typé dynamiquement. Lors de la définition d'une variable, vous n'avez pas besoin de spécifier le type de la variable à l'avance. Le type de la variable est déterminé dynamiquement par le moteur JavaScript lors de l'exécution du programme. vous pouvez utiliser la même variable pour stocker différents types de variables. Type de données, par exemple :

var a;  // 此时 a 为 Undefined
a = "http://c.biancheng.net/"; // 此时 a 为 String 类型
a = 123;  // 此时 a 为 Number 类型
Copier après la connexion

Les types de données en JavaScript peuvent être divisés en deux types :

  • Types de données de base (types de valeur) : String, Number, Booléen, Vide (Null), Non défini (Non défini), Symbole ;

  • Types de données de référence : Objet (Objet), Tableau (Array), Fonction (Fonction).

Astuce : Symbol est un nouveau type de données introduit dans ECMAScript6, qui représente une valeur unique.

1. Type de chaîne

Le type de chaîne (String) est un morceau de texte entouré de guillemets simples '' ou de guillemets doubles "", tels que "123", "abc". Il convient de noter que les guillemets simples et doubles sont des manières différentes de définir une chaîne et ne font pas partie de la chaîne.

2. Type de nombre

Le type numérique (Nombre) est utilisé pour définir des valeurs numériques. JavaScript ne fait pas de distinction entre les entiers et les décimaux (nombres à virgule flottante), et le type Nombre est uniformément utilisé pour représenter

. Remarque : les valeurs numériques pouvant être définies par le type Number Ce n'est pas infini. Le type Number en JavaScript ne peut représenter que des valeurs comprises entre -(2∧53 - 1) et (2∧53 -1).

3. Type booléen

Le type booléen n'a que deux valeurs, vrai (vrai) ou faux (faux). Il est souvent utilisé pour faire des jugements conditionnels. En plus d'utiliser directement vrai ou faux. En plus de définir des variables de type booléen, vous pouvez également utiliser certaines expressions pour obtenir des valeurs de type booléen

4. Le type Null

Null est un type de données spécial avec une seule valeur, représentant une valeur "nulle". c'est-à-dire qu'il n'y a aucune valeur, rien, utilisé pour définir un pointeur d'objet nul.

Utilisez l'opérateur typeof pour vérifier le type de Null. Vous constaterez que le type de Null est Object, ce qui signifie que Null utilise en fait une valeur spéciale appartenant à Object. Ainsi, en attribuant la variable à Null, nous créons un objet vide.

5. Type non défini

Undéfini est également un type de données spécial avec une seule valeur, ce qui signifie indéfini. Lorsque nous déclarons une variable mais n'attribuons pas de valeur à la variable, la valeur par défaut de la variable est Indéfinie.

6. Type de symbole

Le symbole est un nouveau type de données introduit dans ECMAScript6, qui représente une valeur unique.

La valeur du symbole est générée par la fonction Symbole. Le nom d'attribut d'un objet peut avoir deux types, l'un est la chaîne d'origine et l'autre est le nouveau type de symbole. Les noms d'attribut sont du type Symbole et sont uniques, garantissant qu'ils n'entreront pas en conflit avec d'autres noms d'attribut.

let s1=Symbol()
let s2=Symbol()
console.log(s1)
//Symbol()
console.log(s2)
//Symbol()
console.log(s1===s2)
//false

//Symbol函数能接受字符串作为参数,表示对Symbol实例的描述
let s1=Symbol('xxx')
let s2=Symbol('hhh')
console.log(s1)
//Symbol(xxx)
console.log(s2)
//Symbol(hhh)
console.log(s1===s2)
//false复制代码
Copier après la connexion

Symbol函数前不能使用new命令,会报错。这是因为生成的 Symbol 是一个原始类型的值,不是对象。也就是说,由于 Symbol 值不是对象,所以不能添加属性。相当于是一种特殊的字符串。

应用场景

  • 作为属性名

由于 Symbol 值都是不相等的,这意味着 Symbol 值可以作为标识符,用在对象的属性名,就能保证不会出现同名的属性。这对于一个对象由多个模块构成的情况非常有用,防止某一个键被不小心改写或覆盖。

const grade={
    张三:{address:'qqq',tel:'111'},
    李四:{address:'aaa',tel:'222'},
    李四:{address:'sss',tel:'333'},
}
console.log(grade)
//张三: {address: "qqq", tel: "111"} 李四: {address: "sss", tel: "333"}
//对象的key值不能重复 如果有重复 后面的value值就会覆盖前面的


//使用Symbol解决,相当于一个独一无二的字符串
const stu1=Symbol('李四')
const stu2=Symbol('李四')
console.log(stu1===stu2)
//false
const grade={
    [stu1]:{address:'aaa',tel:'222'},
    [stu2]:{address:'sss',tel:'333'},
}
console.log(grade)
//李四:{address:'sss',tel:'222'} 李四:{address:'sss',tel:'333'}
console.log(grade[stu1])
//李四:{address:'sss',tel:'222'}
console.log(grade[stu2])
//李四:{address:'sss',tel:'333'}
Copier après la connexion
  • 属性遍历

const sym=Symbol('imooc')
class User{
    constructor(name){
        this.name=name
        this[sym]='imooc.com'
    }
    getName(){
        return this.name+this[sym]
    }
}
const user=new User('www')

//for in的方法不能遍历到Symbol属性 像被隐藏了
for(let key in user){
    console.log(key)//name 
}

//Object.keys(obj)方法也不能遍历到Symbol属性
for(let key of Object.keys(user)){
    console.log(key)//name 
}

//Object.getOwnPropertySymbols(obj)只能获取到Symbol属性
for(let key of Object.getOwnPropertySymbols(user)){
    console.log(key)//Symbol(imooc) 
}

//Reflect.ownKeys(obj)对象的属性都能获取到
for(let key of Reflect.ownKeys(user)){
    console.log(key)
    //name 
    //Symbol(imooc) 
}
Copier après la connexion
  • 消除魔术字符串

魔术字符串指的是,在代码中多次出现、与代码形成强耦合的某一个具体的字符串或者数值。风格良好的代码,应该尽量消除魔术字符串,改成一些含义清晰的变量代替。

function getArea(shape) {
    let area = 0
    switch (shape) {
        case 'Triangle':
            area = 1
            break
        case 'Circle':
            area = 2
            break
    }
    return area
}
console.log(getArea('Triangle'))
//Triangle和Circle就是魔术字符串。多次出现,与代码形成了“强耦合”,不利于后面的修改和维护。

const shapeType = {
    triangle: Symbol(),
    circle: Symbol()
}

function getArea(shape) {
    let area = 0
    switch (shape) {
        case shapeType.triangle:
            area = 1
            break
        case shapeType.circle:
            area = 2
            break
    }
    return area
}
console.log(getArea(shapeType.triangle))
Copier après la connexion

7、Object 类型

Object数据类型,称为对象,是一组由键、值组成的无序集合。可以用new操作符后跟要创建的对象类型的名称来创建。也可以用字面量表示法创建。在其中添加不同名(包含空字符串在内的任意字符串)的属性。

1)构造对象

使用 new 运算符调用构造函数,可以构造一个实例对象。具体用法如下:

var objectName = new functionName(args);
Copier après la connexion

参数说明如下:

  • objectName:返回的实例对象。

  • functionName:构造函数,与普通函数基本相同,但是不需要 return 返回值,返回实例对象,在函数内可以使用 this 预先访问。

  • args:实例对象初始化配置参数列表。

示例

下面示例使用不同类型的构造函数定义各种实例。

var o = new Object(); //定义一个空对象

var a = new Array(); //定义一个空数组

var f = new Function(); //定义一个空函数

2)对象直接量

使用直接量可以快速创建对象,也是最高效、最简便的方法。具体用法如下:

var objectName = {
    属性名1 : 属性值1,
    属性名2 : 属性值2,
    ...
    属性名n : 属性值n
};
Copier après la connexion

在对象直接量中,属性名与属性值之间通过冒号进行分隔,属性值可以是任意类型的数据,属性名可以是 JavaScript 标识符,或者是字符串型表达式。属性于属性之间通过逗号进行分隔,最后一个属性末尾不需要逗号。

在 JavaScript 中,对象类型的键都是字符串类型的,值则可以是任意数据类型。要获取对象中的某个值,可以使用对象名.键的形式,如下例所示:

var person = {
    name: 'Bob',
    age: 20,
    tags: ['js', 'web', 'mobile'],
    city: 'Beijing',
    hasCar: true,
    zipcode: null
};
console.log(person.name);       // 输出 Bob
console.log(person.age);        // 输出 20
Copier après la connexion

8、Array 类型

数组(Array)是一组按顺序排列的数据的集合,数组中的每个值都称为元素(Element),每个元素的名称(键)被称为数组下标(Index)。数组的长度是弹性的、可读写的。

数组中可以包含任意类型的数据。

在 JavaScript 中定义(创建或者声明)数组的方法有两种:构造数组和数组直接量。

1)构造数组

使用 new 运算符调用 Array() 类型函数时,可以构造一个新数组。

示例:

  • 直接调用 Array() 函数,不传递参数,可以创建一个空数组。

var a = new Array();  //空数组
Copier après la connexion
  • 传递多个值,可以创建一个实数组。

var a = new Array(1, true, "string", [1,2], {x:1,y:2});  //实数组
Copier après la connexion

每个参数指定一个元素的值,值得类型没有限制。参数的顺序也是数组元素的顺序,数组的 length 属性值等于所传递参数的个数。

  • 传递一个数值参数,可以定义数组的长度,即包含元素的个数。

var a = new Array(5);  //指定长度的数组
Copier après la connexion

参数值等于数组 length 的属性值,每个元素的值默认值为 undefined。

  • 如果传递一个参数,值为 1,则 JavaScript 将定义一个长度为 1 的数组,而不是包含一个元素,其值为 1 的数组。

var a = new Array(1);
console.log(a[0]);
Copier après la connexion

2)数组直接量

数组直接量的语法格式:在中括号中包含多个值列表,值之间用逗号分隔。

下面代码使用数组直接量定义数组。

var a = [];  //空数组
var a = [1, true, "0", [1,0], {x:1,y:0}];  //包含具体元素的数组
Copier après la connexion

推荐使用数组直接量定义数组,因为数组直接量是定义数组最简便、最高效的方法。

9、Function 类型

函数(Function)是一段具有特定功能的代码块,函数并不会自动运行,需要通过函数名调用才能运行,如下例所示:

function sayHello(name){
    return "Hello, " + name;
}
var res = sayHello("Peter");
console.log(res);  // 输出 Hello, Peter
Copier après la connexion

此外,函数还可以存储在变量、对象、数组中,而且函数还可以作为参数传递给其它函数,或则从其它函数返回,如下例所示:

var fun = function(){
    console.log("http://c.biancheng.net/js/");
}
function createGreeting(name){
    return "Hello, " + name;
}
function displayGreeting(greetingFunction, userName){
    return greetingFunction(userName);
}
var result = displayGreeting(createGreeting, "Peter");
console.log(result);  // 输出 Hello, Peter
Copier après la connexion

【推荐学习:javascript高级教程

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal