了解Web开发中的JavaScript数据类型
#javascript #网络开发人员 #教程 #写作

JavaScript是用于Web开发的流行编程语言。开发人员可以通过操纵网页元素并响应用户交互来创建动态和交互式Web应用程序。

JavaScript支持几种原始数据类型,包括数字,字符串,布尔值,空和未定义,并且还支持更复杂的数据类型,例如数组和对象。每种数据类型都有其独特的属性和行为,并了解如何有效使用它们可以对我们代码的性能和可靠性产生很大的影响。

本文将深入审查各种JavaScript数据类型,研究其在Web开发项目中使用它们的特征和最佳实践。

什么是数据类型?

数据类型描述了数据的特征。此外,数据类型是数据类型的分类,该数据告诉编译器或解释器如何使用数据。
数据类型可以分为两种:原始数据类型和非主要数据类型。

JavaScript中的原始数据类型

原始数据类型是不可修道的数据类型。创建原始数据类型后,我们将无法修改它。 JavaScript中的原始数据类型包括:

数字:
数字是可以执行算术的整数或小数值。

let a = 25;    // integer value
let b = 27.0;  // decimal value

字符串:
字符串是由单个,双重或反向报价包含的文本。我们需要一个可变名称,一个分配运算符以及一个由单个,双人或反向报价包含的值才能声明字符串。

let nameOne = Ade;   //This is a string
let nameTwo= Ola;
let name = `love`;

让我们考虑以下示例:

let animal = "Dog";
animal[0] = "C";
console.log(animal);    //This returns Dog

上面的表达式表明在评估表达后变量“动物”值保持不变。结果,我们可以得出结论,字符串是不可变的。

比较原始变量,将其值直接比较,以确定它们是否相等。

布尔值:
布尔人给出了真值。它们主要用于检查逻辑条件。

let a = 5;
let b = 6;
console.log(a==b)    // returns false

let a = 5;
let b = 5;
console.log(a==b)    // returns true

让我们考虑以下更多示例:

let firstName = "Ade";
let lastName = "Ade";
console.log(firstName == lastName);    // This returns true

//Another example
let ageOne = 10;
let ageTwo = 11;
console.log( ageOne == ageTwo);        // This returns false

null:
空是一个空值

let a = null;
console.log(a)        //This returns null

未定义:
没有值的声明变量

let a;
console.log(a)       // This returns undefined

JavaScript中的非重要数据类型

非主要数据类型是可修改或可变的,即,在创建之后,可以更改非主要数据类型的值。 JavaScript中的非重要数据类型包括:

  • 对象:对象是属性的集合,是键值对。

  • 数组:数组是方括号中数据值的列表。数组可以包含相同或不同的数据类型。

让我们考虑下面的代码。

let name = ["Adeola", "Tosin", "Comfort"];
name[1] = "Daniel";
console.log(name);      //output: ["Adeola", "Daniel", "Comfort"]

阵列是一种可变的非主要数据类型,这意味着可以更改其内容。

注意:为了避免出乎意料的结果,通常建议不要直接比较对象和数组等非启示数据类型,因为通常通过参考而不是通过值比较它们。

// array example
let age = [10, 26, 38]
let ages = [10, 26, 38]
console.log(age == ages)     // This returns false

// object example
let user_info_One = {
name: 'Adeola',
role: 'Writer',
country:'Nigeria'
}
let user_info_Two = {
name: 'Adeola',
role: 'Writer',
country: 'Nigeria'
}
console.log(user_info_One == user_info_Two)  // This returns false

注意:两个对象仅在指代相同的基础对象时严格平等。

// array example
let age = [10, 26, 38]
let ages = age
console.log(age == ages)     // This returns true

// object example
let user_info_One = {
name:'Adeola';,
role:'Writer';,
country:'Nigeria';
}
let user_info_Two = user_info_One
console.log(user_info_One == user_info_Two)    //This returns true

字符串串联

串联是用来描述将多个字符串连接在一起以创建单个字符串的过程的术语。

让我们考虑下面的代码。

let firstName =  "Adeola";
let lastName =  "Ajiboso";
let gender =  "Girl";
let hobby =  "writing";
let fullName =  firstName + ' ' + lastName;
let userInfo = fullName + ' is a  ' + gender + ' and  she loves ' + hobby;
console.log(userInfo);

// Output
Adeola Ajiboso is a Girl and she loves writing

模板文字

模板文字提供了一种简便的方法,可以插值变量和表达式为字符串。

用于创建模板字符串的背景而不是单引号。我们可以通过将它们包装在卷曲括号()中,并在模板字符串中包含占位符或变量的占位符,并用美元符号($)将它们包装在colly braces()中。

例如,

