(一)Javascript从变量至类型转化(含练习)

最新推荐文章于 2022-09-06 13:52:32 发布

Seeker-Joseph

最新推荐文章于 2022-09-06 13:52:32 发布

阅读量242

点赞数 1

分类专栏： JS学习笔记文章标签： javascript

本文链接：https://blog.csdn.net/weixin_51458883/article/details/114852562

版权

JS学习笔记专栏收录该内容

11 篇文章 0 订阅

订阅专栏

（一）Javascript从变量至类型转化(含练习)

变量（variable）

变量声明

声明、赋值分解
单一var

命明规则

变量名开头是：英文字母、_、$
变量名可以包含英文字母、_、$、数字
不可以使用系统的关键字、保留字作为变量名

值类型——数据类型

不可改变的原始值（栈stack数据）
- 五大类
- Number，String，Boolean(布尔)，undefined，null
  - 声明变量为赋值，则改变量为undefined
引用值（堆heap数据）
- array Object function …date RegExp

JS语法基本规则

行结束后面加“；”
js语法错误会引起后续代码终止，但不会影响其他js代码块
- 错误分为两种
  1. 低级错误语法解析错误
    - 不会进行解释
      - 比如：符号打错，变量未声明(但有一种也仅有一种特殊情况，详细参考Type of)
  2. 逻辑错误(标准错误，情有可原)
    - 会进行解释，但在错误一行会中止，这一块中下面的代码不会再执行，但下面一块还是会执行
- 书写格式要规范，“= + / -”两边都应该有空格

JS运算符

JS基本运算符

“+”，“-”，“*”，“/”,"%","+=","++","="

数学运算、字符串连接（“a”+“b” 得到“ab”）
任何数据类型加字符串都等于字符串（“a”+1+1得到“a11”）
- 1+1+“a”+1+1得到 “2a11”
“-” “*” “/”

0/1=0 ,1/0=infinity,0/0=NaN ,1%5=1

“++”、“+=”
- var a = 1；var b = a ++ + 1; 输出b为2，a++ + 1得到的值是2赋给了b，最后a++
- b += 10+5 等价于 b = b + 15
赋值的顺序：自右向左。计算的顺序：自左向右
一个交换数值的方法

   var a = 123;
   var b = 234;
   	a = a + b;
   	b = a - b;
   	a = a - b;

比较元素符

“>” “<” “==” “>=” “<=” “!=”
- 特例 var a = NaN == NaN; a的值为false，其他的相同都为ture
比较的结果为boolean值(true or false)

逻辑运算符

“&&” “||” “!”
- “&&” 运算符(”与“运算符)
  - 先看第一表达式转换成布尔值的结果，如果为真，那么它会看第二个表达式转换为布尔值的结果（这里指的是多次与运算），然后如果只有两个表达式，前面为真，就可以返回后面表达式的值
    - var a = 1 && 0； a 的值为0
    - var a = NaN && 5; a 的值为 NaN
    - var a = 2 && 2 && null &&7 ; a 的值为 null
    - var a =7 && 9+12 ； a 的值为21
    - 短路语句(类似if作用)。 2 > 1 && document.write(‘Joseph’);会输出Joseph
    - 单单一个 & 则是二进制中的与运算比如 1 & 3实质为 01 和 11 的比较，得到结果为01，即1
  - 运算结果为真实的值
- 被认定为false的值
- undefined，null，NaN，""，0，fasle ==>false

"||"运算符

一真即返真，全假返最后

一般用来写兼容

  div.onclick = function (e) {
  var event = e || window.event;
  }
  //后面学到事件可更详细说明

“!”
- 先转化为布尔值再取反，值只有ture or false；
  - 比如
```
console.log(!!"");
//这里得到的结果是false
//""表示的值为false
```
- 一般想让一个值变为布尔值，对其取两次反即可

JS条件语句和循环语句(与C大体上接近,if,while,swtich)

