1、数据为什么要有类型
数字与字符串
都是1,为什么要分1和'1’
功能不同
数字是数字,字符串是字符串
数字可以加减乘除,字符串不行
字符串能表示电话号码,数字不行
存储形式不同
JS 中,数字是用 64 位浮点数的形式存储
JS 中,字符串是用类似 UTF8 形式存储的 (UCS-2)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="info"></div>
<script>
// ES5
//数字类型:字符串,数字,布尔,空underline,null,对象object
// ES6
// symbol
//字符串
let name = '中南';
//数字类型
let age = 22;
//布尔类似:bool false, true
let isMale = true;
//undefined:定义未赋值
let future;
console.log(future);
//对象:描述一些列的事物
let obj = {name,age,isMale,future};
//数组,在js里面属于对象
let arr = [1,2,3,4];
console.log(obj);
console.log(age);
// console.log(arr);
// 获取dom元素
const info = document.getElementById('info');
console.log(info);
info.innerHTML = name
</script>
</body>
</html>
2、js中的数据类型
七种
- 数字 number
- 字符串 string
- 布尔 bool
- 符号 symbol
- 空 undefined
- 空 null
- 对象 object
总结:四基两空一对象
注意:以下不是数据类型
数组,函数,日期,它们都属于object
我们来一一介绍这几种数据类型
(1)数字number
1.如何声明数字类型
let num=10 声明整数
let num=10.1 声明小数
let num=2e4 20000科学计数法
2.数字的运算
let a=10
let b=10
计算和 sum=a+b
计算差 menus=a-b
计算× multiple=a*b
计算除法 divide=a/b
<!-- 特殊情况的除法 -->
let value=a/0----Infinity
let nanValue=0/0-----NaN
let mod=a%b 比如7%2=1 取余数
64位浮点数
写法
- 整数写法:1
- 小数写法:0.1
- 科学计数法:1.23e4
- 八进制写法(用得少):0123 或 00123 或 0123
- 十六进制写法:0x3F 或 0X3F
- 二进制写法:0b11 或 0B11
特殊写法
正0 和 负0都等于 0,要严谨
无穷大
Infinity 、+Infinity 、 -Infinity
无法表示的数字
NaN (Not a Number)但它是一个数字,比如1/0 得到NaN
什么是64位浮点数
浮点数,就是小数点会乱动的数
123.456可以表示为1.23456e10的二次方
js中使用64位存储一个number
其中符号正负占一位,指数占11位,有效数字占52位。
所以我们可以得出结论,js中的number是有精度的
范围和精度
范围
拉满指数和有效数字,得到的最大二进制数字
console.log(Number.MAX_VALUE) // 数字型的最大值
console.log(Number.MIN_VALUE) // 数字型的最小值
精度
最多只能到53个二进制表示有效数字
所以15位有效数字都能精确表示
16位数字如果小于90开头,也能精确表示
但是9110000000000001就存不下来
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 数值类型number
let a = 25.1;
let b = 2e4;
// 四则运算
let sum = a + b;
let mul = a * b;
let devide = a / b;
console.log(sum);
console.log(mul);
console.log(devide)
// 除0,变为无穷大Infinity
let uncatch = a / 0;
console.log(uncatch)
// 取模(取余数)
let mo = b % a;
console.log(mo)
console.log(Number.MAX_VALUE) // 数字型的最大值
console.log(Number.MIN_VALUE) // 数字型的最小值
</script>
</body>
</html>
(2)字符串string
1.如何声明字符串 单引号双引号都可以
let str='猪猪' || "猪猪"
let str2='123'|| "123"
2.字符串相加
let sumStr=str+str2 ------- '猪猪123'
let numStr=10+'10' ---------'1010'
3.获取字符串中的子字符
let str='abcde'
获取a
str[0]--------a
获取b
str[1]--------b
获取e
str[4] str[str.length-1] 获取最后一位
4.模板字符串
let modStr=`12345${str}` --------${str}
'12345abcde'
字符串的写法:
①单引号:'hello word'
②双引号:"hello word"
③反引号:`hello word`
<script>
// 字符串string
let str = '你好'
let str2 = '中国'
// 字符串的相加,相当于字符串的拼接
let targetStr = str + str;
console.log(targetStr);
let aa = 30;
let bb = '20';
// 字符串加上数字,会将数字自动编译为字符串
let result = aa + bb;
console.log(result);
console.log(str.length);
// 获取子字符,从下标0开始
let pwd = '12345';
console.log(pwd[2]);
let pwdNum = Number(pwd);
// let pwdNum = parseInt(pwd); 也可以
console.log(pwdNum);
// 模板字符串
let messageInfo = prompt('请输入密码最后一位:');
// '12345'+messageInfo
let templateStr = `12345${messageInfo}`;//要用反引号``而不是单引号''
console.log(templateStr);
</script>
结果:
若使用单引号:
结果:
获取最后一位
messageInfo[messageInfo.length-1]
注意
引号不属于字符串的一部分,就像书名号不属于书名的部分一样
字符串是有长度的
string.length 获取长度
'123'.length //3
string[index]获取字符
let s='hello'
s[0]='h'
(3)bool布尔值
<script>
let a = 1;
let b = '1';
// === 强类型比较,会先去校验类型,然后再比较值的大小
const res1 = a === b;
// == 直接比较值的大小
const res2 = a == b;
// res1 为false
// res2 为true
// 在代码的时候用===
console.log(res1);
console.log(res2);
</script>
=== 强类型比较,会先去校验类型,然后再比较值的大小
== 直接比较值的大小
在代码的时候用“===”
只有两个值,true和false
一般我们使用if配bool
if(value){}else{}
js中定义了五个falsy值,即相当于false的值
undefined,null,0,NaN和''
if(!undefined)
{
console.log('undefined为false');
}
if(!null)
{
console.log('null is false');
}
if(!0)
{
console.log('0 is false');
}
if(!NaN){
console.log('NaN is false');
}
if(!''){
console.log('"" is false' );
}
(4)undefined和null
两个空类型
区别是
- 如果一个变量声明了,但是没有赋值,那么默认值是undefined而不是null
- 如果一个函数没有写return,那么默认return undefined而不是null
(5)对象
对象可以包含所有的数据类型在里面;
定义
键值对的集合
2.通过对象的键,找到对应的值
let name=people.name 第一种写法,通过·操作符
let name=people['name'] 第二种写法,通过[]访问
<!-- 如果你不知道对象里面有声明哪些键 -->
let keys=Object.keys(people)
keys[0]就是name所对应的key
let name=people[keys[0]] 第二种写法,通过[]访问 ,在你不清楚对象里有哪些key存在的情况下
找到对象中存在所有的值
let values=Object.values(people)--------返回所有值的数组
1、对象声明
//对象声明
let people = {
name: '钱多多',
age: 20,
hobbies: true,
coding:()=>{
console.log('coding');
}
}
console.log(people);
注意,键名是字符串,不是标识符,引号可以省略
这里name叫做属性名,'钱多多' 叫做属性值
所有属性名都会自动变为字符串
const res = people.toString();
console.log(res);
2、获取对象中的属性
①适用于知道这个对象里面有name这个key值
const name = people.name;
console.log(name);
②适用于不知道有这个key值,这个key是通过别的方法计算出来的
const name2 = people['name'];
console.log(name2);
获取到对象的所有key
const keys = Object.keys(people);
console.log(keys);
获取对象中的第一个ley值
const name2 = people[keys[0]];
console.log(name2);
3、不确定是否有属性时:使用in来判断key是否还在对象中
console.log('name' in people);
4、获取对象所有的值
// 获取对象所有的值
const values = Object.values(people);
console.log(values);
5、删除key
// 删除key
delete people.name;
console.log(people);
使用变量删除
delete people[keys[0]]
6、判断是否为我们自己给对象添加的属性
console.log(people.hasOwnProperty('age'));
console.log(people.hasOwnProperty('toString'));
6、总结
对象常用操作
删除属性
delete obj.xxx或者delete obj['xxx']
是否含有属性
'xxx' in obj ===false
查看所有属性
Object.keys(obj)
查看属性值
Object.values(obj)
查看自身+共有属性
console.dir(obj)
判断一个属性是自身的还是共有的
obj.hasOwnProperty('key')