let name = "Peter";
let age = 20;
let message = `My name is ${name} and I am ${age} years old.`;
console.log(message)  
//output
My name is Peter and I am 20 years old.

字符串方法

JavaScript方法是可以在对象上执行的操作。常见的字符串方法包括:

  • touppercase()toUpperCase()是一种内置的字符串方法,将字符串更改为大写
let myWord = "hello, world!";
let myUppercase = myWord.toUpperCase();
console.log(myUppercase);               
// Output: HELLO, WORLD!
  • tolowercase():此方法将字符串更改为小写。
let myWord = "Hello, World!";
let myLowercaseString = myWord.toLowerCase();
console.log(myUppercaseString); 

// Output:hello,world!"
  • length():此方法返回字符串中的字符数,包括空间。
let fruit = "Banana ";
console.log(fruit.length);         // This return 7
  • subtr():此方法需要两个参数,子字符串的启动索引和子字符串的长度将返回。
let myString = "hello, world!";
let mySubstring = myString.substr(7, 5);
console.log(mySubstring);                  // Output: "world"
  • split():这是一种内置的字符串方法,将字符串拆分为基于指定的分隔符的子字符串。
let string = 'Technical writing is fun'
console.log(string.split())     
console.log(string.split(' '))  

//output
// Changes to an array -> [ 'Technical writing is fun' ]
// Split to an array at space -> [ 'Technical', 'writing', 'is', 'fun' ]
  • trim():此方法在字符串的开始或结束时删除了尾随空间。
let firstName = ' Prestige '
console.log(firstName)
console.log(firstName.trim())

//output
  Prestige
Prestige
  • 包括():此方法返回一个布尔值,指示指定字符串是否在原始字符串中。
let word = "hello, world!";
let isWordFound = word.includes("world");
console.log(isWordFound);                   // Output: true
  • 替换():替换用于用新的子字符串或角色替换字符串中特定子字符串的所有出现。

    替换的语法看起来像

    string.replace(oldsubstring, newsubstring)

例如,

let hobby = 'I love writing'
console.log(hobby.replace('writing', 'singing')) 

// output: I love singing
  • indexof():取一个子字符串,如果子字符串存在于字符串中,则返回子弦的第一个位置;如果不存在,它将返回-1

让我们考虑下面的代码。

let string = 'Technical is fun'
console.log(string.indexOf('T'))               // 0
console.log(string.indexOf('fun'))            // 13
console.log(string.indexOf('Fun'))           // -1
console.log(string.indexOf('i'))            // 5
console.log(string.indexOf('Technical'))   // 0
console.log(string.indexOf('Is'))         //-1
console.log(string.indexOf('e'))         // 1

数据类型的铸造和检查

铸件

铸造是指将值从一个数据类型转换为另一种数据类型的过程。我们使用parseInt()parseFloat()Number()+str()

字符串到int
我们可以使用各种方法将字符串号转换为数字值。如前所述,一对引号中的任何数字都被视为字符串号。我们可以使用以下方法将字符串转换为数字:

  • parseint(),
  • number(),
  • 加号(+)

例如,让我们考虑下面的代码。

//using parseInt to convert from string to int
let num = '10'
let numInt = parseInt(num)
console.log(numInt)   // 10

//using Number to convert string to int
let num = '20'
let numInt = Number(num)
console.log(numInt)   // 20

//using + to convert from string to int
let num = '40'
let numInt = +(num)
console.log(numInt)   // 40

浮动到int
我们可以使用以下方法将浮点数转换为整数

  • parseInt()

让我们考虑下面的代码。

let num = 7.82;
let numInt = parseInt(num);
console.log(numInt);            //output: 7

在JavaScript中检查数据类型

我们利用typeof方法来检查数据类型。

让我们考虑下面的代码。

let firstName = 'John';      
let lastName = 'Doe';        
let country = 'Nigeria';       
let city = 'Lagos';          
let age = 25;                 
let job;                         
console.log(typeof 'lastName')  // string
console.log(typeof firstName)   // string
console.log(typeof country)     // string
console.log(typeof city)        // string
console.log(typeof age)          // number
console.log(typeof 3.14)        // number
console.log(typeof true)        // boolean
console.log(typeof false)       // boolean
console.log(typeof NaN)         // number
console.log(typeof job)         // undefined

结论

总而言之,了解JavaScript数据类型对于Web开发至关重要。通过了解JavaScript中使用的不同类型的数据,开发人员可以编写更有效的代码。

毫不犹豫地提出问题或在这篇文章上发表评论。我在TwitterLinkedInGitHub上有空。请留意我即将发表的博客文章,其中我将介绍Web开发的另一个重要领域。作为开发人员,我很高兴提供其他信息。在此之前,愉快的编码并保重!