switch中比较不同的地方是：swtich(n)中的n可以取字符等，还有可以耦合

var n;
switch(n){
	case "Monday":
	case "Tuesday":
	case "Wednesday":
		console.log("workingday");
		break;
	case "Sunday":
		console.log(restingday);
		break;
}

编译形式

- 面向过程（C）
- 面向对象
- Javascript既是面向对象又是面向过程的

Type of

作用：判断改变量的类型

返回的值有6个：number，string，boolean，object(对象)，undefined，function(函数)

会返回object的有

数组


var arr = [2,1,undefined,"abc",null];
	console.log(typeof arr + ":" + arr[3]);
//这里得到的结果是object:abc

var arr = [2,1,undefined,"abc",null];
	console.log(typeof arr[3] + ":" + arr[3]);
//这里得到的结果是string:abc

var arr = [2,1,undefined,"abc",null];
console.log(typeof arr[3] + ":" + arr[3]);
//这里得到的结果是object:abc
//因为null本身的类型就是object

对象

     var wei = {
     	laseName : "JUN",
     	age : 19,
     	sex : undefined
     }
     
     console.log(wei.age);
 //wei为一个对象

null(用于占位)
更多即将补充…

一种特殊情况(当且仅当只有这种情况是，未定义的变量不报错)

console.log(typeof(a));
 //此处的a未被声明
 //这里不会报错，而console中会出现undefined
 
 //一个大厂面试题
console.log(typeof(typeof a));
 //这里得到的结果是string
 
alert(typeof(typeof a) + ":" + typeof a);
 //这里弹出框显示的是string:undefined

考点：typeof 返回的六个值的类型实质上都是字符串

类型转换

显式类型转换

Number（mix）

  var num = Number("123");
  console.log(typeof(num)+":"+ num);
  //得到 number：123
  
  var num = Number("123abc");
  console.log(typeof(num)+":"+ num);
  //得到NaN
  
  //需要记住的特例
  //null会转化为数字0，undefined会转化为NaN,true为1，false为0

parseInt(string,radix)

会把带有小数的数字去除小数位

格式

var num = parseInt("3",2);
console.log(typeof num +":"+ num);
//先将字符"3"转化为3，后面表示他是什么这个输入的值是什么进制，这里指二进制3转化为10进制
//但由于2进制中没3，不合法，所以这里控制台里的值是number:NaN

var num = parseInt("123abc");
console.log(typeof num +":"+ num);
/* 这里不会是NaN，而是123，有一个砍断原则，遇到第一个非数字的即砍断，如果是abc123，第一个遇到的是非数字，所以num=="";这是一个number:NaN */

与Number不同的是，这里的true和false不会变为数字，而是NaN

parseFloat(string)

(砍断原则)与2.parseInt相似，只不过会保留小数点，遇到第二个小数点或者第一个非数字的即砍断

var num = parseFloat("3.15.5");
      console.log(typeof num + ":" + num);
//这里得到结果是number:3.15，因为字符串先利用砍断原则将其变成3.15数字类型

var num = parseFloat(3.15.5);
      console.log(typeof num + ":" + num);
//这里会报错，因为3.15.5没有这种类型的数字写法

String(mix)

将输入的都转换为字符串

var demo = undefined;
var num = String(demo);
	console.log(typeof num +":"+ num);
//这里的值是 string:undefined;
var demo = abc;
var num = String(demo);
     	console.log(typeof num +":"+ num);
     //这里会报错，错在第五行，如果表示字符串，应该要加双引号

toString(radis)

作用和4.String差不多，用法不同
radix可写可不写，用法是先将输入demo的数字转化为radix所定义的进制，计算出来后再把这个数字变为字符串
实现不同进制之间的转换可以利用与parseInt相结合的方法，如代码第11~15行

var demo = "abc";
var num = demo.toString();
	console.log(typeof num +":"+ num);
