当前位置: 首页 > Web前端 > vue.js

JS系列:js数据类型转换

时间:2023-04-01 00:11:19 vue.js

数据类型转换【基本数据类型】numbernumberstringbooleanbooleanemptynullundefined【参考数据类型】objectobjectcommonobject{}arrayobject[](Array)Regularobject(RegExp)日期对象(Date)数学函数(Math)...在function函数的实际项目中,根据需求,我们许亚进行数据类型转换(规则与规则相互独立,不要混用注意)将其他数据类型转换为数字类型1.发生了什么——isNaN检测:当检测到的值不是数字类型时,浏览器会先调用Number方法将其转换为数字,然后检查是否为无效数字。示例1:isNaN('3')=>falseNumber('3')->3isNaN(3)->false是一个有效数字示例2:isNaN('3px')=>falseNumber('3px')->NaNisNaN(3)->true非有效数根据parseInt/parseFloat/Number手动转换为数值类型数学运算:+-*/%,但是“+”不只是数学运算,它还可能是一个字符串拼接'3'-1=>2Number('3')->33-1->2'3px'-1=>NaN'3px'+1=>'3px1'字符串拼接vari='3';我=我++;=>4//i++是纯数学运算,不是字符串连接i=i+1;=>'31'i+=1;=>'31'当基于“==”比较时,有的时候其他值也会被转换为数字类型。2.转换规则**`转换方式:Number(浏览器自己的转换都是按此方式)`**>[将字符串转为数字]只有遇到无效的数字字符时,结果才为NaNNumber('')->0''->0'\n'->0//\n是换行符'\t'->0//\t是tab键盘,也就是Tab,一个Tab就是4个空格keyboard[布尔型转数字]true->1false->0[无转数字]null->0undefined->NaN[引用类型转数字]先转字符串(toString),再转数字(Number)将其他值转换成字符串1.发生了什么——基于alert/confirm/prompt/document.write等方法输出内容时,输出值会被转换成字符串,然后输出。alert(1)=>'1'根据'+'拼接字符串时,将引用值转为数字时,先转为字符串,再转为数字,并为对象设置属性名,如果不是字符串,先转为字符串,然后作为属性存储到对象中(对象的属性只能是数字或字符串)。手动调用toString/toFixed/Join/String等方法时,也是为了转成字符串varm=Math.PI//=>Getpim.toFixed(2)=>'3.14'varary=[12,34,23];ary.join('+')='12+34+23'2。转换规则//=>要调用的方法:toString1->'1'[]->''[12]->'12'[12,23]->'12,23'(function(){}).toString()=>"function(){}"newDate().toString()=>"MonDec09201915:13:53GMT+0800(ChinaStandardTime)"...[Object]{name:'xxx'}->'[objectObject]'{}->'[objectObject]'无论是哪种普通对象,最后的结果都是一样的。将其他值转换为Boolean类型1.发生了什么——基于!/!!/Boolean等方法的转换——条件判断中的条件最后会转换为Boolean类型if(n){//=>转换n的值验证布尔的条件为真还是假}if('3px'+3){//=>首先计算表达式'3px3'的结果,将结果转换为布尔真,条件为真的。}alert(1)=>'1'2.转换规则**`只有"0/NaN/null/undefined/''"五个值转换为布尔false,其余为true`**特例:数学运算与字符串“+”拼接//=>当表达式中出现字符串时,为字符串拼接,否则为数学运算1+true=>2不是字符串作为数学运算,true变为1,所以就是2'1'+true=>'1true'字符串拼接[12]+10=>'1210'虽然现在看不到字符串,但是引用类型转换成数字,就会转换成astringfirst,所以它会变成一个字符Stringconcatenation({})+10=>"[objectObject]10"[]+10="10"{}+10=>10这个和上面没有关系,因为不是数学运算,也不是字符串拼接,是两部分代码{}代表一个代码块(块级作用域)+10是我们运算的严格写法:{};+10函数fn();+10=>10思考题:12+true+false+null+underfined+[]+'frontend'+null+underfined+[]+true=>"NaNfrontendnullundefinedtrue"解析:12+true=>1313+false=>1313+null=>1313+undefined=>NaNNaN+[]=>'NaN''NaN'+'front'=>'NaNfront'...'NaNfronttrueundefined'+[]=>'NaNfronttrueundefined'...=>'NaNfronttrueundefined'特例:“==”比较时,如果左右两边的数据类型不同,先转换为相同类型,比较对象==对象:不一定相同etc,因为对象对引用地址进行操作,地址不一样,不等于{name:'xxx'}=={name:'xxx'}=>false[]==[]=>false变量obj1={};变量obj2=obj1;obj1==obj2=>trueobject==number:对象转数字object==boolean:对象转数字,boolean转数字object==string:对象转数字,string转数字string==number:convertstringtonumberstring==boolean:bothconverttonumberboolean==number:convertbooleantonumber=========================>比较不同的情况是将其他值转换成数字,然后比较null==undefined:truenull===undefined:falsenull&undefined和其他值不等于NaN==NaN:falseNaN不等于任何人包括你自己================================>以上都需要特殊内存1==true=>true1==false=>false2==true=>false不要混淆规则,这里是把true改成数字1[]==[]=>false![]==[]=>true[]==false=>true//转为数字全为0[]==true=>false//[]转为数字全为0,true转为数字全为1![]==false=>true先计算![],C将数组转换为布尔否定=>false=>false==false![]==true=>false//true是1,![]是0