JavaScript-2

1.数据类型

  • 为什么需要数据类型

在计算机中不同的数据需要的存储空间不同,为了便于把数据分成所需内存大小不同的数据,充分利用存储空间,于是定义了不同的数据类型

  • 变量的数据类型

变量的数据类型决定了如何将代表这些值位存储到计算机中。JavaScript是一种弱类型或者说是动态类型,这意味着不用提前声明变量的类型,在程序运行的过程中,类型会被自动确定。

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7         /**
 8          * 数据类型其实就是字面量类型
 9          * JS变量数据类型是只有在程序运行过程中,根据等号右边的值来确定的
10          * JS是动态语言,变量的数据类型是可以变化的
11          * 在JS中一共有6种数据类型    默认值
12          *         String 字符串        ""
13          *         Number 数字型            0
14          *         Boolean 布尔值        false
15          *         Null 空值            null
16          *         Undefined 未定义        undefined
17          *         Object 对象
18          * 
19          * 其中String、Number、Boolean、Null、Undefined属于基本数据类型(简单数据类型)
20          * Object属于引用数据类型(复杂数据类型)
21          */
22         </script>
23     </head>
24     <body>
25     </body>
26 </html>
  • 字符串型

字符串型可以是引号中的任意文本,其双引号"语法为"和单引号''(推荐使用'')

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script>
 7             var str = '努力学习JS';
 8             console.log(str);
 9             /* JS可以通过单引号嵌套双引号,或者用双引号嵌套单引号
10              * 外双内单,外单内双
11              */
12             str = '今天"星期五"';
13             console.log(str)
14             /* 字符串转义字符 都是用\开头,但是这些转义文字 写到引号里
15                 转义符                解释说明
16                 \n                    换行符,n是newline的意思
17                 \\                    斜杠\
18                 \'                    '单引号
19                 \"                    "双引号
20                 \t                    tab缩进
21                 \b                    空格,b是blank的意思
22             */
23            /* 字符串长度及拼接*/
24            //1.检测获取字符串的长度
25            console.log(str.length);//7
26            //2.字符串的拼接+,只要存在字符串型和其他类型的数据进行拼接其结果一定返回字符串
27            //口诀:数值相加,字符相连
28            console.log('沙漠'+'骆驼');
29            //变量和字符串相连口诀:引引加加
30            var temper = 18;
31            console.log('今天'+temper+'');
32         </script>
33     </head>
34     <body>
35     </body>
36 </html>
  • 数值类型
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script>
 7             var num = 10;//数字型
 8             var PI = 3.14;//数字型
 9             //1.八进制,我们程序中数字前面加0表示八进制
10             var num1 = 010;
11             console.log(num1);//8
12             //2.十六进制,数字前面加0x表示十六进制
13             var sum2 = 0x010;
14             console.log(sum2);//16
15             //3.数字型的最大值
16             console.log(Number.MAX_VALUE);
17             //4.数字型的最小值
18             console.log(Number.MIN_VALUE);
19             //5.无穷大
20             console.log(Infinity);//Infinity
21             //6.无穷小
22             console.log(-Infinity);//-Infinity
23             //7.NaN Not a Number,代表一个非数字
24             console.log(NaN);//NaN
25             //8.isNaN()这个方法来判断非数字,如果是不是数字返回true,如果是数字返回false
26             console.log(isNaN(3));//false
27             console.log(isNaN(NaN));//true
28         </script>
29     </head>
30     <body>
31     </body>
32 </html>
  • 布尔值
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7             /**
 8              * Boolean 布尔值
 9              * 布尔值只有两个,主要来做逻辑判断
10              *         真:true
11              *         假:false
12              *         使用typeof 检测boolean值时,会返回boolean
13              */
14             var boolean = true;//布尔型
15             var flag = false;//布尔型
16             //true参与加法运算当1来看
17             console.log(boolean + 1);//2
18             //false参与加法运算当0来看
19             console.log(flag + 1);//1
20             console.log(typeof boolean);
21         </script>
22     </head>
23     <body>
24     </body>
25 </html>
  • Null和Undefined
  1. Undefind:声明变量没有赋值,存在一个默认值Undefind,进行相加时会转化为字符串undefined
  2. Unll:专门用来表示一个为空的对象
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7         /* 
 8            Undefined类型值只有一个,就是undefined
 9            当声明一个变量但不给其赋值时,它的类型就是undefined
10            使用typeof检查一个undefined值时,会返回undefined
11          */
12         var b;
13         console.log(b);//undefined
14         console.log("我是"+b);//我是undefined
15         //undefined和数字相加,结果是NaN
16         console.log(b+1);//NaN
17         /**
18          * Null类型的值只有一个,就是null
19          * null这个值专门来表示一个为空的对象
20          * 使用typeof检查一个null值时,会返回Object
21          */
22         var a = null;
23         console.log(typeof a);//object
24         console.log(a);//null
25         console.log("我是"+a);//我是null
26         console.log(a+1);//1
27         </script>
28     </head>
29     <body>
30     </body>
31 </html>

2.获取变量数据类型

  • typeof
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script>
 7             var num = 10;
 8             console.log(typeof num);//number
 9             var str = "str";
10             console.log(typeof str);//string
11             var flag = true;
12             console.log(typeof flag);//boolean
13             var a = undefined;
14             console.log(typeof a);//undefined
15             var b = null;
16             console.log(typeof b);//object
17             //prompt取过来的值是字符型的
18             var age = prompt("请输入年龄:");
19             console.log(typeof age);//string
20         </script>
21     </head>
22     <body>
23     </body>
24 </html>
  • 字面量