//这里的结果是string:abc

var demo = "16";
var num = demo.toString(16);
	console.log(typeof num +":"+ num);
//这里的结果是string:10

//二进制到十六进制的转换(本质是二转10，10转16)
var num = 10000;
var test = parseInt(num,2);
	console.log(typeof(test.toString(16)) +":"+ test.toString(16));
//这里得到的值为string:10,如果typeof后面是num或者test，则值是number:10

Boolean()
- 布尔值，要么是true 要么是false。

被认定为false的值有：undefined，null，NaN，""，0

var num = Boolean(123);
	console.log(typeof num +":"+ num);
//这里的结果是 boolean:true

隐式类型

isNaN()

解释：括号中的值实质上是先进行显式Number转化，转化后再判断是不是NaN
这里得到值要么是true要么是false，表示是NaN，或者不是NaN

var num = isNaN(123);
	console.log(typeof num +":"+ num);
//这里得到的结果：boolean:false

var num = isNaN(null);
      console.log(typeof num + ":" + num);
//这里得到的结果：boolean:false
//注意要与显式类型转化Number结合起来看，因为null转化后是0，他不是NaN

var num = isNaN(undefined);
      console.log(typeof num + ":" + num);
//这里得到的结果是：boolean:true


var num = isNaN("123abc");
      console.log(typeof num + ":" + num);
//这里得到的结果是：boolean:true

“++”/"-- " “+”/"-" (一元正负)
- 关于++/–
- 解释：同样先是将变量隐式的进行Number计算，再进行进行自增，得到数字类型
- ```
var a = "123" ;
a++;
	console.log(typeof a+ ":" + a);
//这里的结果是：number:124

var a = null;
a++;
	console.log(typeof a + ":" + a);
//这里的结果是：number:1
```
- 关于 + 和 -
- 解释：这里指的是正负号，作用与上面大致相同，不同在于这里改变符号

“+”（这里指的是加号）

解释：这里得出来的类型是number,对加号两边的数进行Number隐式转化，但是注意含字母的字符串不会转化为NaN
但是注意，加号两边只要有一边是字符串，整个类型都变为字符串

var num = null + 2;
	console.log(typeof num + ":" + num);
//这里出来的结果是number:2

var num = "abc123" + 2;
	console.log(typeof num + ":" + num);
//这里出来的结果是string:abc1232

var num =5 + 5 + "abc123" + 2;
	console.log(typeof num + ":" + num);
//这里出来的结果是string:10abc1232

var num = undefined + 2;
	console.log(typeof num + ":" + num);
//这里出来的结果是number:NaN

var num = "" + 2;
	console.log(typeof num + ":" + num);
//这里出来的结果是string:2

“-”, “%”, “*”, “/”

解释：这里与加号不同，它只能将符号两边数据进行Number隐式转化后进行计算，得到的类型也只能是number类型

var num = 1 * "1";
	console.log(typeof num + ":" + num);
//这里得到的结果是number:1

var num = 1 * "132abc";
	console.log(typeof num + ":" + num);
//这里得到的结果是number:NaN

“&&”，"||"，"！"

解释：这里得到的值联系上文js基本运算符运算原则，得到的类型根据所得到的值决定

var num = 1 && 0;
	console.log(typeof(num) + ":" + num);
//这里的结果是number:0

var num = 0 && "abc";
	console.log(typeof(num) + ":" + num);
//这里的结果是number:0

var num = "29" && "abc";
	console.log(typeof(num) + ":" + num);
//这里的结果是string:abc

var num = 2 && 2 && null && 7;
	console.log(typeof(num) + ":" + num);
//这里的结果是object:null
//---------------------------------------------------
 var num = 2 || "ad" || null && 7;
	console.log(typeof(num) + ":" + num);
//这里的结果是number:2

!
解释：这里先对数据进行布尔运算（注意前面提到的为false的六个数据），返回true of false，返回的类型是布尔类型

