JS 原生代码面试题

最新推荐文章于 2024-07-27 22:07:59 发布

单调的王先森

最新推荐文章于 2024-07-27 22:07:59 发布

阅读量317

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/weixin_51198863/article/details/113797194

版权

JS 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

JS

数组题型

[‘1’,‘2’,‘3’].map(parseInt)的值是多少？为什么？

解析：
parseInt语法：默认接受两个参数，第一个参数是数组元素，第二个是当前元素下标
在这里插入图片描述

在这里插入图片描述

答案：[1,NaN,NaN]

数组的splice方法

Array.splice(index,num,item)
接收三个参数
index 选择的下标位置
num 从index所在位置开始，包括index，删除几个元素
item 添加或替换成的新元素

splice(index-1,0,item) 当前下标的前一位（index-1），元素不被删除（0），该下标对应元素变为（item），原先元素被挤到后面，下标被迫加1。

题目数组内元素 a 前后互换位置移，b 后前互换位置
a.
arr.splice(index+2，0，newItem)
arr.splice(index,1)

b.
arr.splice(index-1，0，newItem)
arr.splice(index+1,1)

addEventListener执行顺序

案例类型：父盒子嵌套子盒子，父子盒子都有点击事件时，执行顺序如何？

<body>
  <div id="wai">
    <div id="nei" />
  </div>

</body>
<script>
  document.getElementById('wai').addEventListener('click',()=>{
    console.log('wai true');
  },true)
  document.getElementById('wai').addEventListener('click',()=>{
    console.log('wai false');
  },false)
  document.getElementById('nei').addEventListener('click',()=>{
    console.log('nei true');
  },true)
  document.getElementById('nei').addEventListener('click',()=>{
    console.log('nei false');
  },false)
</script>

执行顺序：wai true——nei true——nei false——wai false
在这里插入图片描述

  JS事件流顺序：
  事件捕获（根节点——触发事件节点）——目标属性事件——事件冒泡（触发事件节点——根节点）

如果元素本身带有onclick等事件，称之为元素属性事件。

事件流包括三个阶段：捕获阶段，目标阶段，冒泡阶段

冒泡阶段：事件由最具体元素触发，向上传播的过程
目标阶段：就是你最终触发的那个元素（即目标元素）
捕获阶段：事件由不具体的元素向下查找，直到找到你触发的那个元素，与事件冒泡相反

不用for循环生成0-100的数组

//定时器方法
    let arr=[]
    let i=1
    let timer=setInterval(()=>{
      if(i>=100){
        clearInterval(timer)
      }
      arr.push(i)
      i++
    },1)
    console.log(arr);

//new Array方法
    let arr=new Array(100) // length 100
    arr=arr.join(',').split(',')  // 100个''
    let newArr=arr.map((item,index)=>{
      return item=index+1
    })
    console.log(newArr);
// 展开运算符
[...Array(100)] // 100个undefined
[...Array(100).keys()] // 0-99 的数组