最后
本人分享一下这次字节跳动、美团、头条等大厂的面试真题涉及到的知识点，以及我个人的学习方法、学习路线等，当然也整理了一些学习文档资料出来是给大家的。知识点涉及比较全面，包括但不限于前端基础，HTML，CSS，JavaScript，Vue，ES6，HTTP，浏览器，算法等等
前端视频资料：
| JavaScript var str4 = str1 + str2; console.log(str4); // var str5 = str1 + str2 + str3; var str5 = str4 + str3; var username = “malu” // hello malu howareyou var str6 = “hello” + username + “how are you” console.log(str6); |
3. 其他相关tips/方法
- 转义字符，转义就是转变原有的意思
- 通过索引访问访问某个字符串中的某个字符
- 可以求字符串的长度
（四）boolean数据类型（布尔类型）
对应值有两个：true、false
| JavaScript // 关系运算符，最终也是布尔类型 console.log(2>1);//true console.log(2==1);//false |
| JavaScript // ! 非，取反 console.log(!2>1);//false console.log(2!=1);//true |
（五）null和undefined数据类型
1.null数据类型
只有一个值null 空
null类型通常用来表示一个对象为空，给一个对象初始化的时候，可以赋值为null
| JavaScript // 给一个已经声明的变量赋值为null进行初始化 var user = null; user = { name: ‘小花’, age: 18 } |
2.null和undefined 有什么区别？
| undefined通常只用作变量声明未赋值时的默认值 null则是为变量声明未赋值时赋值为空 |
| JavaScript var uname; console.log(uname);//und uname=null; console.log(uname);//null // 而undefined一般不这样用，因为本就是默认值 // 如var user2=undefined; |
（六）object数据类型
1.拆解分析
| // object是一个对象, 也可以称之为容器 //object数据类型是复杂类型，前面讲的都是基本数据类型，往往可以表示一组数据，是其他数据的一个集合 // {} var obj = { // name是属性名 小花是属性值 // 属性名-key(键) 属性值-value(值) // 键值对 key:value name: ‘小花’, age: 18, love: true } console.log(obj, typeof obj); // 访问对象里面的某一个属性 // .叫属性访问运算符 只有对象可以打点 console.log(obj.name); |
2.对象模板
| JavaScript // 1.初始化对象 var obj2 = null; // 2.给对象赋值 obj2 = { key: value, key: value, key: value } // 或者直接var obj={key:value,key:value}一步到位 |
（七）其他数据类型->string
| 总结: 1)强制转化 a.toString()-这个只可转换Number/Boolean类型 String(a) 2)隐式转化 + 法一 String()构造函数 强制转化 可转Number、Boolean、null、undefined、字面量 法二 使用xx.toString()方法 强制转化 just可转换Number、Boolean类型 法三 + 隐式转换 范围都可以，可转Number、Boolean、null、undefined、字面量 |
（八）其他数据类型->number
1.string类型(含空串)->number
| // string类型(含空串)->number总结： // 将字符串(包含空串)转为number类型 // 1.Number() 强制转化 // 2.parseInt() parseFloat() // 3.+ - 隐式转化 特殊: “123px” 使用Number() + - 被转为NaN “123px " 使用parseInt() parseFloat() 被转为123 能转则转 “px123px” --转为NaN* 如果是一个空串，空串是”"，转化后， “” => 0 |
2.其他类型->number
| 其他类型->number总结： 1.通过Number() 2.+ - 上两个方法其他类型转换时结果一样 true - 1 false - 0 null - 0 undefined - NaN 3.parseInt() parseFloat() 其他数据类型，全都NaN |
（九）其他数据类型->boolean
| 哪些数据转成布尔类型会变成false?* 空串，0，-0，NaN，und，null 会转化成false，其它的都会转化成true |
五 运算符
（一）概念及分类
| // 运算符：具有某些功能的符号 + - * / % // 操作数：1 + 1 运算符号的两侧的数据叫操作数 // 表达式:任何有值的内容都叫表达式 // 要求：运算的时候，左右两侧的数据必须要保持一致,如果不一致,会发生隐式转化 * // 从功能上划分 |
// 算数运算符 // 递增递减运算符 // 关系运算符 // 逻辑运算符 // 赋值运算符 * // 从操作数上划分
// 一元运算符 单目运算符 +1 // 二元元素符 双目运算符 1+1 // 三元运算符 三目运算符 三元表达式 xx?xx:xx |
（二）算术运算符
1.概念
| + - * / % 数学运算符也叫算术运算符，主要包括加、减、乘、除、取余（求模）。 |
2.某些特殊情况
| JavaScript // +如果碰到字符串,那么就是字符串拼接 // + 会把number类型隐式转换为String类型 console.log(666 + “123”);//666123 // 否则就是相加 number + number console.log(1 - “666”);//-665 -没有隐式转换为字符串的功能 console.log(1 * “666”);//666 "666"被隐式转为number类型 //和true(1) false(0) var d = 100 var e = true; var f = d + e; //100+1=101 console.log(1 / false);Infinity //和null(0) console.log(666 + null);//666+0 = 666 console.log(1 / null);//Infinity //取余模为0时有点特殊，结果为NaN console.log(3 % 0);//NaN //undefined(NaN) var und; console.log(666 + und);//NaN // NaN和任何数据进行运算，结果都是NaN console.log(666 + NaN); //NaN console.log(1 * “文字”);//NaN |
（三）赋值运算符
| 概念：将=右边的数据，存储到=左边的变量名对应的内存空间中。 // 简单的赋值运算符 = // 复杂的赋值运算符 += -= *= /= %= |
| JavaScript num1 += 120; //num1=num1+120 //其他类似 |
赋值运算符有副作用，它的整体也有一个值，如下：
（四）三元运算符
| 表达式 ? 结果A : 结果B* 表达式为true，结果A |
- 表达式为false，结果B
|
| JavaScript var res = true ? “hello” : “world” console.log(res);//hello var res2 = false ? “hello” : “world” console.log(res2);//world var a = 1; var b = 2; console.log((a > b) ? “hello” : “world”);//world |
（五）关系(比较)运算符
1.概念及相关tips
| 比较运算符（关系运算符）是两个数据进行比较时所使用的运算符 比较运算后，会返回一个布尔值（true / false）作为比较运算的结果 // == === != !== > < >= <= // 最终返回值是 false true * 比较时，如果不是数字，会隐式转换为number类型 |
- 任何数据和NaN作比较 都是false
// false – 0 true – 1 // undefined – NaN // null – 0 |
2.=VSVS=
| // 赋值 = // 相等 == // 全等 =（先判断类型是否一致，再比较大小） // ! 取反 // != 不相等 // ! 不全等 |
| JavaScript // 任何和NaN作比较全部都是false****console.log(NaN === NaN);//f // 不会判断类型,在比较前已经发生了隐式转换 转换成number类型 console.log(123 == “123”);//t // === 全等 会先比较类型，如果类型不一致，直接返回false console.log(123 === “123”); //f // !=不等 console.log(123 != “456”);//t console.log(123 !== “456”);//t console.log(123 !== 456);//t |
3.某些特殊情况
| JavaScript // 美国的字符编码集 ASSIC 了解 console.log(1 > “a”); //f 97 1>97 console.log(“b” > “a”); //t a=97 b=98 console.log(“ab” > “ac”); //f a=97 b=98 c=99 console.log(1 > true); //f console.log(1 > false); //t console.log(1 > null); //t console.log(1 > “123”); //f "123"转换成number是123 console.log(1 > NaN); //f console.log(1 > undefined);//f und隐式转为NaN |
（六）逻辑运算符及逻辑中断
1.逻辑运算符
| // 概念：将多个表达式或者值放到一起来获取到一个最终的结果 // && 与 一假即假 // |
2.逻辑中断
| JavaScript var i = 100; **// |
（七）逻递增递减运算符
| // ++ – // ++在前整体是一个新值，++在后整体是一个旧值 var b = 1; console.log(b);//1 console.log(b++);//1 console.log(b);//2 console.log(++b);//3 console.log(b);//3 |
（八）运算符的优先级
运算符的优先级有很多，常见的没几个，推荐你记住3个即可：
-
算数优先级优先级 大于 比较运算符
-
比较运算符优先级 大于 逻辑运算符
-
逻辑运算符内部三个优先级 ! > && > ||
直接上代码：
其它优先级：参考
六 分支语句
（一）相关概念
| 三大流程控制： // 顺序结构：从上向下，顺序执行代码 // 分支结构：根据条件判断，决定执行代码的哪个分支 // 循环结构： 让特定的代码 重复执行 |
| 分支结构 第一种* // if |
- // if else
- // if elseif else
第二种 三元表达式 第三种 switch语句(了解) 注意: 1.if语句中的条件，不管是什么表达式，都会转化成布尔类型 2.if语句后面的{}可以不写，如果不写，只有if后面第1条语句，相当于是{}中的 3.if语句可以嵌套 |
（二）代码
| JavaScript //第一种情况：单分支if语句 if(条件){ 满足条件则执行此代码 } //第二种情况：双分支if语句法 if(条件){ 满足条件执行的代码 }else{ 不满足上面条件要执行的代码 } //第三种情况：多分支if语句法 if(条件1){ 满足条件执行的代码 }else if(条件2){ 满足条件执行的代码 }else if(条件3){ 满足条件执行的代码 }else{ 以上都不满足执行代码块 } |
七 循环语句
（一）概念
| * 循环的本质就是以某个变量为起始值，然后不断产生变化量，慢慢靠近终止条件的过程。 |
- 循环三要素：
- 变量起始值
- 终止条件（缺终止条件，循环会一直执行->死循环）
- 变量变化量（用自增/自减）
|
（二）while和do while循环
| * while(条件){ |
//循环体 }* do{
//循环体 }while(条件) 区别： while：不满足条件一次循环体也不执行 do while：至少执行一次循环体 |
（三）for循环
| for(变量起始值,循环条件;变化值){ 循环体 } |
一个for嵌套for例子(倒等腰三角形):
| JavaScript // * * * * // * * * // * * // * for (var i = 1; i <= 4; i++) { // 打印空格 for (var j = 1; j < i; j++) { document.write(’ ‘) } // 打印* for (var j = 4; j >= i; j–) { document.write("* ") } // 换行 document.write(’ ') } |
（三）循环中断
| * continue// 结束本次循环,继续下次循环 |
- break// 跳出整个循环，不再进行下次循环
|
| JavaScript // 跑5圈，第二圈没跑,但是后面跑了 var dinstance = 0; for (var i = 1; i <= 5; i++) { if (i == 2) {// 结束本次循环,继续下次循环****continue; } dinstance += 500 } console.log(dinstance);//2000 // 跑5圈，第二圈没跑,后面都不跑了 var dinstance = 0; for (var i = 1; i <= 5; i++) { if (i == 2) {// 跳出整个循环****break; } dinstance += 500 } console.log(dinstance);//2000 |
（四）一些练习
1.百元买百鸡
| JavaScript // 百钱买百鸡（鸡翁一，值钱五；鸡母一，值钱三；鸡雏三，值钱一；百钱买百鸡，则翁、母、雏各几何？） // 100元 公鸡/5元(a) 母鸡/3元(b) 小鸡*3/ 1元© // 100元 公鸡 100/520 // 100元 母鸡 100/333 // 100元 小鸡 100*3=300 for (var a = 0; a <= 20; a++) { // 考虑：在买0只公鸡的情况下，要么多少只母鸡，多少只小鸡 // 考虑：在买1只公鸡的情况下，要么多少只母鸡,多少只小鸡 // … // 考虑：在买20只公鸡的情况下，要么多少只母鸡,多少只小鸡 for (var b = 0; b < 34; b++) { // 考虑：在买0只母鸡的情况下，要么多少只小鸡 // 考虑：在买1只母鸡的情况下，要么多少只小鸡 // … // 考虑：在买33只母鸡的情况下，要么多少只小鸡 for (var c = 0; c <= 300; c++) { if ((a + b + c) === 100 && (5 * a + 3 * b + c / 3) == 100) { console.log(“公鸡:” + a + “母鸡:” + b + “小鸡:” + c) } } } } |
2.斐波那契数列
| JavaScript // 斐波那契数列，输入斐波那契数列的个数，打印斐波那契数列 // 如输入了10，求斐波那契数列前10个数字 // 10 var num = +prompt(‘请输入斐波那契数列的个数(大于2)’); var x = 1; var y = 1; var z = 2; //表示两个数字的相加和 for (var i = 1; i <= num; i++) { if (i == 1 |
八 函数
（一）初识函数
函数，可以当做是一大堆功能代码的集合。就是某段代码的封装，这段代码帮助我们完成某一个功能。默认情况下，JS引擎也帮我提供了一些函数，我们也可以编写自己的函数。
什么时候会使用到函数：
-
有重复代码，用函数增加代码的重用性。
-
代码太长，用函数增强代码的可读性。
以前我们变成是按照业务逻辑从上到下逐步完成，称为：面向过程编程；现在学了函数之后，利用函数编程称为：函数式编程。
函数声明和函数表达式：
- 使用function关键字来声明一个函数，也可以把一个函数赋值给一个变量，我们叫函数表达式
直接上代码：
函数声明的注意细节：
-
函数名的命名规则和前面变量名的命名规则是相同的
-
函数定义完后里面的代码是不会执行的，函数必须调用才会执行
-
函数要尽量做到见名知意，学习时，使用foo，bar，fn，gn…
-
由于函数一般是为了实现某个功能才定义的， 所以通常我们将函数名命名为动词，比如 getSum
函数调用：
-
调用函数是让已存在的函数为我们所用
-
可以是自己写的函数，也可以是系统中内置的，也可以是第三方的
-
调用的时候千万不要忘记添加小括号
直接上代码：
（二）作用域（局部变量和全局变量）
| 局部变量和全局变量：* 局部变量就是只能在一定范围内使用，一般在函数内部的变量都是局部变量 |
- 全局变量就是在全局哪里都可以使用
全局作用域和局部作用域：* 函数体内部所对应的空间就是局部作用域
- 函数体外部所对应的空间就是全局作用域
|
代码如下：
（三）函数的参数（形参和实参)
在定义函数时，如果在括号中添加 变量 ，我们称它为函数的形式参数
实际调用函数时，如果在括号中有数值传入，我们称它为函数的实际参数
（四）函数的返回值
函数本质也是一个数据，数据类型是function，如下：
So调用一个函数，函数是可以给我们返回一个数据的
- 通过return关键字实现返回，直接上代码：
- 如果函数没有写return，它默认返回und，如下：
九 数组
（一）数组介绍
前面写的多个数据类型，有字符串，数字，布尔，und，null，这些数据类型叫基本数据类型。还有复杂数据类型，复杂数据类型有数组，有函数，有对象。数据是一个容器，是一个有序的集合，它里面可以放一堆的数据。
数组叫array，数组中的每一个数据，叫元素(elements);每一个元素都有一个索引，也叫下标（index），索引是从0开始的;数组中元素的个数，叫数组的长度(length)。
数组中放的数据的类型可以不一样，可以放任意的数据类型。
代码如下：
（二）操作数组
1.创建数组
- 通过字面量的形式的创建
| JavaScript var arr2 = [“a”, “b”, true, 123, 600, undefined, null]; |
- 通过new Array()的形式的创建
| JavaScript var arr3 = new Array(“hello”, “world”, 111, null); |
当new Array(n)，参数n是一个数字时，创建为长度为数字大小的数组。
2.数组元素的CRUD(原数组被改变)
a.添加元素
-
push 尾部——返回值为新增元素后的数组长度
-
unshift 头部——返回值为新增元素后的数组长度
-
splice 任意位置——返回值为删除的元素数组
代码演示：
b.删除元素
-
pop 尾部——返回值为数组删除的元素
-
shift 头部——返回值为数组删除的元素
-
splice 任意位置——返回值为删除的元素数组
代码演示：
c.修改元素
d.查找元素
3.数组的查找
| // indexOf lastIndexOf查找数组的某个元素的索引 // includes 查找数组是否包括某个元素 // find(function(){}) 查找元素 // findIndex(function(){}) 查找元素对应的索引 //返回索引不存在时，一般返回-1 // 元素不存在，一般返回undefined ps:includes()是false |
a.indexOf lastIndexOf 查找数组的某个元素的索引（方向不同）
| JavaScript var arr1 = [“z3”, “l4”, “w5”, “z6”, “t7”, “l4”]; // 1.indexOf 从左往右查找数组的某个元素的索引 console.log(arr1.indexOf(‘l4’));//1 //如果元素不在数组中，返回值为-1 console.log(arr1.indexOf(“xxx”));//-1 // 2.lastIndexOf 从右往左查找数组的某个元素的索引 console.log(arr1.lastIndexOf(‘l4’));//5 |
b.includes 查找数组是否包括某个元素
| JavaScript // 3.includes 查找数组是否包括某个元素 返回一个布尔值true/false console.log(arr1.includes(‘xxx’));//false console.log(arr1.includes(‘z3’));//true |
c.find 查找元素
| JavaScript // 4.find 查找元素 // 函数的参数是一个函数，叫高阶函数 /* 语法 arr.find(function(item,index,arr){ }) */ //参数： // item 表示数组中的每一个元素 // index 表示每一个元素对应的索引 // arr 表示此数组 var arr2 = [“z3”, “l4”, “w5”, “z6”, “t7”, “l4”]; // find 自带遍历功能 //return item == “z3”;元素在其中 var res1 = arr2.find(function (item, index, arr) { console.log(item); console.log(index); console.log(arr); return item == “w5”; }); //return item == “xxx”;元素不在其中 var res2 = arr2.find(function (item, index, arr) { return item == “xxx”; }); console.log(res1);//w5 console.log(res2);//undefined |
d.findIndex 查找元素对应的索引
| JavaScript // 5.findIndex 查找元素对应的索引 与find语法类似 // 语法：arr.findIndex(function(item,index,arr){ // }) var res3 = arr2.findIndex(function (item, index, arr) { return item == “z3”; }); //return item == “xxx”;元素不在其中 var res4 = arr2.findIndex(function (item, index, arr) { return item == “xxx”; }); console.log(res3);//0 console.log(res4);//-1 |
4.数组的遍历(及对象的遍历)
a利用普通的for循环进行遍历，如下：
| JavaScript for (var i = 0; i < arr.length; i++) { console.log(arr[i]); } |
b使用for (var index in arr)进行遍历，如下：
| JavaScript for (var index in arr) { // index – 索引 console.log(arr[index]); |
c使用for (var item of arr)进行遍历，如下：
| JavaScript for (var item of arr) { // item – 每一项 console.log(item); } |
d使用forEach (function(){})进行遍历，如下：
| JavaScript arr.forEach(function (item) { // console.log(item); // 让数组中的每个元素都执行一次对应的方法 console.log(item + “111”); }); |
e使用=>进行遍历
PS:对象的遍历for (var key of obj)
只能用for in遍历的是对象的键值，再通过键来获取对应的值
| JavaScript var obj = { // key:value; name: “zhangsan”, age: 18, height: 180 } // for in 循环遍历的是对象的键值，再通过键来获取对应的值 for (var key in obj) { console.log(key); console.log(obj[key]); } // 遍历对象不能使用for of for (var item of obj) { console.log(item); //obj is not iterable } |
PS:字符串的遍历for (var item of str)
| JavaScript var str1 = “hello”; // for of for (var item of str1) { console.log(item); } |
5.数组的映射、过滤和累加
| map 映射，对数组的每一个元素进行加工，返回一个新数组 filter 过滤 会创建一个新数组, 不会改变原数组 reduce 累加 一个和 |
a.map: 映射——对数组的每一个元素进行加工
| JavaScript // 会返回一个新数组 // 语法 arr.map(function(){ // }) var res1 = arr.map(function (item) { return item + “111”; }); console.log(arr);// [‘z3’, ‘l4’, ‘w5’, ‘z6’, ‘t7’, ‘l4’] console.log(res1);// [‘z3111’, ‘l4111’, ‘w5111’, ‘z6111’, ‘t7111’, ‘l4111’] |
b.filter：过滤
| JavaScript // 会创建一个新数组，不会改变原数组 // 语法 arr.filter(function(item){ // }) var arr2 = [2, 3, 4, 5, 6, 7, 234, 34, 34, 2]; var res2 = arr2.filter(function (item) { return item >= 10; }); console.log(arr2);//[2, 3, 4, 5, 6, 7, 234, 34, 34, 2] console.log(res2);//[234, 34, 34] |
c.reduce：累加
| JavaScript var arr3 = [1, 2, 3, 4, 5, 6]; var res3 = arr3.reduce(function (prev, next) { return prev + next; // 第一次：prev 100 next 1 // 第二次：prev 101 next 2 // 第三次：prev 103 next 3 // 第四次：prev 106 next 4 // 第五次：prev 110 next 5 // 第六次：prev 115 next 6 // 结果：121 }, 100);//100是prev的初始值 console.log(res3);//121 |
6.数组的排序及翻转(原数组被改变)
| * sort 排序——ASCII/降序/升序 |
- reverse 数组翻转
|
a.sort 排序——ASCII/降序/升序
| JavaScript // 1.sort 排序——根据ASCII比较，升序 // 语法：arr.sort() var arr = [2, 45, 6, 7, 8, 34, 5, 35]; console.log(arr.sort());//从最高位单位单位比较而非整体数值 console.log(arr);//原数组被改变 var arr2 = [“a”, “d”, “c”, “b”, “e”]; console.log(arr2.sort()); |
| JavaScript // 2.sort 从小到大 升序return a - b; // 语法：arr.sort(function(a,b){ // return a-b; // }) // 如果(a, b)=> a - b返回小于0的值，那么a将被排列到b之前 // 如果(a, b)=> a - b返回0，那么a和b的顺序不变 // 如果(a, b)=> a - b返回大于0的值，那么b将被排列到a之前 arr.sort(function (a, b) { return a - b; }); console.log(arr); |
| JavaScript // 3.sort 从大到小 降序return b-a； // 语法：arr.sort(function(a,b){ // return b-a; // }) arr.sort(function (a, b) { return b - a; }); console.log(arr); |
b.reverse 数组翻转
| JavaScript // 4.reverse 数组翻转 // 语法：arr.reverse() console.log(arr.reverse()); console.log(arr);//原数组被改变 |
7.数组的合并与截取
| * slice() 截取数组元素 特点：包前不包后 |
- concat() 合并数组 把多个数组合并成一个数组
|
a.slice() 截取数组元素
| JavaScript // 1.slice() 截取数组元素的新数组，不改变原数组 var arr1 = [0, 1, 2, 3, 4, 5]; // slice(start,end) 包前不包后 var res = arr1.slice(1, 3) console.log(arr1.slice(1, 3));//[1,2] // slice(start) 从start开始到最后 console.log(arr1.slice(1));//[1,2,3,4,5] // start为负数时 从后-1开始往前数第负数个 console.log(arr1.slice(-1));//[5] // slice() 整个数组 console.log(arr1.slice());//[0,1,2,3,4,5] |
b.concat() 合并数组
| JavaScript // 2.concat() 合并数组 var arr2 = [‘hh’, ‘xixi’]; var arr3 = [null, true]; // 合并一个数组 console.log(arr1.concat(arr2));//[0, 1, 2, 3, 4, 5, ‘hh’, ‘xixi’] // 合并多个数组 console.log(arr1.concat(arr3,arr2));//[0, 1, 2, 3, 4, 5, null, true, ‘hh’, ‘xixi’] |
（三）数组和字符串之间相互转化
| * join 数组.join(“拼接符”) 把数组转化成字符串 |
- split 字符串.split(“分隔符”) 把字符串转化成数组
|
a.join() 把数组转换为字符串
| JavaScript // 1.join() 把数组转换为字符串 console.log(arr1.join());//0,1,2,3,4,5 默认分隔符为, //join(‘-’) 参数为分隔符 console.log(arr1.join(‘-’));//0-1-2-3-4-5 |
b.split() 把字符串转换为数组
| JavaScript // 2.split() 把字符串转换为数组 var str=‘nihao-aaaa-bbb-ccc’; console.log(str.split());//[‘nihao-aaaa-bbb-ccc’] //split(‘-’) 参数为分隔符 console.log(str.split(‘-’));// [‘nihao’, ‘aaaa’, ‘bbb’, ‘ccc’] |
十 字符串
| 和数组是不一样的 ,字符串不可以被改变字符,不可以重新赋值 var str1 = “hello”; str1[4] = “O” console.log(str1);//hello 未改变 |
（一）创建字符串
| JavaScript // 1）通过字面量的形式来创建一个字符串 var str1 = “hello”; console.log(str1); // 获取字符串的长度 length 长度 console.log(str1.length);//5 // 2）通过 new String()来创建一个字符串 var str2 = new String(“world”) console.log(str2); console.log(str2.length); |
（二）遍历+访问字符串字符
a.遍历字符串字符
| JavaScript // for循环 for (var i = 0; i < str1.length; i++) { console.log(str1[i]); } // for of for (var item of str1) { console.log(item); } |
b.访问字符串字符
| JavaScript // 使用方式1 ：通过字符串的索引 str[0] var str = “hello” console.log(str[1]);//e console.log(str[4]);//o console.log(str[6]);//und // 使用方式2 通过str.charAt(0) console.log(str.charAt(0));//h console.log(str.charAt(4));//o console.log(str.charAt(6));//空串(空字符串) // 区别:如果通过索引去访问一个不存在的元素 |
（三）操作字符串
| * indexOf() 从长串中找到子串 返回值是子串的首字母的索引 |
- includes 包含 长串中是否包含子串 返回true false
- startsWith 判断是否以什么开头 返回true false
- endsWith 判断是否以什么结尾 返回true false
- toLowerCase()： 将所有字符转成小写
- toUpperCase()： 将所有字符转成大写
- replace 替换/替代 替换字符串
-
- concat 拼接字符串
- trim() 去掉前后空格
|
| JavaScript // indexOf() 从长串中找到子串 var str1 = “my name is wang”; console.log(str1.indexOf(“name”));//3 console.log(str1.indexOf(“my”));//0 // 返回值是-1的时候，说明在长传中找不到子串 console.log(str1.indexOf(“lee”));//-1 // ---------------------------- // includes 包含 长串中是否包含子串 var str2 = “my name is wang”; console.log(str2.includes(“name”)); //true console.log(str2.includes(“lee”)); //false // ---------------------------- // startsWith 判断是否以什么开头 // endsWith 判断是否以什么结尾 var str3 = “my name is wang”; console.log(str3.startsWith(“my”));//true console.log(str3.startsWith(“you”));//false console.log(str3.endsWith(“wang”));//true console.log(str3.endsWith(“lee”)); //false // ---------------------------- // toLowerCase 大写转小写 // toUpperCase 小写转大写 var str22 = “HELLO”; var str33 = “hello”; console.log(str22.toLowerCase());//hello console.log(str33.toUpperCase());//HELLO // ---------------------------- // replace 替换/替代 替换字符串 var str4 = “my name is wang”; var newStr = str4.replace(“my”, “you”) console.log(newStr); // ---------------------------- // 拼接字符串 + concat var str5 = “hello”; var str6 = “world”; console.log(str5 + str6); console.log(str5.concat(str6)); // ---------------------------- // trim() 掌握! 去掉前后空格 var str7 = " 前端 "; console.log(str7); console.log(str7.trim()); |
（四）数组和字符串之间相互转化
| * join 数组.join(“拼接符”) 把数组转化成字符串 |
- split 字符串.split(“分隔符”) 把字符串转化成数组
|
a.join() 把数组转换为字符串
| JavaScript // 1.join() 把数组转换为字符串 console.log(arr1.join());//0,1,2,3,4,5 默认分隔符为, //join(‘-’) 参数为分隔符 console.log(arr1.join(‘-’));//0-1-2-3-4-5 |
b.split() 把字符串转换为数组
| JavaScript // 2.split() 把字符串转换为数组 var str=‘nihao-aaaa-bbb-ccc’; console.log(str.split());//[‘nihao-aaaa-bbb-ccc’] //split(‘-’) 参数为分隔符 console.log(str.split(‘-’));// [‘nihao’, ‘aaaa’, ‘bbb’, ‘ccc’] |
十一 对象
（一）创建对象
最后
本人分享一下这次字节跳动、美团、头条等大厂的面试真题涉及到的知识点，以及我个人的学习方法、学习路线等，当然也整理了一些学习文档资料出来是给大家的。知识点涉及比较全面，包括但不限于前端基础，HTML，CSS，JavaScript，Vue，ES6，HTTP，浏览器，算法等等
前端视频资料：
str7 = " 前端 "; console.log(str7); console.log(str7.trim()); |
（四）数组和字符串之间相互转化
| * join 数组.join(“拼接符”) 把数组转化成字符串 |
- split 字符串.split(“分隔符”) 把字符串转化成数组
|
a.join() 把数组转换为字符串
| JavaScript // 1.join() 把数组转换为字符串 console.log(arr1.join());//0,1,2,3,4,5 默认分隔符为, //join(‘-’) 参数为分隔符 console.log(arr1.join(‘-’));//0-1-2-3-4-5 |
b.split() 把字符串转换为数组
| JavaScript // 2.split() 把字符串转换为数组 var str=‘nihao-aaaa-bbb-ccc’; console.log(str.split());//[‘nihao-aaaa-bbb-ccc’] //split(‘-’) 参数为分隔符 console.log(str.split(‘-’));// [‘nihao’, ‘aaaa’, ‘bbb’, ‘ccc’] |
十一 对象
（一）创建对象
最后
本人分享一下这次字节跳动、美团、头条等大厂的面试真题涉及到的知识点，以及我个人的学习方法、学习路线等，当然也整理了一些学习文档资料出来是给大家的。知识点涉及比较全面，包括但不限于前端基础，HTML，CSS，JavaScript，Vue，ES6，HTTP，浏览器，算法等等
[外链图片转存中…(img-XwtEJr0O-1714849866990)]
前端视频资料：
[外链图片转存中…(img-77QUKMg2-1714849866991)]
813
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
