js常见面试基础笔试算法题

木头没有瓜

已于 2022-03-10 10:45:33 修改

阅读量874

点赞数

分类专栏： js 面试题文章标签： javascript vue.js 前端

于 2020-12-15 16:19:38 首次发布

本文链接：https://blog.csdn.net/weixin_40918145/article/details/111223945

版权

js 同时被 2 个专栏收录

91 篇文章 1 订阅

订阅专栏

面试题

21 篇文章 2 订阅

订阅专栏

参考文章：腾讯 IMWeb 一面 - 作业部落 Cmd Markdown 编辑阅读器

1、大数相加计算

实现关键：
1. 补全
2. 进位与补位

function addNum(a, b){
    let maxLen = Math.max(a.length, b.length);    // 取最长
    a = a.padStart(maxLen, 0);    // 开头补全
    b = b.padStart(maxLen, 0);    // 开头补全
    let sum = "";
    let f = 0;    // 进位1
    for(let i = maxLen - 1; i >= 0; i--){
        let kk = f + parseInt(a[i]) + parseInt(b[i]);
        if(kk >= 10){
            sum = (kk - 10).toString() + sum;
            f = 1;
        }else{
            f = 0;
            sum = kk.toString() + sum;
        }
        sum = i === 0 && kk > 10 ? "1" + sum : sum;    // 第一位大于10进位1
    }
    return sum;
}

var a = "100000000000000000004353555555555555555555555";
var b = "100000000000000000004353555555555555555555555";
var c = 100000000000000000004353555555555555555555555 + 1245444444444444444444444444444444444444444444444
console.log(c)
addNum(a ,b); 
VM3848:4 1.2455444444444444e+48
"200000000000000000008707111111111111111111110"

2、鼠标拖动滑块，对应地址：https://codepen.io/yacent/pen/JKPKdX

实现关键：
1. 正方形随鼠标移动，所以其position属性设为absolute，可调整
2. 记录mousedown、mousemove、mouseup
    a. mousedown 记录点击处鼠标位置，并计算与目标边缘的差值
    b. mousemove 实时修改其position属性的 top 和 left值
    c. mouseup 将拖拽对象置为空

<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Drag and Drop</title>
  <style>
    .square{
      width: 100px;
      height: 100px;
      background: #000;
      position: absolute;
    }
  </style>
</head>
<body>
	<div class="square">
	</div>
  <script>
    window.onload = function(){
      var drop = function(){
        var t = null; // 拖曳目标
        var x = 0; // 纵坐标距离
        var y = 0;
        var dropEvent = function(e){
          var that = e.target;
          switch(e.type){
            // 摁下鼠标
            case "mousedown":
              t = that;
              x = e.clientX - that.offsetLeft;
              y = e.clientY - that.offsetTop;
              break;
            // 移动鼠标
            case "mousemove":
              if(t !== null){
                t.style.left = e.clientX - x + "px";
                t.style.top = e.clientY - y + "px";
              }
              break;
            // 松开鼠标
            case "mouseup":
              t = null;
              break;
          }
         
        }
       return {
           fire: function(){
             document.addEventListener("mousedown", dropEvent, false);
             document.addEventListener("mousemove", dropEvent, false);
             document.addEventListener("mouseup", dropEvent, false);  
           } 
        }
      }()
      drop.fire();
    }
  </script>
</body>
</html>

3、实现鼠标右键菜单，关键词：contextmenu，链接地址：https://codepen.io/yacent/pen/LZPggE

实现关键：
1. HTML5事件 contextmenu 事件可自定义右键菜单
2. 菜单默认不可见，事件中修改 display属性及 position属性的 top 和 left 值
3. 取消默认的行为，取消默认的右键菜单的出现
4. 点击页面其余位置，右键菜单消失


<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>2</title>
  <style>
    .menu {
      border: 1px solid #000;
      width: 100px;
      padding: 0;
      position: absolute;
      display: none;
    }
    .menu li {
      list-style: none;
      border-bottom: 1px solid #000;
    }
    .menu a {
      display: block;
      text-decoration: none;
    }
    .menu a:hover {
      background-color: #000;
      color: #fff;
    }
  </style>
</head>
<body>
	<ul class="menu">
		<li><a href="#">1</a></li>
		<li><a href="#">2</a></li>
		<li><a href="#">3</a></li>
		<li><a href="#">4</a></li>
		<li><a href="#">5</a></li>
		<li><a href="#">6</a></li>
		<li><a href="#">7</a></li>
		<li><a href="#">8</a></li>
	</ul>
	<script type="text/javascript">
    window.onload = function(){
      document.addEventListener("contextmenu", function(e){
        e.preventDefault(); // 取消默认行为
        var menu = document.getElementsByTagName("ul")[0];
        menu.style.left = e.clientX + 'px';
        menu.style.top = e.clientY + 'px';
        menu.style.display = "block";
      })
      document.addEventListener("click", function(e){
        document.getElementsByTagName("ul")[0].style.display = "none"
      })
    }()
    
  </script>
</body>
</html>

4、web端常见安全性问题：XSS 和 CSRF简述及预防措施_我的博客-CSDN博客_xss和csrf

5、写一个mul函数，使用方法如下。

console.log(mul(2)(3)(4)); // output : 24 
console.log(mul(4)(3)(4)); // output : 48

答案直接给出：

function mul (x) {
    return function (y) { // anonymous function 
        return function (z) { // anonymous function 
            return x * y * z; 
        };
    };
}

简单说明下： mul 返回一个匿名函数，运行这个匿名函数又返回一个匿名函数，最里面的匿名函数可以访问 x,y,z 进而算出乘积返回即可。

6、一个string只包含 ()[]{}，判断是否正确闭合，如 ({[]})、[(){[]}{()}]都是正确的

