【JS30】JavaScript 30天练习 第二天 JavaScript数据类型（一）
📔 第 2 天 JavaScript数据类型（一）
数据类型
在上一节中，我们提到了一点关于数据类型的内容。 数据或值具有数据类型。 数据类型描述了数据的特征。 数据类型可以分为两种：
- 基本数据类型
- 引用数据类型
原始数据类型
JavaScript 中的原始数据类型包括：
- Number：整数、浮点数
- String：单引号、双引号或反引号下的任何数据
- Boolean：真或假值
- Null：空值或无值
- undefined：一个没有值的声明变量
- symbol
JavaScript 中的非原始数据类型包括：
- Objects 对象
- Functions 函数
- Array 数组
现在，让我们看看原始数据类型和引用数据类型到底是什么意思。
基本数据类型 是不可变（不可修改）类型的数据类型。 一旦创建了原始数据类型，我们就无法修改它。
例子：
let word = 'JavaScript'
如果我们尝试修改存储在变量 word 中的字符串，JavaScript 应该会引发错误。 单引号、双引号或反引号下的任何数据类型都是字符串数据类型。
word[0] = 'Y'
此表达式不会更改存储在变量 word 中的字符串。 因此，我们可以说字符串是不可修改的，或者换句话说是不可变的。
原始数据类型通过其值进行比较。 让我们比较不同的数据值。 请参见下面的示例：
let numOne = 3
let numTwo = 3console.log(numOne == numTwo) // truelet js = 'JavaScript'
let py = 'Python'console.log(js == py) //false let lightOn = true
let lightOff = falseconsole.log(lightOn == lightOff) // false
非原始数据类型
非原始数据类型是可修改或可变的。我们可以在创建非原始数据类型后修改它的值。
这里以创建数组举例。数组是方括号中的数据值列表。数组可以包含相同或不同的数据类型。数组值由它们的索引引用。在 JavaScript 中，数组索引从零开始。即，数组的第一个元素位于索引0处，第二个元素位于索引1处，第三个元素位于索引2处，依此类推。
let nums = [1, 2, 3]
nums[0] = 10console.log(nums) // [10, 2, 3]
如上所示，作为非原始数据类型的数组是可变的。非原始数据类型不能按值进行比较。即使两个非原始数据类型具有相同的属性和值，它们也不是严格相等的。
let nums = [1, 2, 3]
let numbers = [1, 2, 3]console.log(nums == numbers) // falselet userOne = {name:'ZhangSan',role:'teaching',country:'China'
}let userTwo = {name:'ZhangSan',role:'teaching',country:'China'
}console.log(userOne == userTwo) // false
经验告诉我们，不要比较非原始数据类型。不要比较数组、函数或对象。
非原始值被称为引用类型，因为它们是通过引用而不是值进行比较的。只有当两个对象引用同一个底层对象时，它们才是严格相等的。
let nums = [1, 2, 3]
let numbers = numsconsole.log(nums == numbers) // truelet userOne = {name:'ZhangSan',role:'teaching',country:'Chinese'
}let userTwo = userOneconsole.log(userOne == userTwo) // true
你不是一个人觉得原始数据类型和非原始数据类型之间的区别晦涩难懂。喝口水冷静一下，学完下面的章节再来回看。
下面我们从数值类型开始学习数据类型。
数值类型（Number）
数值类型是可以进行所有算术运算的整数和十进制值。
让我们看一些数字的例子。
声明数值类型
let age = 35
const gravity = 9.81 //我们使用const声明不变的值，比如这里的重力加速度的引力常数
let mass = 72 // 质量，单位是千克
const PI = 3.14 // 几何常数Π=3.14// 更多例子
const boilingPoint = 100 // 水的沸点，它是以摄氏度为单位的温度，它是一个常数
const bodyTemp = 37 // 人体平均温度，是一个常数，单位是摄氏度console.log(age, gravity, mass, PI, boilingPoint, bodyTemp)
数值对象
在 JavaScript 中，数值对象提供了许多处理数值的方法。
const PI = Math.PIconsole.log(PI) // 3.141592653589793// 四舍五入到最接近的数字
// 如果高于 0.5 ，则向上取整；如果低于 0.5 则向下舍去小数。console.log(Math.round(PI)) // 将值Π四舍五入到最接近的数字，输出为3console.log(Math.round(9.81)) // 10console.log(Math.floor(PI)) // “地板”函数，向下取整，输出为3console.log(Math.ceil(PI)) // “天花板”函数，向上取整，输出为4console.log(Math.min(-5, 3, 20, 4, 5, 10)) // 返回得到最小的数值，输出为-5console.log(Math.max(-5, 3, 20, 4, 5, 10)) // 返回得到最大的数值，输出为20const randNum = Math.random() // 创建一个 0 到 0.999999 之间的随机数
console.log(randNum)// 接下来创建一个0-10之间的随机数const num = Math.floor(Math.random () * 11) // 创建一个0-10之间的随机数
console.log(num)//绝对值
console.log(Math.abs(-10)) // 10//求平方根
console.log(Math.sqrt(100)) // 10console.log(Math.sqrt(2)) // 1.4142135623730951// 求幂
console.log(Math.pow(3, 2)) // 9// 自然常数e
console.log(Math.E) // 2.718// 对数
// 返回以 E 为底的x的自然对数 Math.log(x)
console.log(Math.log(2)) // 0.6931471805599453
console.log(Math.log(10)) // 2.302585092994046// 三角函数
Math.sin(0)
Math.sin(60)Math.cos(0)
Math.cos(60)
随机数生成器
JavaScript 数值对象有一个随机数字生成器，random() 方法，它生成从 0 到 0.999999999… 的数字
let randomNum = Math.random() // 生成 0 到 0.999...的一个随机数
现在，让我们看看如何使用 random() 方法生成 0 到 10 之间的随机数：
let randomNum = Math.random() // 生成 0 到 0.999...之间的一个随机数
let numBtnZeroAndTen = randomNum * 11console.log(numBtnZeroAndTen) // 输出的结果范围：最小值 0 和最大值 10.99let randomNumRoundToFloor = Math.floor(numBtnZeroAndTen)
console.log(randomNumRoundToFloor) // 利用“地板”函数向下取整得到0-10的整数。
字符串（String）
字符串是文本，位于 单引号’’ 、 双引号"" 、 反引号`` 中。要声明一个字符串，我们需要一个变量名、赋值运算符、单引号、双引号或反引号下的值。
让我们看一些字符串的例子：
let space = ' ' // 一个空的字符串
let firstName = 'Zhang'
let lastName = 'San'
let country = 'China'
let city = 'BeiJing'
let language = 'JavaScript'
let job = 'teacher'
let quote = "加油2022"
let quotWithBackTick = `加油2022`
字符串连接
将两个或多个字符串连接在一起称为连接。
这里使用前面 String 部分中声明的字符串：
let fullName = firstName + space + lastName; // 用“+”可将两个字符串合并在一起。
console.log(fullName);
输出：
Zhang San
我们可以用不同的方式连接字符串。
使用加法运算符连接
使用加法运算符连接是一种旧方法。这种连接方式繁琐且容易出错。知道如何以这种方式连接就可以，但是强烈建议使用 ES6 模板字符串（稍后会解释）。
// 声明不同数据类型的不同变量
let space = ' '
let firstName = 'Zhang'
let lastName = 'San'
let country = 'China'
let city = 'BeiJing'
let language = 'JavaScript'
let job = 'teacher'
let age = 250let fullName =firstName + space + lastName
let personInfoOne = fullName + '. I am ' + age + '. I live in ' + country; // ES5 的字符串加法console.log(personInfoOne)
输出：
Zhang San. I am 250. I live in BeiJing
长文字字符串
字符串可以是单个字符或段落或页面。如果字符串长度太大，则无法容纳在一行中。我们可以在每行末尾使用反斜杠字符 (\) 来指示字符串将在下一行继续。
例子：
const paragraph = "我叫张三，打小就住在北京\
嘿，您猜怎么着， \
咱老北京早上起来就这一出. \
您别说，别处还真没有。"console.log(paragraph)
字符串中的转义序列
在 JavaScript 和其他编程语言中，\ 后跟一些字符是转义序列。让我们看看最常见的转义字符：
- \n: 换行
- \t：制表符，表示8个空格
- \\: 反斜杠
- \’：单引号（’）
- \"：双引号 (")
console.log('希望大家2022都会快乐。\n加油！') // \n表示换行
console.log('Days\tTopics\tExercises')
console.log('Day 1\t3\t5')
console.log('Day 2\t3\t5')
console.log('Day 3\t3\t5')
console.log('Day 4\t3\t5')
console.log('This is a backslash symbol (\\)') // 输出反斜杠\
console.log('In every programming language it starts with \"Hello, World!\"')
console.log("In every programming language it starts with \'Hello, World!\'")
console.log('The saying \'Seeing is Believing\' isn\'t correct in 2020')
Output in console:
希望大家2022都会快乐。
加油！
Days Topics Exercises
Day 1 3 5
Day 2 3 5
Day 3 3 5
Day 4 3 5
This is a backslash symbol (\)
In every programming language it starts with "Hello, World!"
In every programming language it starts with 'Hello, World!'
The saying 'Seeing is Believing' isn't correct in 2020
模板文字（模板字符串）
要创建模板字符串，需要使用两个反引号。可以将数据作为表达式注入到模板字符串中。为了注入数据，可以用花括号 ({}) 将表达式括起来，并在前面标上 $ 符号。请参阅下面的语法。
//语法：
`String literal text`
`String literal text ${expression}`
例1：
console.log(`The sum of 2 and 3 is 5`)
let a = 2
let b = 3
console.log(`The sum of ${a} and ${b} is ${a + b}`) // 动态注入数据
例2：
let firstName = 'Zhang'
let lastName = 'San'
let country = 'China'
let city = 'BeiJing'
let language = 'JavaScript'
let job = 'teacher'
let age = 250
let fullName = firstName + ' ' + lastNamelet personInfoTwo = `I am ${fullName}. I am ${age}. I live in ${country}.` //这是ES6的字符串插值方法
let personInfoThree = `I am ${fullName}. I live in ${city}, ${country}. I am a ${job}. I teach ${language}.`
console.log(personInfoTwo)
console.log(personInfoThree)
使用字符串模板或字符串插值方法，我们可以添加表达式，可以是一个值，也可以是一些运算（比较、算术运算、三元运算）。
let a = 2
let b = 3
console.log(`${a} 是否大于 ${b}: ${a > b}`)
2 是否大于 3: false
字符串方法
JavaScript 中的一切都是对象。 字符串是一种原始数据类型，这意味着一旦创建它就无法修改它。 但是，字符串对象有很多***字符串方法***。 有不同的字符串方法可以帮助我们处理字符串。
- length：字符串 length 方法返回字符串中包含空格的字符数。
例子：
let js = 'JavaScript'
console.log(js.length) // 10
let firstName = 'Zhang'
console.log(firstName.length) // 5
- 访问字符串中的字符：我们可以使用字符串的索引来访问字符串中的每个字符。在编程中，从0开始计数。字符串的第一个索引为零，最后一个索引是字符串的长度减一。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-sny91WRI-1644653798682)(…/images/string_indexes.png)]
以下为示例：
let string = 'JavaScript'
let firstLetter = string[0]console.log(firstLetter) // Jlet secondLetter = string[1] // a
let thirdLetter = string[2]
let lastLetter = string[9]console.log(lastLetter) // tlet lastIndex = string.length - 1console.log(lastIndex) // 9
console.log(string[lastIndex]) // t
- toUpperCase()：此方法将字符串更改为大写字母。
let string = 'JavaScript'console.log(string.toUpperCase()) // JAVASCRIPTlet firstName = 'Zhang'console.log(firstName.toUpperCase()) // ZHANGlet country = 'China'console.log(country.toUpperCase()) // CHINA
- toLowerCase()：此方法将字符串更改为小写字母。
let string = 'JavasCript'console.log(string.toLowerCase()) // javascriptlet firstName = 'Zhang'console.log(firstName.toLowerCase()) // zhanglet country = 'China'console.log(country.toLowerCase()) // china
- substr()：它有两个参数，起始索引和要切片的字符数。
let string = 'JavaScript'
console.log(string.substr(4,6)) // Scriptlet country = 'China'
console.log(country.substr(3, 2)) // in
- substring()：它有两个参数，起始索引和终止索引，但不包括终止索引处的字符。
let string = 'JavaScript'console.log(string.substring(0,4)) // Java
console.log(string.substring(4,10)) // Script
console.log(string.substring(4)) // Scriptlet people = 'Chinese'console.log(people.substring(0, 3)) // Chi
console.log(people.substring(3, 6)) // ese
console.log(people.substring(3)) // ese
- split()：split方法在指定位置/按指定字符拆分字符串。
let string = '30 Days Of JavaScript'console.log(string.split()) // 更改为数组 -> ["30 Days Of JavaScript"]
console.log(string.split(' ')) // 按空格分割成一个数组 -> ["30", "Days", "Of", "JavaScript"]（注意这里的split(' ')中有个空格）let firstName = 'Zhang'console.log(firstName.split()) // 改成数组 -> ["Zhang"]
console.log(firstName.split('')) // 在每个字母处拆分，得到一个数组 -> ["Z", "h", "a", "n", "g"]let countries = 'Finland, Sweden, Norway, Denmark, and Iceland'console.log(countries.split(',')) // 以逗号分割成数组 -> ["Finland", "Sweden", "Norway", "Denmark", "and Iceland"]
console.log(countries.split(', ')) // ["Finland", "Sweden", "Norway", "Denmark", "and Iceland"]
- trim()：删除字符串开头或结尾的尾随空格。
let string = ' 30 Days Of JavaScript 'console.log(string)
console.log(string.trim(' ')) // 删除字符串开头和结尾的空格let firstName = ' Zhang 'console.log(firstName)
console.log(firstName.trim()) // 仍然删除字符串开头和结尾的空格
30 Days Of JavasCript
30 Days Of JavasCriptZhang
Zhang
- includes()：它接受一个子字符串参数并检查字符串中是否存在子字符串参数。 includes() 返回一个布尔值。如果字符串中存在子字符串，则返回 true，否则返回 false。
let string = '30 Days Of JavaScript'console.log(string.includes('Days')) // true
console.log(string.includes('days')) // false - 区分大小写！
console.log(string.includes('Script')) // true
console.log(string.includes('script')) // false
console.log(string.includes('java')) // false
console.log(string.includes('Java')) // truelet people = 'Chinese'console.log(people.includes('chi')) // false
console.log(people.includes('Chi')) // true
console.log(people.includes('ese')) // true
console.log(people.includes('Ese')) // false
- replace()：将旧子串和新子串作为参数。
string.replace(oldsubstring, newsubstring)
let string = '30 Days Of JavaScript'
console.log(string.replace('JavaScript', 'Python')) // 30 Days Of Pythonlet country = 'China'
console.log(country.replace('a', 'ese')) // Chinese
- charAt()：获取索引并返回该索引处的值
string.charAt(index)
let string = '30 Days Of JavaScript'
console.log(string.charAt(0)) // 3let lastIndex = string.length - 1
console.log(string.charAt(lastIndex)) // t
- charCodeAt()：获取索引并返回该索引处值的字符代码（ASCII 数字）
string.charCodeAt(index)
let string = '30 Days Of JavaScript'
console.log(string.charCodeAt(3)) // D的ASCII码为68let lastIndex = string.length - 1
console.log(string.charCodeAt(lastIndex)) // t的ASCII码为116- indexOf()：获取子字符串，如果子字符串存在于字符串中，则返回子字符串的第一个位置，如果不存在，则返回-1.
string.indexOf(substring)
let string = '30 Days Of JavaScript'console.log(string.indexOf('D')) // 3
console.log(string.indexOf('Days')) // 3
console.log(string.indexOf('days')) // -1
console.log(string.indexOf('a')) // 4
console.log(string.indexOf('JavaScript')) // 11
console.log(string.indexOf('Script')) //15
console.log(string.indexOf('script')) // -1
- lastIndexOf()：获取子字符串，如果子字符串存在于字符串中，则返回子字符串的最后位置，如果不存在则返回-1
string.lastIndexOf(substring)
let string = 'I love JavaScript. If you do not love JavaScript what else can you love.'console.log(string.lastIndexOf('love')) // 67
console.log(string.lastIndexOf('you')) // 63
console.log(string.lastIndexOf('JavaScript')) // 38
- concat()：它需要许多子字符串并将它们连接起来。
string.concat(substring, substring, substring)
let string = '30'
console.log(string.concat("Days", "Of", "JavaScript")) // 30DaysOfJavaScriptlet people = 'Chi'
console.log(people.concat("nese")) // Chinese
- startsWith：它将子字符串作为参数，并检查字符串是否以指定的子字符串开头。它返回一个布尔值（真或假）。
string.startsWith(substring)
let string = 'Love is the best to in this world'console.log(string.startsWith('Love')) // true
console.log(string.startsWith('love')) // false
console.log(string.startsWith('world')) // falselet country = 'China'console.log(country.startsWith('Chi')) // true
console.log(country.startsWith('chi')) // false
console.log(country.startsWith('ina')) // false
- endsWith：它将子字符串作为参数，并检查字符串是否以指定的子字符串结尾。它返回一个布尔值（真或假）。
string.endsWith(substring)
let string = 'Love is the most powerful feeling in the world'console.log(string.endsWith('world')) // true
console.log(string.endsWith('love')) // false
console.log(string.endsWith('in the world')) // truelet country = 'China'console.log(country.endsWith('ina')) // true
console.log(country.endsWith('chi')) // false
console.log(country.endsWith('Chi')) // false
- search：它将子字符串作为参数，并返回第一个匹配项的索引。搜索值可以是字符串或正则表达式模式。
string.search(substring)
let string = 'I love JavaScript. If you do not love JavaScript what else can you love.'
console.log(string.search('love')) // 2
console.log(string.search(/javascript/gi)) // 7 // g-表示在整个文本中搜索，i - 不区分大小写
- match：它以一个子字符串或正则表达式模式作为参数，如果有匹配则返回一个数组，如果没有则返回null。正则表达式模式以 / 符号开始，以 / 符号结束。
let string = 'love'
let patternOne = /love/ // 没有任何标志
let patternTwo = /love/gi // g-表示在整个文本中搜索，i - 不区分大小写
匹配方法：
string.match(substring)
let string = 'I love JavaScript. If you do not love JavaScript what else can you love.'
console.log(string.match('love'))
["love", index: 2, input: "I love JavaScript. If you do not love JavaScript what else can you love.", groups: undefined]
let pattern = /love/gi
console.log(string.match(pattern)) // ["love", "love", "love"]
接下来使用正则表达式从文本中提取数字。如果看不懂，请不要惊慌！后面会介绍正则表达式。
let txt = 'In 2019, I ran 30 Days of Python. Now, in 2020 I am super exited to start this challenge'
let regEx = /\d+/// 带转义字符（/）的d代表d并不再是一个普通的字母d，而是充当数字。
// + 表示一位或多位数字，
// 如果后面有 g ，则表示全局搜索，搜索整个字符串。console.log(txt.match(regEx)) // ["2", "0", "1", "9", "3", "0", "2", "0", "2", "0"]
console.log(txt.match(/\d+/g)) // ["2019", "30", "2020"]
- repeat()：它接受一个数字作为参数，并返回字符串重复该次数的结果。
string.repeat(n)
let string = 'love'
console.log(string.repeat(10)) // lovelovelovelovelovelovelovelovelovelove
检查数据类型和强制转换
检查数据类型
要检查某个变量的数据类型，可以使用 typeof 方法。
例子:
//首先创建不同数据类型的变量let firstName = 'Zhang' // string
let lastName = 'San' // string
let country = 'China' // string
let city = 'BeiJing' // string
let age = 250 // number
let job // undefined, 因为变量并没有被赋值console.log(typeof 'Zhang') // string
console.log(typeof firstName) // string
console.log(typeof 10) // 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
console.log(typeof undefined) // undefined
console.log(typeof null) // object
更改数据类型（强制转换）
- 转换：将一种数据类型转换为另一种数据类型。可以使用 parseInt()、parseFloat()、Number()、+ sign、str() 等函数。
当进行算术运算时，字符串数字应首先转换为整数或浮点数，否则会返回错误。
字符串转整数
我们可以将字符串数字转换为数字。引号内的任何数字都是字符串数字。字符串数字的示例：“10”、“5”等。
我们可以使用以下方法将字符串转换为数字：
- parseInt()函数
- Number()函数
- 加号（+）
let num = '10'
let numInt = parseInt(num)
console.log(numInt) // 10
let num = '10'
let numInt = Number(num)console.log(numInt) // 10
let num = '10'
let numInt = +numconsole.log(numInt) // 10
字符串转浮点数
我们可以将字符串浮点数转换为浮点数。引号内的任何浮点数都是字符串浮点数。字符串浮点数的示例：‘9.81’、‘3.14’、‘1.44’ 等。
我们可以使用以下方法将字符串浮点数转换为数字：
- parseFloat()函数
- Number()函数
- 加号（+）
let num = '9.81'
let numFloat = parseFloat(num)console.log(numFloat) // 9.81
let num = '9.81'
let numFloat = Number(num)console.log(numFloat) // 9.81
let num = '9.81'
let numFloat = +numconsole.log(numInt) // 9.81
浮点数转整数
我们可以将浮点数转换为整数。
我们使用以下方法将float转换为int：
- parseInt()
let num = 9.81
let numInt = parseInt(num)console.log(numInt) // 9
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！