JavaScript——基础语法（数据类型以及转换、操作符）

var str = ‘my name is andy’;

console.log(str.length);//输出为15

• 字符串拼接：多个字符串之间可以使用+进行拼接，其拼接方式为字符串+任何类型=拼接之后的新字符串；拼接前会把与字符串相加的任何类型转成字符串，再拼接成一个新的字符串； 例如：

console.log(‘沙漠’ + ‘骆驼’);//沙漠骆驼

console.log(‘pink’ + 18);//

console.log(‘pink’ + true);//pinktrue

console.log(12 + 12);//24

console.log(‘12’ + 12);//1212

1·2·3 布尔值类型

布尔类型有两个值：true和false，其中true表示真（对），而false表示假（错）。

布尔型和数字型相加的时候，true的值为1，false的值为0。

例如：

console.log(true + 1);//等于2

console.log(false + 1);//等于1

1·2·4 Undefined

一个声明没有被赋值的变量会有一个默认值undefined（如果进行相连或者相加时，注意结果）

例如：

var str;

console.log(str);//输出undefined

var varible = undefined;

console.log(varible + ‘pink’);

//输出undefinedpink

console.log(varible + 1); //输出NaN

1·2·5 Null

一个声明变量给null值，里面存的值为空。

例如：

var space = null;

console.log(space + ‘pink’);

//输出nullpink

console.log(space + 1); //输出1

1·3数据类型的转换

---

数据类型的转换：使用表单、prompt获取过来的数据默认是字符串类型的，此时就不能直接简单的进行加法运算，而需要转换变量的数据类型。通俗来说，就是把一种数据类型的变量转换成另外一种数据类型。

通常会实现3种方式的转换：

1、转换为字符串类型

2、转换为数字型

3、转换为布尔型

1·3·1 转换为字符串类型

方式、说明、案例

1、变量名.toString();转成字符串

案例：

var num = 10;

var str = num.toString();

2、String()强制转换;转换成字符串

案例：

console.log(String(num));

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

案例：

console.log(num + ‘’);

注意：

• toString()和String()使用方式不一样。

1·3·2 转换为数字型

方式、说明、案例

1、parselnt(string)函数；将string类型转换成整数数值型（重点）

案例：

console.log(parseInt(‘3.14’));//输出3 取整数

console.log(parseInt(‘3.96’)); //输出3

console.log(parseInt(‘120px’)); //120 会去掉px单位

console.log(parseInt(‘rem120px’)); //输出NaN

2、parseFloat(string)函数；将string类型转换成浮点数数值型（重点）

案例：

console.log(parseFloat(‘3.14’));//输出3.14

console.log(parseFloat(‘120px’));//输出120

3、Number()强制转换函数；将string类型转换成数值型

案例：

var str = ‘123’;

console.log(Number(str));

console.log(Number(‘12’));

4、js隐式转换（- * /）；利用算术运算隐式转换为数值型

案例：

console.log(‘12’ - 0);

console.log(‘123’ - ‘120’);

console.log(‘123’ * 1);

注意：

1. parseInt和parseFloat单词的大小写

2. 隐式转换是我们在进行算数运算的时候，JS自动转换了数据类型。

1·3·3 转换为布尔型

方式、说明、案例

1、Boolean()函数；其他类型转换成布尔值。

案例：

console.log(Boolean(‘’)); //false

console.log(Boolean(0)); //false

console.log(Boolean(NaN)); //false

console.log(Boolean(null)); //false

console.log(Boolean(undefined)); //false

console.log(Boolean(‘123’)); //true

console.log(Boolean(‘你好吗’)); //true

console.log(Boolean(‘我很好’)); //true

注意：

1. 代表空、否定的值会被转换为false，如 ‘’、0、NaN、null、undefined

2. 其余值都会被转换为true

二、操作符

=====

运算符也被称为操作符，是用于实现赋值、比较和执行算术运算等功能的符号。

JavaScript中常用的运算符有：

1】算数运算符

2】递增和递减运算符

3】比较运算符

4】逻辑运算符

5】赋值运算符

2·1 算术运算符

---

概念：算术运算使用的符号，用于执行两个变量或值的算术运算。

运算符、描述、实例：

1】+；加；10+20=30

2】- ；减；10-20=-10

3】* ；乘；10*20=200

4】/ ；除；10/20=0.5

5】%；取余数（取模）；

返回除法的余数9%2=1

注意：

1. 浮点数的精度问题：浮点数值的最高精度是17位小数，但在进行算术计算时其精确度远远不如整数。

2. 不要直接判断两个浮点数是否相等！

表达式和返回值：

1】表达式：是由数字、运算符、变量等以能求得数值的有意义排列方法所得的组合；

简单理解：是由数字、运算符、变量等组成的式子

2】返回值：表达式最终都会有一个结果，返回给我们，我们成为返回值

2·2 递增和递减运算符

---

概述：如果需要反复给数字变量添加或减去1，可以使用递增（++）或递减（–）运算符来完成。

在JavaScript中，递增（++）和递减（–）既可以放在变量前面，也可以放在变量后面。放在变量前面时，我们可以称为前置递增（递减）运算符，放在变量后面时，我们可以称为后置递增（递减）运算符。

注意：

• 递增和递减运算符必须和变量配合使用。

递增运算符：

• 前置递增运算符

++num前置递增，就是自加1，类似于num=num+1,但是++num写起来更简单。

使用口诀：先自加，后返回值

• 后置递增运算符

num++后置递减，就是自z加1，类似num=num+1,但是num++写起来更简单。

使用口诀：先返回原值，后自加

小结：

1】前置递增和后置递增运算符可以简化代码的编写，让变量的值+1比以前的写法更简单

2】单独使用时，运行结果相同

3】与其他代码联用时，执行结果会不同

4】后置：先原值运算，后自加（先人后己）

5】前置：先自加，后运算（先己后人）

前端框架

前端框架太多了，真的学不动了，别慌，其实对于前端的三大马车，Angular、React、Vue 只要把其中一种框架学明白，底层原理实现，其他两个学起来不会很吃力，这也取决于你以后就职的公司要求你会哪一个框架了，当然，会的越多越好，但是往往每个人的时间是有限的，对于自学的学生，或者即将面试找工作的人，当然要选择一门框架深挖原理。

以 Vue 为例，我整理了如下的面试题。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】