var num = !2;
	console.log(typeof(num) + ":" + num);
//这里得到的结果是boolean:false

“>”,“<”,“>=”,"<="

解释：这里得到的类型为布尔类型，但会先对两边数据进行Number隐式转化再进行比较
注意：这里存在特例

var num = 1 > "2";
	console.log(typeof(num) + ":" + num);
//这里得到的结果是boolean:false

var num = false > true;
	console.log(typeof(num) + ":" + num);
//这里得到的结果是boolean:false
//本质是判断0是否大于1

var num = "false" > "true";
	console.log(typeof(num) + ":" + num);
//这里得到的结果是boolean:false
//本质是判断ASCII码
//---------------------------------
//特例:
var num = undefined > 0;
	console.log(typeof(num) + ":" + num);
var num = undefined == 0;
	console.log(typeof(num) + ":" + num);
var num = undefined < 0;
	console.log(typeof(num) + ":" + num);
//这里的结果都是boolean:false
var num = null > 0;
	console.log(typeof(num) + ":" + num);
var num = null == 0;
	console.log(typeof(num) + ":" + num);
var num = null < 0;
	console.log(typeof(num) + ":" + num);
//这里的结果同样都是boolean:false

//这是两个最特殊的情况，而
var num = null == undefined;
	console.log(typeof(num) + ":" + num);
//这里的结果是boolean:true

“==”,"!="

解释：这里同样会对数据进行Number的隐式转化，再进行判断得到的值是true 或者 false，得到的类型自然也是布尔类型
注意：注意NaN这个特例，NaN是非数，和谁得到的结果都是false，就算是NaN == NaN也是false

var num = 1 == "1";
	console.log(typeof(num) + ":" + num);
//这里得到的结果是boolean:true

var num = 12 == "1"+"2";
	console.log(typeof(num) + ":" + num);
//这里得到的结果是boolean:false

var num = undefined != null;
	console.log(typeof(num) + ":" + num);
//这里得到的结果是boolean:false
//这里与上面第六点说的最特殊的情况结合

var num = NaN != NaN;
	console.log(typeof(num) + ":" + num);
//这里得到的结果是boolean:true

不发生绝对类型转化的” = = =“和”!= = “

解释：绝对等于和绝对不等于，这里严格按照格式判断，得到的类型也是布尔类型

var num = 1 === true ;
	console.log(typeof(num) + ";" + num);
//这里得到的结果是boolean:false

var num = null === undefined ;
	console.log(typeof(num) + ";" + num);
//这里得到的结果是boolean:false

关于类型转换的练习

//未定义a时，求下面的值
alert(typeof(a));
alert(typeof(undefined));
alert(typeof(NaN));
alert(typeof(null));
//当定义 var a = "123abc";
alert(typeof(+a));
alert(typeof(!!a));
alert(typeof(a + ""));

alert(1 == "1");
alert(NaN == NaN);
alert(NaN == undefined);
alert("11" + 11);
alert(1 === "1");
alert(parseInt("123abc"));

var num = 123123.345789;
alert(num.toFixed(3));
//此处时科学计数法，保留小数点后三位，此处有四舍五入的原则

//--------------------------------------------------

/* 答案：
	undefined ; undefined ; number ; object
	number ; boolean ; string ;
	true ; false ; false ; 1111 ; false ;123

Seeker-Joseph

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
(一)Javascript从变量至类型转化(含练习)

（一）Javascript从变量至类型转化(含练习)变量（variable）变量声明声明、赋值分解单一var命明规则变量名开头是：英文字母、_、$变量名可以包含英文字母、_、$、数字不可以使用系统的关键字、保留字作为变量名值类型——数据类型不可改变的原始值（栈stack数据）五大类Number，String，Boolean(布尔)，undefined，null声明变量为赋值，则改变量为undefined引用值（堆heap数据）array Object f
复制链接

扫一扫