2023-05-01 15:41 已编辑汕头市金山中学电话客服

关注

携程前端|暑期实习|时间线|记录

3.24 官网投递简历

3.25 测评（携程的测评是会挂人的，题型有不少都是那种IQ题，还是建议好好做）

3.29 笔试（我这里是参加的第二批笔试）

题目1：游游拿到了一串数字，她想知道这串数字一共有多少个员圈?提示:数字0、6、9这三种数字各有一个圆圈，数字8有两个圆圈，输入一串数字，输出有多少圆圈。

思路：直接用Map强行a了

题目2：游游定义一个排列中，满足以下条件的为“好元素”对于第i个元素a;而言，a;为前个元素的最大值。例如，[3,1,5,2.4]中，第一个和第三个元素是好元素，游游希望你构造一个长度为n的排列，其中有k个好元素，且任意两个好元素都不相邻。你能帮帮她吗?

排列的定义:由1到n所有正整数组成的长度为n的数组，每个正整数出现恰好一次。

输入描述：两个正整数n,k，用空格隔开

1 <= n <= 10^5，1 <= k <= n/2

输出描述：一行n个正整数，代表游游构造的排列。有多解时输出任意即可。

示例：输入：5 2 输出：3 1 5 2 4

思路：构造一个长度为n的，数据从1到n的数组，首先是判断2 * k 是否大于n，是的话i从2k-4开始，每次i向前移动两个单位，并将尾指针所在位置（倒数第二个数）与i所在位置交换，不是的话i从2k – 2开始，每次完全移动两个单位，并将尾指针所在位置（最后一个数）与i所在位置交换，即可得到答案

题目3：游游拿到了一个正整数n，她希望找到一对正整数x，y满足|x! × y一y一n|最小，且x,y都不等于2，感叹号表示阶乘。

输入描述：一个正整数n

1 <= n <=10^9

输出描述：输出两个正整数，分别表示x,y

如果有多解，输出任意一解即可通过

示例：输入：2 输出：1 1

思路：这里我没想到比较好的优化方法，两个for循环直接去计算的，记得i取到11，j取到1000000，可以通过88.9%的用例，再往大了取就会超时

题目4：涂色树，输入一棵边带权重的树，给一些边染色，两条边若有公共顶点则不能都染色。输出染色的边的权重和的最大值。这里听网上大佬说用树形dp，当时还没做过，最后只过了10%

一面：4.06（45min）

1.自我介绍

2.对Uni-App，举例说明怎么解决多端应用不兼容的问题

3.在这个项目中的角色和工作内容，使用uni-app做了哪个模块

4.Token的使用过程，包括登录和鉴权的过程

5.请求把token带上，是怎么样的过程（http请求会自带cookie里面的token）

6.通过什么方式进行体积的优化，项目时间比较赶是什么时候做的优化

7.按需引入和全局组件分别对体积优化数值方面的具体影响（百分比），这部分的研究有没有做过（面试官说可以做到更细，说服力会更强）

8.前端这部分的中长期职业规划

9.是否关注过社会上对携程这个公司形象的负面评价

10.希望在携程实习能够收获到什么？

11.JS的四种循环，for in for of foreach map的区别，并从是否可以被中断的角度分析

12.== 和=== 的比较

13.深拷贝和浅拷贝的区别，用什么方式实现深拷贝

14.Settimeout第二个参数的理解

15.有没有用过react

16.用的vue2还是vue3？vue3和vue2有什么区别

算法：13分钟三个算法题，求水仙花数，递归求阶乘，求闰年（脑抽了只a了一道）

总之是问的比较简单的，面试体验挺不错，当时是第一次被问到项目，还有点不熟练，算法因为是让在本地IDE写的，一开始出了点岔子，没做好，不过还是侥幸约了2面

二面：4.14（45min）

1.自我介绍

2.从上次面试到现在的一周，有什么收获（讲的cookie和storage）

3.如果通过window.open打开，可以共享sesionStrorage吗？（√）

4.get请求和post请求有什么区别？post的数据大小是哪里限制的？（HTTP协议）

5.触发页面回流的条件

6.绝对定位的元素，位置变化会触发回流吗（这里可能是会的，如果它影响到了其他元素的布局，就会回流，一般对具有复杂动画的元素使用绝对定位，使它脱落文档流，否则会引发父元素以及后续元素频繁回流）