字面量是在源代码中国一个固定值的表示法,通俗来说,就是字面量如何表示这个值

数字字面量 8,9,10
字符串字面量 '前端','JavaScript','ECMAScript'
布尔字面量 true,false

 

3.数字类型转换

把一种数据类型的变量转换为另外一种数据类型

  • 转换为字符串类型
方式 说明 案例
toString() 转成字符串

var num = 1;

console.log(num.toStrin());

String()强制转换 转成字符串

var num = 1;

console.log(String(num));

加号拼接字符串 和字符串拼接的结果都是字符串

var num = 1;

console.log(num+"");

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script>
 7             var num = 10;
 8             console.log(typeof num);//number
 9             var str = "str";
10             console.log(typeof str);//string
11             var flag = true;
12             console.log(typeof flag);//boolean
13             var a = undefined;
14             console.log(typeof a);//undefined
15             var b = null;
16             console.log(typeof b);//object
17             //prompt取过来的值是字符型的
18             var age = prompt("请输入年龄:");
19             console.log(typeof age);//string
20         </script>
21     </head>
22     <body>
23     </body>
24 </html>
  • 转换为数字型
方式 说明 案例
parseInt(string)函数 将string类型转换成整数数值型 parseInt("56")
parseFloat(string)函数 将string类型转换成浮点数值型 parseFloat('3.14')
Number()强制转换函数 将string类型转换为数值型 Number('56')
js隐式转换(- * /) 利用算数运算隐式转换为数值型 '12'-0
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7         /**
 8          * 将其他数据类型转换为Number
 9          * 转换方式一:
10          *         使用Number()函数
11          *         -字符串-->数字
12          *             1.如果是纯数字的字符串,则直接将其转换为数字
13          *             2.如果字符串中有非数字内容,则转换为NaN
14          *             3.如果字符串是一个空串或是一个全为空格的字符串,则转换为0
15          *         -boolean-->数字
16          *             1.true转成1
17          *             2.false转成0
18          *         -Null-->数字        0
19          *         -Undefined-->数字    NaN
20          * 转换方式二:
21          *         -这种方式专门对付字符串
22          *         -parseInt()把一个字符串转成一个整数
23          *         -parseFloat()把一个字符串转成一个浮点数
24          *         如果对非String使用parseInt()或parseFloat()
25          *         它会先转成String然后再操作
26          * 转换方式三:
27          *         -利用算术运算符实现数据类型的转换
28          */
29         
30         //1.parseInt(变量)可以把字符型的转换为数字型,得到的是整数
31         console.log(parseInt('3.14'));//3
32         console.log(parseInt('3.94'));//3
33         console.log(parseInt('120px'));//120
34         console.log(parseInt('name56'));//NaN
35         //2.parseFloat(变量)可以把字符型的转换为数字型,得到的是小数浮点数
36         console.log(parseFloat('3.14'));
37         console.log(parseFloat('120px'));//120
38         console.log(parseFloat('name56'));//NaN
39         //3.利用Number(变量)
40         var str = '123';
41         console.log(Number(str));//123
42         //4.利用算数运算 - * / 隐式转换
43         console.log('12'-0);
44         console.log('12'*1);
45         console.log('12'/1);
46         </script>
47     </head>
48     <body>
49     </body>
50 </html>
  • 强制转换Boolean
方式 说明 案例
Boolean() 其他类型转成布尔值 Boolean('true');

注意:代表空、否定的值都会被转换为false,如''、0、NaN、null、undefined

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7         /**
 8          * 将其他类型的数据转换为Boolean
 9          *         -使用Boolean()函数
10          *             -数字-->布尔
11          *                 除了0和null其他都是true
12          *             -字符串-->布尔
13          *                 除了空串其他都是true
14          *             -null和undefined都是false
15          *             -对象也会转换为true
16          */
17         var a = 123;//true
18         var a = -123;//true
19         var a= 0;//false
20         var a = null;//false
21         var a = Infinity;//true
22         //调用Boolean()函数将a转换为布尔值
23         a = Boolean(a);
24         console.log(typeof a);
25         console.log(a);
26         var b = ""
27         b = Boolean(b);
28         console.log(typeof b);
29         console.log(b);
30         </script>
31     </head>
32     <body>
33     </body>
34 </html>

4.解释型语言和编译型语言

  1. 计算机不能直接理解除机器语言外的任何语言,所以必须把程序员所写的程序语言翻译成机器语言才能执行程序。程序语言翻译成机器语言的工具被称为翻译器。
    • 翻译器有两种方式:一个是编译,另外一个是解释,两种方式之间的区别在于翻译的时间点不同
    • 编译器在代码执行之前编译,生成中间代码文件
    • 解释器是在运行进行时及时解释,并立即执行(当编译器以解释方式运行时,也成为解释器)

5.标识符、关键字和保留字

  1. 标识符:开发人员为变量、属性、函数、参数取的名字
  2. 关键字:是指JS本身已经使用了的字,不能再用它们充当变量名或方法名
  3. 保留字:实际上就是预留的关键字,同样不能再用它们充当变量名或方法名
posted @ 2022-03-04 18:06  Miraitowa56  阅读(27)  评论(0)    收藏  举报