2024年Web前端最新【前端三剑客——JS】js基础理解(1)，oppo前端面试流程

最后

本人分享一下这次字节跳动、美团、头条等大厂的面试真题涉及到的知识点，以及我个人的学习方法、学习路线等，当然也整理了一些学习文档资料出来是给大家的。知识点涉及比较全面，包括但不限于前端基础，HTML，CSS，JavaScript，Vue，ES6，HTTP，浏览器，算法等等

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

前端视频资料：

• isNaN()

  判断一个变量是否为非数字的类型，返回true或者false

  返回true表示不是数字

1.3.2 String

字符串加双引号或单引号

• JS可以用单引号嵌套双引号,或者反过来

• 转义符

  
  \n 换行符
  
  \\ 斜杠
  
  \' 单引号
  
  \" 双引号
  
  \t tab缩进
  
  \b 空格
  
  
  
  

• length 属性

  通过其可以获取整个字符的长度

  
  var strMsg = "我是帅气多金的程序猿！";
  
  alert(strMsg.length); // 显示 11
  
  
  
  

• 拼接

  • 多个字符串之间可以使用 + 进行拼接，其拼接方式为 字符串 + 任何类型 = 拼接之后的新字符串

    
    //1.1 字符串 "相加"
    
    alert('hello' + ' ' + 'world'); // hello world
    
    //1.2 数值字符串 "相加"
    
    alert('100' + '100'); // 100100
    
    //1.3 数值字符串 + 数值
    
    alert('11' + 12);     // 1112 
    
    
    
    

  • 与变量拼接

    
    console.log('pink老师' + 18);           // 只要有字符就会相连 
    
    var age = 18;
    
    // console.log('pink老师age岁啦');       // 这样不行哦
    
    console.log('pink老师' + age);          // pink老师18
    
    console.log('pink老师' + age + '岁啦');  // pink老师18岁啦
    
    // 注意,变量不可以加引号,否则会被认定为字符串
    
    
    
    

1.3.3 Boolean

当布尔型和数字型相加时,true表示1,false表示0

1.3.4 Undefined和Null

注意两者的区分

Undefined加数字相加,为NaN

1.3.5 获取检测变量的数据类型

typeof num

var num = 18;

console.log(typeof num) // 结果 number 

1.3.6 数据类型转换

注意： 使用表单，prompt获取过来的数据默认是字符串类型的，此时就不能直接简单的进行加法运算，而是需要进行变量的数据类型转换

• 转换为字符串

  1. toString()

     
     var num = 1; alert(num.toString());//转换成字符串
     
     
     
     

  2. String()强制转换

     
     var num = 0; alert(String(num))//它可以将任何类型强制转换为字符串
     
     
     
     

  3. 加号拼接成字符串

     和字符串拼接的结果是字符串,也被称为隐式转换

     
     var num = 1; alert(num+"字符串转换")
     
     
     
     

• 转换为数字型

  1. parseInt(string)函数

     parseInt('78') 转换为int

     
     若得到'120px',转换会去掉px
     
     若是'rem120',转换会直接输出为NaN(parseFloat也是如此)
     
     
     
     

  2. parseFloat(string)函数 // 只能解析十进制数,若解析内容只有整数,则解析为整数

     parseFloat('78.21') 转换为float

  3. Number()强制转换函数

     Number('12')

  4. js隐式转换(- * /)

     利用算术运算隐式转换

     '12'-0

  • 小加法例子

    
    // 1. 先弹出第一个输入框，提示用户输入第一个值 
    
     var num1 = prompt('请输入第一个值：');
    
    // 2. 再弹出第二个框，提示用户输入第二个值 
    
     var num2 = prompt('请输入第二个值：');
    
    // 3. 将输入的值转换为数字型后，把这两个值相加，并将结果赋给新的变量  
    
     var result = parseFloat(num1) + parseFloat(num2);
    
    // 4. 弹出结果
    
     alert('结果是:' + result);
    
    
    
    

• 转换为布尔型

  1. Boolean()函数

     Boolean("true")

     • 代表空\否定的值会被转换为false

       如: ‘’ 、0、NaN、null、undefined、

     • 其余的值均会转换为true

2. 关键字

---

break、case、catch、continue、default、delete、do、else、finally、for、function、if、in、instanceof、new、return、switch、this、throw、try、typeof、var、void、while、with 等。

运算符\流程控制-分支

===============================================================================

1. 算术运算符

---

+   -    *    /    %(取余)

1.1 浮点数精度问题

---

浮点数的最高精度为17位小数,但在进行算术计算时其精确度远远不如整数

var result = 0.1 + 0.2;    // 结果不是 0.3，而是：0.30000000000000004

console.log(0.07 * 100);   // 结果不是 7，  而是：7.000000000000001

**注意：**不要直接判断两个浮点数相等

还需注意算术运算的优先级，先乘除后加减

2. 递增和递减运算符

---

++   --

分前置,和后置

3. 比较运算符

---

<   >   >=    <=    ==   !=   ===全等,要求值和数据类型都一致    !==

4. 逻辑运算符

---

&& || !

返回true或false

一般可以引用短路运算

5. 赋值运算符

---

= += -= *= /= %=

6. 运算符优先级

---

| 优先级 | 运算符 | 顺序 |

| :-: | :-: | :-: |

| 1 | 小括号 | () |

| 2 | 一元运算符 | ++ – ! |

| 3 | 算术运算符 | 先* /%后± |

| 4 | 关系运算符 | < > <= >= |

| 5 | 相等运算符 | == != === !== |

总结

技术学到手后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。

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

. 运算符优先级

---

| 优先级 | 运算符 | 顺序 |

| :-: | :-: | :-: |

| 1 | 小括号 | () |

| 2 | 一元运算符 | ++ – ! |

| 3 | 算术运算符 | 先* /%后± |

| 4 | 关系运算符 | < > <= >= |

| 5 | 相等运算符 | == != === !== |

总结

技术学到手后，就要开始准备面试了，找工作的时候一定要好好准备简历，毕竟简历是找工作的敲门砖，还有就是要多做面试题，复习巩固。

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

[外链图片转存中…(img-CWigCFvU-1715446442539)]