7.项目部署，打包工具用的npm还是yarn

8.本地增加的package.lock.json文件里面有什么配置项（×）

9.问了用Git Lab进行团队协作的流程

10.git rebase的命令的作用

11.用到Vue哪些的生命周期

12.操作dom一般在哪个生命周期（挂载在mounted，更新在updated）

13.有用过掌握的技术为自己或者他人服务的经历吗？（讲了一个自己写的抽签系统）

14.算法

手撕题1：改写limitRequest函数，改变console的结果，将原本的start:/1,start:/2,start:/3，end:/1,end:/2,end:/3的执行结果改为start:/1,end:/1,start:/2,end:/2,start:/3,end:/3。当时没有思路，后来请教了身边一个大佬才会的

 const fakeFetch = url => {
        console.log('start:', url)
        return new Promise(resolve => {
          setTimeout(() => {
            console.log('end:', url)
            resolve(url)
          }, 1000)
        })
      }
 // 借助一个flag做标记
      let flag = true;
      const limitRequest = url => {
        let request = new Promise((resolve,reject)=> {
          if(flag) {
            flag = false;
            fakeFetch(url).then( res => {
              flag = true;
              resolve(url)
            })
          } else {
            let time = setInterval(function() {
              if(flag) {
                flag = false;
                fakeFetch(url).then( res => {
                  flag = true;
                  clearInterval(time);
                  resolve(url)
                })
              }
            },500)
          }
        })
        return request;
      }

	  limitRequest('/1').then(res => {
        console.assert(res === '/1', 'res should be /1')
      })

      limitRequest('/2').then(res => {
        console.assert(res === '/2', 'res should be /2')
      })

      limitRequest('/3').then(res => {
        console.assert(res === '/3', 'res should be /3')
      })

手撕题2：数组扁平化改编，写一个函数，将input的数据转化为output的数据

      const input = {
        pages: {
          qr_title: 'qr',
          orderID: '订单号'
        },
        detail: {
          seqTag: {
            train: '火车段',
            bus: '大巴段',
            flight: '飞机段'
          }
        },
        guarantee: {
          slogan: [
            {
              title: '行程保障'
            }
          ],
          qrSlogan: [
            {
              title: '订单号',
              content1: '其他内容',
              content2: '订单号'
            }
          ]
        }
      }
	  const output = {
        qr: ['trip.pages.qr_title'],
        订单号: ['trip.pages.orderID', 'trip.guarantee.qrSlogan.0.title', 'trip.guarantee.qrSlogan.0.content2'],
        火车段: ['trip.detail.seqTag.train'],
        大巴段: ['trip.detail.seqTag.bus'],
        飞机段: ['trip.detail.seqTag.flight'],
        行程保障: ['trip.guarantee.slogan.0.title'],
        其他内容: ['trip.guarantee.qrSlogan.0.content1']
      }
	  const flattenObj = obj => {
        const res = {}
        // 初始化的preKey为'trai',第一个参数是传进去的对象，第二个参数是这个对象之前对应的所在的路径
        function flat(obj, preValue = 'trai') {
          // 遍历对象的每个键值
          Object.entries(obj).forEach(([key, value]) => {
            // 判断之前的preKey是不是空的，不是空的，那当前的value就是
            let newValue = preValue ? `${preValue}.${key}` : key
            // 如果是对象，就重复递归调用
            if (value && typeof value == 'object') {
              flat(value, newValue)
            } else {
              // 遍历到基本数据类型了，就把这个值作为键，之前的路径作为值，压入结果list里面
              // 如果是undefined，赋值为空数组
              if(res[value] == undefined){
                res[value] = [];
              }
              // 用展开运算符，把原本已有的元素展开然后赋值给对应的key
              res[value] = [newValue,...res[value]]
            }
          })
        }
        flat(obj)
        return res
      }
      console.log(flattenObj(input))

二面总结，八股总的来说没有太大问题，但是手撕题第一个没有思路，第二个思路对了但最终没有写出来的，上面的答案是我后续再写出来的，但是二面的面试官人真的很好，全程一直在笑，也没有给我压力，最后竟然也是让我通过了。