js基础-数据类型

js基础之数据类型

ECMScript 6种简单数据类型(原始类型

  • Undefined 值未定义
  • Null空指针
  • Boolean布尔值
  • Number数值
  • String字符串
  • Symbol符号

typeof操作符

因为定义js变量不指定类型,typeof可以判断数据类型

//使用方式
typeof 变量 ;//返回字符串

 - 'undefined' 对应 Null类型
 - 'boolean'   对应 Boolean类型
 - 'string'    对应 String类型
 - 'number'    对应 Number类型
 - 'object'    对应 Object/Null类型
 - 'symbol'    对应 Symbol类型
 - 'function'  对应值为函数

1、Undefined类型

只有undefined一个值,当var、let关键字声明却未初始化时,会被赋值undefined值
一般来说永远不要显式给某个值赋值undefined,字面值“undefined”主要用于比较
应为它是为了为了区别 空对象指针(null)未初始化变量 而诞生的

var a ;
let b ;
console.log(a);//undefined
console.log(b);//undefined
console.log(c);//Uncaught ReferenceError: c is not defined

//变量c未被声明typeof也返回undefined. 所以为了避免此类情况
//强烈建议声明变量时初始化值
//那样就知道typeof返回undefined是变量未声明
typeof(a);//undefined
typeof(c);//undefined

//undefined是假值,当它作为判断条件
if(a){
//不执行
console.log('aaa');
}

if(c){
//报错
console.log('aaa');
}

2、Null类型

只有null一个值。逻辑上表示空对象指针。这就是为何typeof返回object的原因

//当我们要和创建一个变量来赋值对象时,最好初始化null值.这样可以保持null是空对象指针的语义
let a = null;
if(true){
	a = {name:'tom',age:15}
}

//undefined 由 null 派生而来 所以ECMAScript将他们定义为表面相等
undefined == null ;// true
undefined === null ;// false

//null也是假值

3、Boolean类型

布尔值类型有两个字面值 true | false

将特定的值转化为布尔值
数据类型转化为 true 的值转化为 false 的值
Booleantruefalse
String非空字符串‘’(空字符串)
Number非零数值(包括无穷值)0、NaN
Object任意对象null
Undefined不存在undefined
Boolean(''); //false
Boolean(5); //true
Boolean({});//true
Boolean(undefined);//false

//条件语句中的 flag 会自动转化为Boolean类型再进行判断
if(flag){
}

4、Number类型

它包括整数(十进制、八进制、十六进制…)、浮点数(双精度值)等

(1)浮点值
//定义浮点值: 小数点后至少1位不为0的数字
let num = 0.1;// ok
let num1 = 1.1;// ok
let num2 = .55; // 有效 但不推荐
//因为存储浮点值的空间是整数的2倍,所以ECAMScript想方设法将浮点数转化为整数
let float = 1.0000; // 1

//科学计数法表示
//一个数值后跟 E/e 10的n次幂
let num3 = 3E3; // 3000
let a = 3.14e5; // 314000
let b = 3e-10;// 0.0000000003

//不要企图测试特定的浮点值
//这种错误是因为使用了 IEEE754数值
a + b == 0.3;
0.1 + 0.2 == 0.3; //false
(2)值得范围
var big = Number.MAX_VALUE; //最大值范围  
var small = Number.MIN_VALUE;//最小值范围 
console.log(big);//大多数浏览器是 1.7976931348623157e+308
console.log(small);//大多数浏览器是 5e-324 
//无穷值不能进一步计算
console.log(1/0);// Infinity 无穷大
console.log(-1/0);// -Infinity 负无穷大

//测试一个数是否超出范围
isFinite(x) ;// 返回boolean (true/false)
(3)NaN

不是数值”,用于表示本来要返回数值得操作失败了。不会终止代码运行

0/0 ;// NaN
//任何涉及NaN的操作始终返回NaN,NaN不等于包括NaN在内任何值
NaN/10 + 1;//NaN'
NaN == NaN ; //fals

//isNaN函数 判断参数是否为NaN
isNaN(NaN);// true
isNaN(10);// false
isNaN('0');// false
isNaN('NaN');// false
isNaN(true);// false
(4)数值转换
//用于任意数据类型
//1、Number() 
//规则如下
 - 布尔值 true-> 1 ,false -> 0
 - 数值   直接返回
 - null   0
 - undefined    NaN
 - 字符串,转化规则如下
 	*字符串包含数值字符(包括前面带+-号) ,会忽略前面的0,转化为十进制数值
	 	Number('00111') ->  111
		Number('-00111') ->  -111
		Number('+00.111') ->  0.111
	*字符串包含其他有效进制格式(如16进制..,此时带+-号会影响判断
		Number('0xf') ->  15
	* ''空字符串  ->  0 
	* 上述情况之外的 返回 NaN
 - 对象  调用 valueOf()方法,按上述规则转化返回值,如结果是NaN,调用 toString()方法转为字符串
//2、+ (隐式转化) 用于任意数据类型 ,与Number()方法一致
 + '-00.122' ; // -0.123
 +  true ;  // 1

//用于字符串、数值
//1、parseInt()  从第一个非空格字符开始转换(如果第一个字符不是+,-,数值 则立马返回NaN)返回整数
//第二个参数指定解析进制数(默认十进制),可省略其进制前缀
parseInt(''); //NaN
parseInt('123.111a');// 123
parseInt('0xf'); // 15 转化16 进制整数
parseInt('f',16); // 15  转化16 进制整数,省略 '0x'前缀
//2、parseFloat()  只能解析十进制数 此外与parseInt类似,可返回整数、浮点数、NaN
parseFloat('00.002.003'); //0.002

String类型

表示0或多个16位Unicode字符序列。由两个 ‘(单引号)或 “(双引号)或 `(反单引号)包裹

1、转化为字符串
//tostring()方法:可返回当前值的字符串等价物,null、undefined没有此方法
11.toString(); // "11"
true.toString();// "true"
let obj = {a:12};
obj.toString(); // "[object Object]"

//数值调用此方法时:可传入一个参数(进制数),将该数值转化为该进制值 没有返回前缀
let num = 12;
num.toString(2);// "1100" 以2进制显示 
num.toString(8);// "14"
num.toString(16);// "c"
【注意】:12.toString(2);//会报错,要用 变量.toString(2)调用
//String(): null、undefined转为字符串(其他值类型也可)
String(null);// "null"
String(undefined);//"undefined"
2、模板字面量

不同于单双引号,它可以跨行定义字符串

//跨行定义字符串
let pageHTML = `
	<div>
		<a> href = "#">
			<span>JavaScript</span>
		</a>
	</div>
`
//字符串插值
let y = 2020;
let m = 12;
let d = 12;
let time = `${y}${m}${d}天`;
console.log(time);// 2020年12月12日

//标签函数  自定义插值行为
//创建标签模板 防止用户恶意输入
//string:除变量外的其他字符串数组,argus:变量数组,前者总比后者长度大1
function SaferHTMLx(string,...argus) {
    console.log(string,argus);//["<p>", " has ", " sent you a message.</p>"] , 
    // ["<script>alert("abc")</script>", "<script>alert("abc")</script>"]
    let s = string[0];
    for (let i = 1; i < string.length; i++) {
      let arg = String(argus[i-1]);
 	  //对变量参数进行处理
      s += arg.replace(/&/g, "&amp;")
              .replace(/</g, "&lt;")
              .replace(/>/g, "&gt;");
      s += string[i]         
    }
    return s
  }
 
let senderx = '<script>alert("abc")</script>';
//使用标签模板 
let messagex = SaferHTMLx`<p>${senderx} has ${senderx}sent you a message.</p>`;
console.log(messagex);//<p>&lt;script&gt;alert("abc")&lt;/script&gt; has sent you a message.</p>

Symbol类型

symbol(符号)实例是唯一、不可变的。用途是确保对象属性使用唯一标识,不会发生冲突

//实例化
//创建普通符号,不会出现在全局符号注册表
let sb1 = Symbol('www');
let sb2 = Symbol('www');
//传入相同字符串创建的实例不相等
sb1 === sb2 ;//false
//作为对象属性
let obj = {
    [sb1]:'symbol值',
    www:'字符串值',
    age:12
}
console.log(obj[sb1]);//'symbol值' 取值必须使用[]与字符串区分
console.log(obj.www);//'字符串值'
//返回对象实例的属性数组
Object.getOwnPrepertySymbols(obj);//[Symbol(www)]
Object.getOwnPrepertyName(obj);//["www","age"]
Object.getOwnPrepertyDescriptors(obj);//[Symbol(www):{...},www:{...},age:{...}]
Reflect.ownKeys(obj);//[Symbol(www),"www","age"]

//全局符号注册表(Symbol.for('xxx'))在全局搜索符号注册表,发现已注册返回该符号实例,否则全局新创建一个符号实例
let a = Symbol.for('www');//返回该 Symbol 值  创建新符号
let b = Symbol.for('www');//返回该 Symbol 值  返回已有符号
let c = Symbol.for("www");//返回该 Symbol 类型值的 key   返回已有符号
console.log(c == a);//false
console.log(b == a);//false
console.log(c == b);//true
//查询全局注册表( Symbol.keyFor() ),方法接收符号,返回全局符号对应字符串键。若不存在返回 undefined
Symbol.keyFor('aaa');// 报错   参数必须为符号(let sb = Symbol('sbsbsb');)

Object类型

一组数据和功能的集合

//实例化创建
let obj = new Object();//ok
let obj = new Object; //合法,但不推荐
let obj = {};//推荐
//属性及方法

 - constructor:用于创建当前对象的函数。上面例子中这个属性就是 Object()函数
 - hasOwnProperty(属性名):判断当前对象实例是否存在给定的属性
 - isPrototypeof(对象):判断当前对象是否为另一个对象的原型
 - propertyIsEnumerable(属性名):判断对象给定的属性是否可枚举(遍历)
 - tolocaleString():返回对象对应的字符串表示,该字符串反应本地化执行环境
 - toString():返回对象对应的字符串
 - valueOf();返回对象对应的字符串、数值或布尔值表示,通常与toString()返回值相同

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值