function isBracketsMathch(s){
    while (true) {
        let length = s.length;
        s = s.replace("()", "");
        s = s.replace("[]", "");
        s = s.replace("{}", "");
        if (length == s.length)
             break;
    }
    return s.length == 0 ? true : false; 
};

7、版本号比较

如：2.3.2，4.3 ，只有2位数和3位数2种情况，

version(ver1, ver2)，ver1比ver2大返回1，ver1比ver2小返回-1，相同返回0

function version(ver1, ver2) {
    let arr1 = ver1.split('.')
    let num1 = Number(arr1.join(''))
    let arr2 = ver2.split('.')
    let num2 = Number(arr2.join(''))
    let len1 = arr1.length
    let len2 = arr2.length

    if (len1 > len2) {
        num2 = num2 * 10
    } else if (len1 < len2) {
        num1 = num1 * 10
    }

    if (num1 > num2) {
        return 1
    } else if (num1 < num2) {
        return -1
    } else {
        return 0
    }
}

8、Arr = [9,4,6,2,8,0,3,7]，数组表示每天股票价格，找出哪天买进，哪天卖出赚最多钱，例如：7-0=7

function max(arr) {
    let min = arr[0]
    let differenc = 0

    for (let i = 1; i < arr.length; i++) {
        if (arr[i] - min > differenc) {
            differenc = arr[i] - min
        }
        if (arr[i] < min) {
            min = arr[i]
        }
    }
    return differenc
}

9、用js实现判断一个变量是否为整数的函数
实现思路：先判断该变量是否为Number类型，以此来缩小范围，再判断该变量除以1后是否与原值全等，若全等则返回true，若不全等则返回false

10、找出字符串中出现次数最多的字符。

let testStr = 'asdasddsfdsfadsfdghdadsdfdgdasd';
        function getMax(str) {
            let obj = {};
            for(let i in str) {
                if(obj[str[i]]) {
                    obj[str[i]]++;
                }else{
                    obj[str[i]] = 1;
                }
            }
            let keys = Object.keys(obj); // 获取对象中所有key的值返回数组
            let values = Object.values(obj); // 获取所有value返回数组
            let maxVal = Math.max(...values);// Math.max可以找出传入参数的最大值，如：Math.max(1,2);这里可使用es6中的解构，　　　　　　　 也可以使用Math.max.apply(Math,values)可认为是apply(Math.max, arr)　　　　　　　 然后，arr是一个参数列表，对于max方法，其参数是若干个数，即Math.max(a, b, c, d, ...)
            console.log(keys[values.indexOf(maxVal)],maxVal);
        }
        getMax(testStr);

// obj值：{a: 5, s: 7, d: 12, f: 4, g: 2,  h: 1, s: 7,}

// 很牛的reduce方法
var testStr = 'asdasddsfdsfadsfdghdadsdfdgdasd';
var testArray = testStr.split('');
var a = testArray.reduce(function(prev,next){  
    if(next in prev) {    
        prev[next]++;  
    }else {    
        prev[next] = 1;  
    }  
    return prev
},{})
console.log(a)

12、匿名函数变量问题匿名函数变量问题_木头没有瓜的博客-CSDN博客

13、new String()和String()方法的区别 js 字符串，new String() 与 String（） - anobscureretreat - 博客园

14、Foo.getName()的故事一道经典的js面试题Foo.getName()_RoddyLD的博客-CSDN博客

15、复原IP地址 leetcode-复原IP地址-js实现_keyj1996的博客-CSDN博客

16、数组去重的方法 https://segmentfault.com/a/1190000016418021

17、数组对象去重 js中数组对象去重的方法 - 半指温柔乐 - 博客园

18、买卖股票的最佳时机实现买卖股票的最佳时机/买卖股票最大的收益

19、前序遍历判断回文链表判断单链表是否为回文结构的方法

20、零钱兑换零钱兑换（JS实现）-CSDN博客

21、接雨水问题接雨水面试题 - JS - 简书

22、匿名函数this指向以及变量提升匿名函数this指向问题_木头没有瓜的博客-CSDN博客

23、js对象比较 js对象比较_木头没有瓜的博客-CSDN博客

24、Object.prototype.hasOwnProperty 和 set.has Object.prototype.hasOwnProperty 和 set.has

25、用js递归的方式写1到100求和？用js递归的方式写1到100求和

26、JS中的逻辑运算符&&、|| 货真请病假 JS中的逻辑运算符&&、|| 货真病假

27、setTimeout,promise,async await 关于async/await、promise和setTimeout执行顺序

28、手写一个promise函数手写一个Promise函数以及实际使用场景

29、红灯3秒亮一次,绿灯1秒亮一次,黄灯2秒亮一次三个灯不断交替重复亮灯

30、js 反转二叉树 js 反转二叉树_丰的传说的博客-CSDN博客_js翻转二叉树

31、js归并排序的实现 js归并排序的实现 - leahtao - 博客园

32、无重复字符的最长子串 JavaScript 无重复字符的最长子串 JavaScript

32、洗牌算法(shuffle)的js实现 https://github.com/ccforward/cc/issues/44

33、数组U型排列？找出最小值，数组一分为二，左边从大到小，右边从小到大

木头没有瓜

关注

0
点赞
踩
13

收藏

觉得还不错? 一键收藏
0
评论
js常见面试基础笔试算法题

1、大数相加计算function addNum(a, b){ let maxLen = Math.max(a.length, b.length); // 取最长 a = a.padStart(maxLen, 0); // 开头补全 b = b.padStart(maxLen, 0); // 开头补全 let sum = ""; let f = 0; // 进位1 for(let i = maxLen - 1; i >= 0;
复制链接

扫一扫