You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
66 lines
2.0 KiB
Vue
66 lines
2.0 KiB
Vue
<template>
|
|
<div>请查看页面源码</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
/**
|
|
* 第一题 1. 冒泡排序
|
|
*/
|
|
function useBubbleSort() {
|
|
const arr = [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5];
|
|
const bubbleSort = (arr: number[]): number[] => {
|
|
const arrLength = arr.length - 1;
|
|
|
|
for (let i = 0; i < arrLength; i++) {
|
|
for (let j = 0; j < arrLength - i; j++) {
|
|
let temp = arr[j + 1];
|
|
if (arr[j] > arr[j + 1]) {
|
|
arr[j + 1] = arr[j];
|
|
arr[j] = temp;
|
|
}
|
|
}
|
|
}
|
|
console.log(arr);
|
|
return arr;
|
|
};
|
|
|
|
bubbleSort(arr);
|
|
}
|
|
useBubbleSort();
|
|
|
|
/**
|
|
* 第二题 1. 防抖函数
|
|
* 防抖函数的作用是，当函数被多次调用时，只有当函数执行结束后，才会执行一次，防止函数被频繁调用。
|
|
* 防抖函数的实现原理是，在函数执行的过程中，设置一个定时器，当函数执行结束后，清除定时器，这样就保证了函数只执行一次。
|
|
* 应用场景一般有：
|
|
* 1. 文本输入框的实时搜索功能，用户输入字符后，函数会在输入结束后才执行，防止函数执行过于频繁。
|
|
* 2. 页面滚动时，函数只在页面停止滚动后才执行，防止函数执行过于频繁。
|
|
* 3. 表单提交时，函数只在用户提交表单后才执行，防止函数执行过于频繁。
|
|
* 4. 窗口大小改变时，函数只在窗口大小改变结束后才执行，防止函数执行过于频繁。
|
|
*/
|
|
function useDebounce() {
|
|
const debounce = (fn, delay) => {
|
|
let timer = null;
|
|
return function (...args) {
|
|
if (timer) {
|
|
clearTimeout(timer);
|
|
}
|
|
timer = setTimeout(() => {
|
|
fn.apply(this, args);
|
|
}, delay);
|
|
};
|
|
};
|
|
|
|
window.addEventListener(
|
|
'resize',
|
|
debounce(() => {
|
|
console.log('窗口大小改变了');
|
|
}, 200)
|
|
);
|
|
}
|
|
|
|
/**
|
|
* 第三题 1. 节流函数
|
|
*/
|
|
</script>
|