JavaScript基础知识-2
变量的定义
定义未赋值,和未定义的变量的区别：
定义未赋值 只是定义了变量,但是没有给变量进行赋值操作
var int1 ;
console.log(int1); // 未赋值 执行结果是 undefined
直接使用一个没有定义过的变量
console.log(int2); // 未定义 执行结果是 报错
NaN
NaN ：not a number ；不是一个数值
// NaN 表示存储的数据的数据类型,不是一个数值
// 如果有非数值参与计算,结果就是 NaN
var str1 = '北京';
var str2 = '上海';
// 两个变量中存储的数据,都不是数值
// 执行结果就是NaN
var res1 = str1 - str2;
console.log(res1); //控制台输出：NaN
// 有NaN参与,结果就是NaN
var res2 = 100 - str1;
console.log(res2); //控制台输出：NaN
// 如果是 + 加号
// 两侧都是数值,执行加法运算
// 有一个是字符串,就执行字符串拼接操作
var res3 = 100 + str1;
console.log(res3); //控制台输出：100北京
// 总结
// NaN虽然表示是一个非数字 , 但是一般是算术运算执行的结果
// 因此NaN 仍然是 数值类型
// 执行运算时 , 非加法运算 ,只要有NaN参与,执行结果都是NaN
// 如果是加法运算 , 有 NaN 执行 字符串拼接操作
// 都是数值执行 加法运算
// NaN 永远 不会等于 NaN NaN == NaN 执行结果是 false
// JavaScript的规定, NaN表示的是非数字, 但是这个非数字也是不同的
// 因此 NaN 不等于 NaN
// 两个NaN永远不可能相等
console.log( NaN == NaN ); //控制台输出：false
console.log ( '北京' - 100 == '北京' - 100 ); //控制台输出：false
// 比较的不是 '北京'-100 , 这个表达式 而是 '北京'-100 的结果
// 左侧 '北京'-100 结果是 NaN
// 右侧 '北京'-100 结果是 NaN
// 但是 NaN 不等于 NaN
console.log ( '北京' + 100 == '北京' + 100 ); //控制台输出：true
// 如果是加号,执行字符串拼接,结果就是 true
NaN == NaN 为什么是false
- NaN：指的是not a number，意味着不是一个数，但它的类型是number型，它用来表示是否属于number类型的一种状态：是或否，而不是一个确切的数值。
- NaN会在什么情况下出现，当一个表达式中存在不可转化的变量时，返回的就是NaN。
- NaN是除过数字的任意值，但不是确切的某一个值，就好比，A不是一个数字，B不是一个数字，但A不等于B，NaN代表的即是一个范围，故NaN不等于NaN。
字符串不能解析变量
在JavaScript中,单引号,双引号的字符串,都不能解析变量
你写的变量,只能显示为变量名称的字符串,不会显示为变量中存储的数值
方法1,使用字符串拼接方式
方法2,使用模板字符串,可以解析变量
模板字符串 使用的 是 反引号` `键盘上方 1 左侧的按钮
在模板字符串` `反引号中 使用 ${变量} 包裹变量,就可以解析变量数值了
// 字符串拼接和字符串解析变量 执行结果,没有区别,你爱用哪个用那个
var airPollution = 52 ;
console.log( '今天的空气污染是 : airPollution' ); //控制台输出：今天的空气污染是 : airPollution
// 字符串拼接方式
console.log( '今天的空气污染是 : ' + airPollution); //控制台输出：今天的空气污染是 : 52
// 模板字符串,也可以解析变量
// 1,使用反引号
// 2,使用 ${} 包裹变量
console.log( `今天的空气污染是 : ${airPollution}` ); //控制台输出：今天的空气污染是 : 52
JavaScript的3种调试方式
JavaScript中,变量存储的数据,有时,我们知道是什么,有时不清楚内容,需要输出查看
在 JavaScript中,有3种常用的查看调试方式
1, window.alert(‘内容’) — 弹出提示框
window.alert(‘beijing’);
2, document.write(‘内容’) — 在页面输出
document.write(‘北京’);
3, console.log(‘内容’) — 控制台输出 — 浏览器控制台 console 内容中
console.log(‘北京’); // 控制台输出是常用方式
数据类型的检测
-
在JavaScript中,数据类型的检测,使用 typeof() 方法 / 函数。
-
typeof(变量/数据) , 执行结果是变量中存储数据的数据类型。
-
typeof还有一种语法形式 typeof 空格 变量 但是这种语法形式不推荐使用,容易程序执行错误。
-
typeof 并不能非常准确的表示每一种数据类型。
-
一般是使用判断 布尔类型 数值类型 字符串类型 undefined类型；其他数据类型,我们之后有更加准确,但是复杂的判断方式。
-
所谓的 方法 / 函数 , 现在指的是,JavaScript给我们定义好的功能；我们直接使用就可以了；只要会用就可以。
-
这个所谓的函数,跟数学中的函数没有任何关系
// 整数,浮点数,NaN 执行结果都是 number var int1 = 100; var float1 = 100.123; console.log( typeof(int1) ); console.log( typeof(float1) ); console.log( typeof(NaN) ); // 布尔类型的执行结果是 boolean var bool1 = true; console.log( typeof(bool1) ); // 字符串类型的执行结果是 string var str1 = '北京'; console.log( typeof(str1) ); // undefined 执行结果 undefined console.log( typeof(undefined) ); // null 执行结果 object console.log( typeof(null) );
typeof( typeof(变量/数据) ); 结果为字符串 string
数据类型的转换
什么是数据类型的转化,为什么要有数据类型的转化
1）在 JavaScript 程序中 , 变量中存储的数据类型没有限制；也就是在变量中可以存储任何符合JavaScript语法规范的数据类型； 但是 在 JavaScript 程序的执行过程中,往往需要变量中存储的数值是某种特定的数据类型,别的数据类型不行；此时就需要进行数据类型的转化。
2）所谓的数据类型转化,就是将当前数据类型转化为其他数据类型
3）JavaScript中数据类型的转化,分为自动转化和强制转化
自动转化是计算机程序,自动完成的转化 – 自动转化原则至关重要,必须通过多练习,掌握
强制转化是程序员,强行完成的转化
例如去美国旅游,需要使用 美金 — 可以理解为一种数据类型；我们当前银行卡中存储的是 人民币 也是一种数据类型； 到了 美国 , 购物刷卡 , 银联自动将账户中的人民币 — 转化为美金来结算；这个转化 是银行自动完成的 ,是 自动转化。
自动转化不是任何时候都会发生的,只有特殊情况,才会发生
如果我们到 银行柜台 去 将人民币 换成 美金 ；这个转化 是我们人为强行完成的 , 是 强制转化 。
数据类型是将 当前类型的当前数值 转化为 对应类型的对应数值。
在计算机程序中,是数据数值的变化转化,而不能理解为相等的关系。
布尔类型的自动转换
其他数据类型,自动转化为布尔类型；在 执行 if 判断时 ,其他数据类型会自动转化为布尔类型。
其他类型转化为布尔类型的原则：
转化为 false : 0 ‘’ undefined null NaN 这五种情况转化为false
// 特别提醒 0.0 0.00000 都算是0
其他的所有 都会转化为 true
这里不是表示对错,是如果 0 要是 按照 布尔类型类执行转化 ,转化的结果是 false。
// if判断的基本语法
if(表达式){
执行程序
}else{
执行程序
}
if( false ){
console.log('真');
}else{
console.log('假');
}
// 0 转化为 false
// 如果 0 转化为 true 执行 if{} 输出的应该是是 字符串 转化为true
// 如果 0 转化为 false 执行 else{} 输出的应该是是 字符串 转化为false
// if 的 () 里, 只 接受你 输入 true 和 false 两个数值
// 如果 你在 if 的 ( ) 中 输入了 不是 true 或者 false 的内容
// if 程序 会自动的将你输入的其他数据 会变成 / 转化 为 true 或者 false
// 其中 0 ''空字符串 undefined null NaN 会变成 false
// if () 中 写什么都行 反正if 最终都会 给变成 true 或者 false
// true 就是 执行 if{} false 就执行 else{}
if(0){
console.log( '转化为true' );
}else{
console.log( '转化为false' );
}
// '' 空字符串 转化为 false
if(''){
console.log( '转化为true' );
}else{
console.log( '转化为false' );
}
// undefined 空字符串 转化为 false
if(undefined){
console.log( '转化为true' );
}else{
console.log( '转化为false' );
}
// null 空字符串 转化为 false
if(null){
console.log( '转化为true' );
}else{
console.log( '转化为false' );
}
// NaN 空字符串 转化为 false
if(NaN){
console.log( '转化为true' );
}else{
console.log( '转化为false' );
}
// 其他所有数据内容,都会转化为true
// 字符串空格
if(' '){
console.log( '转化为true' ); //控制台输出：转化为true
}else{
console.log( '转化为false' );
}
// 字符串0
if('0'){
console.log( '转化为true' ); //控制台输出：转化为true
}else{
console.log( '转化为false' );
}
// 字符串0.0
if('0.0'){
console.log( '转化为true' ); //控制台输出：转化为true
}else{
console.log( '转化为false' );
}
if(12<3){
console.log( '转化为true' );
}else{
console.log( '转化为false' );//控制台输出：转化为false
}
if(2==3){
console.log( '转化为true' );
}else{
console.log( '转化为false' );//控制台输出：转化为false
}
字符串的自动转化
其他类型自动转化为字符串
在 执行 字符串拼接 时, 会将其他数据类型转化为字符串类型
执行字符串拼接, 拼接符号 +号 两侧 应该都是 字符串类型
如果是其他类型 JavaScript程序,会自动转化为 字符串类型,再执行拼接
var str1 = '北京' + '上海';
// 转化原则
// 布尔值 true ---> 字符串 'true'
// 布尔值 false ---> 字符串 'fasle'
// undefined ---> 字符串 'undefined'
// unll ---> 字符串 'null'
// 数值 ---> 将数值解析转化为 对应的 纯数字的字符串
// 这里有三个特殊的转化
// 数组 ---> 将 [] 中的内容,转化为字符串的形式,进行拼接
// 对象 ---> 任何对象,任何内容,都会转化为 [object Object] 固定的内容形式
// 函数 ---> 将所有的程序代码,转化为字符串
var str2 = '北京' + true;
var str3 = '北京' + false;
var str4 = '北京' + undefined;
var str5 = '北京' + null;
var str6 = '北京' + 100;
var str7 = '北京' + 100.123;
var str8 = '北京' + 2e3; // 科学技术法,会解析为表示的数值,然后再拼接
console.log(str2); //控制台输出：北京true
console.log(str3); //北京false
console.log(str4); //北京undefined
console.log(str5); //北京null
console.log(str6); //北京100
console.log(str7); //北京100.123
console.log(str8); //北京2000
// 特殊1 数组
var str9 = '北京' + [1,2,3,4,5] ;
console.log(str9); //北京1,2,3,4,5
// 特殊2 对象
var str10 = '北京' + {name:'张三' , age:18 , sex:'男'} ;
console.log(str10); //北京[object Object]
// 特殊3 函数
var str11 = '北京' + function fun(){console.log(123)};
console.log(str11); //北京function fun(){console.log(123)}
// 其他类型转化为字符串
// 基本数据类型 / 简单数据类型
// 将 数据数值 直接转化为字符串 , 然后执行拼接操作
// 引用数据类型 / 复杂数据类型
// 数组 : 不要 [] 将数组的数据内容,转化为字符串,执行拼接操作
// 对象 : 任何的对象,都转化为 字符串 [object Object] , 执行拼接操作
// 函数 : 将所有函数的代码,都转化为字符串,执行拼接操作
数值的自动转换
其他类型自动转化为数值
在执行数学运算时 会触发数据类型的自动转化
转化原则：
- 布尔类型 : true —> 1
false —> 0
undefined : 转化为 NaN
null : 转化为 0 - 字符串 :
如果整个字符串,是纯数字字符串,或者符合科学计数法 —> 转化为对应的数值
如果字符串内有不符合数字规范的内容 —> 转化为 NaN - 数组,对象,函数：
如果是 + 加号 执行的是字符串拼接效果
按照这些数据类型转化为字符串的原则来转化
如果是 其他形式的运算 执行结果都是 NaN
var int1 = 100 - true;
var int2 = 100 - false;
var int3 = 100 - undefined;
var int4 = 100 - null;
console.log(int1); //99
console.log(int2); //100
console.log(int3); //NaN
console.log(int4); //100
// 字符串的转化结果
var int5 = 100 - '100'; // 整数字符串
var int6 = 100 - '90.123'; // 浮点数字符串
var int7 = 100 - '2e3'; // 科学计数法字符串
// 转化为对应的数值,参与运算
var int8 = 100 - '123abc'; // 包含不符合数字规范内容的字符串
// 转化为 NaN , 参与运算
// 任何有 NaN , 参与的运算,结果都是NaN
console.log(int5); //0
console.log(int6); //9.876999999999995
console.log(int7); //-1900
console.log(int8); //NaN
// 数组,对象,函数
console.log( 100 + [1,2,3,4,5] ); //1001,2,3,4,5
console.log( 100 + {name:'张三' , age:18} ); //100[object Object]
console.log( 100 + function fun(){console.log(123)} ); //100function fun(){console.log(123)}
console.log( 100 - [1,2,3,4,5] ); //NaN
console.log( 100 - {name:'张三' , age:18} ); //NaN
console.log( 100 - function fun(){console.log(123)} ); //NaN
布尔类型的强制转换
其他数据类型,强制转化为布尔类型
就是使用JavaScript中定义好的 方法/函数
Boolean( 数据/变量 )
转化原则与自动转化原则相同
false : 0 ‘’ undefined null NaN
true : 其他数据,都转化为true
Boolean() 这个方法 不会改变 变量中存储的原始数值
var int = 100;
// 将 int 中存储的数值100 ,转化为布尔值输出,转化结果是 true
console.log( Boolean(int) ); //true
// 使用 Boolean() 方法 转化 变量中存储的数值,但是不会改变变量中存储的数值
// 只是将变量中的数值,解析获取,再转化输出,不会改变变量中存储的内容
console.log( int ); //100
var a1 = 0;
console.log(Boolean(a1)); //false
console.log(a1)；//0
字符串类型的强制转换
其他类型强制转化为字符串类型
方法1 变量.toString(进制类型)
// 将数值强制转化为字符串,并且可以设定转化的进制
// .toString() 之前,不能直接写数值,必须是写成变量的形式
// 进制常用的数值是 2 8 16
// 可以设定的范围是 2 - 36 进制 10个数值+26个英文字母
// 最少是2进制,最多是36进制
var int = 100;
// 将int 中存储的 100 数值,按照二进制转化,并且以字符串的形式来输出
// 如果输出时, 第一个数值1 之前的 0 , 会不输出 , 对数值大小没有影响
console.log(int.toString(2)); //1100100
// 八进制
console.log(int.toString(8)); //144
// 十六进制
console.log(int.toString(16)); //64
// ()中没有输入,默认执行十进制
console.log(int.toString()); //100
// 进制范围是2-36
console.log(int.toString(9)); //121
console.log(int6.toString(36)); //2s
// 2, String( 变量 / 数据 )
// 将变量或者数据,转化为字符串
// 原则按照自动转化的原则来执行
// 不会改变变量中存储的原始数值
var int = 2e5;
console.log( String(int) ); //200000
console.log( int ); //200000
console.log( typeof(int) ); //number
// 字符串拼接时,会将其他数据类型自动转化为字符串
数字的强制转化
将其他数据类型强制转化为 数值类型
方法1 , Number(变量/数值)
将其他类型强制转化为数值类型,转化原则与自动转化选择相同
console.log( Number(true) ); // 1
console.log( Number(false) ); // 0
console.log( Number(null) ); // 0
console.log( Number(undefined) ); // NaN
console.log( Number('100') ); // 对应的数值
console.log( Number('100.123') ); // 对应的数值
console.log( Number('2e4') ); // 对应的数值
console.log( Number('123abc') ); // NaN
console.log( Number( [1,2,3,4,5] ) ); // NaN
console.log( Number( {name:'zhangsan'} ) ); // NaN
console.log( Number( function fun(){console.log('abc')} ) ); // NaN
2, parseInt(变量 / 数据)
是获取变量或者数据的整数部分
从数据的 左侧起 解析获取 整数内容
console.log( parseInt(true) ); // 都是 NaN
console.log( parseInt(false) );
console.log( parseInt(null) );
console.log( parseInt(undefined) );
console.log( parseInt( {name:'zhangsan'} ) );
console.log( parseInt( function fun(){console.log('abc')} ) );
// 数组执行,是获取 数值部分 也就是 没有 []的部分
// 1,2,3,4,5 整数部分是 1 1之后是逗号 逗号不是整数,之后的部分也就不算整数
// 获取第一个数值的整数部分,如果有就获取,如果没有,结果是NaN
console.log( parseInt( [1,2,3,4,5] ) ); // 结果是 1
console.log( parseInt( [null,2,3,4,5] ) ); // 结果是 NaN
// 如果是整数就直接获取,如果是浮点数,或者科学计数法,就获取整数部分
console.log( parseInt( 100 ) ); // 整数是直接获取
console.log( parseInt( 0.0123 ) ); // 浮点数是获取整数部分
console.log( parseInt( 3.123456e3 ) ); // 科学计数法是解析之后,获取整数部分
// 字符串不同了
// 如果是纯数字的字符串
console.log( parseInt( '100' ) ); // 与数字的结果相同
console.log( parseInt( '0.0123' ) ); // 与数字的结果相同
console.log( parseInt( '3.123456e3' ) );
console.log( parseInt( '3abc' ) );
console.log( parseInt( '3.123' ) );
// 现在是一个字符串,从左侧开始,找整数部分,第一个是3,第二个是点,点不是整数,因此整数部分就是3
// 3 , parseFloat( 变量 / 数值 )
// 获取浮点数部分
console.log( parseFloat(true) ); // 都是 NaN
console.log( parseFloat(false) );
console.log( parseFloat(null) );
console.log( parseFloat(undefined) );
console.log( parseFloat( {name:'zhangsan'} ) );
console.log( parseFloat( function fun(){console.log('abc')} ) );
// 数值
// 整数,浮点数,都会完整获取
console.log( parseFloat(100) );
console.log( parseFloat(100.1234) );
console.log( parseFloat(1.234567e3) );
// 关键是字符串
// 从字符串的左侧起 解析 符合浮点数的部分
console.log( parseFloat( '100' ) ); // 与数字的结果相同
console.log( parseFloat( '0.0123' ) ); // 与数字的结果相同
console.log( parseFloat( '3.123456e3' ) ); // 科学技术法会解析
console.log( parseFloat( '3.1223abc' ) );
console.log( parseFloat( '3.123' ) );
总结
1 , undefined null true false NaN
// 虽然都是 字符 但是他们都是 一种数值
// 不是字符串
// 执行 + 加号 运算时 执行的是 加法运算
// '' "" 只有的带引号的内容,才是 字符串 才会执行字符串拼接
// NaN + NaN ? NaN
// 因为 NaN 是数值 执行的是 加法运算
// 结果是 有 NaN 参与的算数运算,结果都是 NaN
// 2 , 什么是转化
// 将 一种 类型的数值 变成 另一种类型的数值
// 用 100元 购买 一块巧克力
// 将 100元 转化为 巧克力
// 不是 100元 等于 巧克力
// 0 转化为 false 不是 0 等于 false
// 自动转化: 计算机程序执行执行的
// 转化为布尔类型 : if() 中执行
// false : 0 '' undefined null NaN 就这5个是false
// true : 其他所有的数据,都是转化为 true
// 转化为字符串 : 字符串拼接时
// 基本数据类型 直接 转化为 字符串形式
// 引用数据类型
// 数组 : 将 [] 内的数据,转化为字符串
// 对象 : 一律转化为 [object Object]
// 函数 : 将函数的所有内容,都转化为字符串
// 转化为数值 : 执行数学运算时
// 布尔类型 : ture--->1 false--->0
// undefined : NaN
// null : 0
// 字符串 : 是纯数字的,会转化为对应的数值
// 有不符合数值规范的,转化为 NaN
// 强制转化 : 程序员人为执行的转化
// 转化为布尔类型
// Boolean(数值 / 变量)
// 原则就是 自动转化原则
// 不会改变,变量中存储的数值
// 转化为字符串
// + 字符串拼接
// String(变量 / 数据)
// 原则与自动转化原则相同
// 不会改变变量中存储的数据
// 变量.toString(进制)
// 将数值,按照进制转化为对应的字符串输出
// 进制范围是 2-36
// 转化为数值
// Number(数值/变量)
// 与自动转化原则相同
// 不会改变,变量中存储的数值
// parseInt(数值/变量)
// 从数据的左侧起 获取数据的整数部分
// 布尔类型 undefined null 对象 函数 ---> NaN
// 数组 是获取数组中 第一个单元的 整数部分
// 有整数部分,执行结果就是这个整数部分的内容
// 没有整数部分,执行结果是 NaN
// 数值 整数正常获取 浮点数获取小数点之前的部分
// 字符串 整数,是正常获取
// 浮点数,获取整数部分,也就是小数点之前
// 科学计数法 获取 e字符串之前的整数部分
// 带有不符合数值规范的内容,获取从左侧起,符合整数规范的部分
// parseFloat(数值/变量)
// 从数据的左侧起 获取数据的整数部分
// 布尔类型 undefined null 对象 函数 ---> NaN
// 数组 是获取数组中 第一个单元的 整数部分
// 有整数部分,执行结果就是这个整数部分的内容
// 没有整数部分,执行结果是 NaN
// 数值 整数,浮点数都是正常获取
// 字符串 整数,是正常获取
// 浮点数,是正常获取浮点数部分
// 科学计数法 会解析成浮点数来获取结果
// 带有不符合数值规范的内容,获取从左侧起,符合整数规范的部分