- 博客(79)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 《前端面试题》- JS基础-继承实现
问题编写一个类和类继承，类名为Person，属性name,age,方法sayHello.一个Student类，继承自Person，自有属性score,自有方法study(请用ES5和ES6两种技术分别实现)实现ES6// 编写一个类和类继承，类名为Person，属性name,age,方法sayHello.// 一个Student类，继承自Person，自有属性score,自有方法s...
2024-04-16 12:26:17
234
原创 《前端面试题》- JS基础 - 函数和箭头函数在全局下的this指向
我们知道箭头函数有一个作用是解决this的指向问题。函数的this是谁调用，就指向谁；箭头函数的this是在哪定义就指向谁，那么如果是在全局定义执行箭头函数，this指向谁呢？测试<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta htt...
2024-04-16 08:58:48
78
原创 vs code: korofileheader 配置
korofileheader 注释插件 设置里面找到 Custom Made 写入以下配置// file header "fileheader.customMade": { // 头部注释 "Author": "zzh", "Date": "Do not edit", "LastEditors": "zzh", "LastE...
2024-04-16 08:58:00
550
原创 算法四：数字-复数计算
输入两个复数，计算乘积，i^2 = -1。假设 输入， “1+1i”，“1+1i” 输出为：0 + 2i输入 “1+-1i”，“1+-1i”，输出为：0 + -2i严格按照格式输入，不用考虑空格之类的特殊情况，输出也需要严格按照格式输出。function getResult(input) { const newInput = input.replaceAll('i','').rep...
2024-04-15 07:42:05
130
原创 Windows下如何利用命令打开一个文件或者文件夹
这里使用的命令时start例如，我想打开host文件夹所在地址，那么我便可以在控制台中输入：start C:\WINDOWS\system32\drivers\etc 即可。如果我想直接打开host文件，start notepad C:\WINDOWS\system32\drivers\etc\hosts指定打开文件程序和文件即可。所以，在windows下，如果有些打开命令是常用的，便可将它...
2024-04-14 11:27:33
670
原创 算法五：数字-找出数组中第二大的数
问题：给定一个数字数组，如何找出第二大的数字？例如[1,3,5,2], 第二大的数字就是3。方法一：利用排序function getSecondMaxNum(arr) { const sortedArr = arr.sort(function(x,y){ return y - x; }); let max = sortedArr[0]; fo...
2024-04-14 11:26:42
615
原创 webpack or vite? vuex or pinia?
2022.2.18, 新建一个vue3的项目，过程如下：目录结构如下：当还在犹豫选择webpack还是vite，vuex或者pinia的时候，尤大大已经给出了默认选择，vite && pinia。...
2024-04-14 00:25:58
243
原创 《前端面试题》- JS基础 - 防抖和节流
在界面触发点击，滚动，输入校验等事件时，如果对事件的触发频率不加以限制，会给浏览器增加负担，且对用户不友好。防抖和节流就是针对类似情况的解决方案。防抖防抖(debounce)：当连续触发事件时，一定时间段内没有再触发事件，事件处理函数才会执行一次，如果设定的时间到来之前，又一次触发了事件，就重新开始延时。示例：<!DOCTYPE html><html lang="en"...
2024-04-13 22:25:16
516
原创 《前端面试题》- JS基础 - 如何在JS下实现lambda表达式
题目自己实现find方法，达到这样输出的效果// data参数 var data = [{ userId: 8, title: 'title1' }, { userId: 11, title: 'title2' }, { ...
2024-04-13 12:00:29
295
原创 《前端面试题》- JS基础 - 伪数组
第一次听说伪数组这个概念，听到的时候还以为是说CSS的伪类呢，网上一查，这东西原来还是个很常见的家伙。何为伪数组伪数组有两个特点：具有length属性，其他属性（索引）为非负整数但是却不具备数组的方法也就是看起来像是数组，然而并不是…举个例子看看函数内部的argumentsfunction testArguments(a, b, c) { console.log(`arguments is array: ${Array.isArray(arguments)}`); c
2024-04-11 23:19:56
1155
原创 《前端防坑》- JS基础 - 你觉得Boolean(‘false‘) === false吗？
问题你觉得Boolean('false') === false吗， Boolean([]) === false吗？答案Boolean('false') === true, Boolean([]) === true验证原因Boolean 对象表示两个值："true" 或 "false"但是能使Boolean为flase的只有6种情况：undefined(未定义，找不到值时...
2024-04-11 23:19:06
549
原创 《前端面试题》- CSS - 利用flex设置水平垂直居中
核心代码display: flex; align-items: center; justify-content: center;实例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compat...
2024-04-11 23:17:57
121
原创 《前端面试题》- 编程题- 数字交换一次得到最大的数字
输入一个数字(整数)，交换两位数字，最多交换一次，输出可以得到的最大的数字，如输入：1234交换1，4后，得到4231；function exchangeNum(num) { let result; if (num > 0 && Number.isInteger(num)) { const nu...
2024-04-11 07:49:00
394
原创 算法三：排序 - 洗牌算法
实现方式function shuffle(arr) { let newArr = arr; for (let i = newArr.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)); [newArr[i], newArr[j]] = [newArr[...
2024-04-11 07:48:20
142
原创 《前端防坑》- JS基础 - 你觉得typeof nullValue === null 么？
问题JS原始类型有6种Undefined, Null, Number, String, Boolean, Symbol共6种。在对原始类型使用typeof进行判断时,typeof stringValue === 'string'typeof numberValue === 'number'如果一个变量(nullValue)的值为null，那么typeof nullValue === "?...
2024-04-10 20:54:15
346
原创 《前端面试题》- React - 连续两次setState会渲染几次？
问题连续两次setState会渲染几次?回答一次React 可以将多个setState() 调用合并成一个调用来提高性能实例假设有一个组件：import React from 'react';export default class TestState extends React.Component { constructor () { super();...
2024-04-10 20:53:51
582
原创 JavaScript练习 - 数据监听和双向绑定-Object.defineProperty
在使用vue时，我们在最初对数据响应式就会遇到一个概念，叫数据绑定。至于vue中怎么写的并不是很清楚，只是知道vue2里面利用object.defineProperty方式对get/set进行拦截。知道这个概念基本大概知道怎么去实现了。可能不对，只是在表象上进行一次模拟。示例如下：代码如下：<!DOCTYPE html><html lang="en">...
2024-04-10 07:40:14
712
原创 《前端面试题》- JS基础 - 简单谈谈ES6新增了哪些内容
问题简单谈谈ES6新增了哪些内容回答ES新增的对象有：Symbol、Set、Map、WeakSet和WeakMap、ArrayBuffer、TypedArray、DataView、Promise、GeneratorFunction 和 Generator、Reflect、Proxy具体可参考：https://www.jianshu.com/p/b54f7ad1cae3https://ww...
2024-04-10 07:38:59
922
原创 《前端面试题》- CSS - CSS选择器的优先级
行内样式+1000d选择器+100属性选择器、class或者伪类+10元素选择器，或者伪元素+1通配符+0参考网址：https://blog.csdn.net/jbj6568839z/article/details/113888600https://www.cnblogs.com/RenshuozZ/p/10327285.htmlhttps://www.cnblogs.com/...
2024-04-09 21:59:48
367
原创 《前端面试题》- JS基础 - call()、apply()、bind() 的区别
call 、bind 、 apply 这三个函数的功能都是改变this的指向问题，但是也存在一定的区别。call 的参数是直接放进去的，第二第三第 n 个参数全都用逗号分隔,apply 的所有参数都必须放在一个数组里面传进去bind 除了返回是函数以外，它 的参数和 call 一样。对比的时候，以call为基准，call的使用方式形如：obj.say.call(objCall,'YES...
2024-04-09 21:59:08
414
原创 《前端面试题》- CSS - 如何画半圆
设置一个长是宽的两倍的长方形，然后根据需要利用border-radius去除两个顶角。实例(画了四个半圆)：代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" c...
2024-04-08 23:36:06
185
原创 《前端面试题》- JS基础 - JS是不是面向对象的语言
问题JS是不是面向对象的语言？答案不是，JS是基于对象的语言。面向对象有三大特征(封装、继承、多态)JS只能封装，模拟继承，没有多态的特征。参考文章注意：这里MDN介绍的是JS如何面向对象编程，但没说JS是面向对象的语言。https://zhuanlan.zhihu.com/p/348473062https://www.php.cn/js-tutorial-15296.htmlhttps...
2024-04-08 07:42:56
315
原创 《前端面试题》- CSS - 画一根0.5px的线
题目：如何利用css实现一个0.5px的线答：利用transform的scale(scaleY)属性实践：实践结果code：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compat...
2024-04-08 00:12:18
284
原创 自定义gitlog格式
git log命令非常强大而好用，在复杂系统的版本管理中扮演着重要的角色，但默认的git log命令显示出的东西实在太丑，不好好打扮一下根本没法见人，打扮好了用alias命令拍个照片，就正式出道了！在使用git查看log的时候，可以利用别名，创建属于自己的log样式，可以定义颜色，内容，格式等。以下是我的设置方式：git config --global alias.mylog "log --...
2024-04-07 20:20:46
561
原创 vue3 keep-alive include失效问题
在使用vue3 keep-alive时，发现并没有起作用, 代码如下：<template> <div class="app-main"> <router-view v-slot="{ Component }"> <keep-alive :include="cachedViews && cachedViews.map((...
2024-04-07 20:19:52
2857
3
原创 Vue3调试
在这里，我们也可以对components中的数据进行修改，也会触发界面的重新渲染。在浏览器中调试是最常见的一种方式，即使部署了代码，只要将sourcemap打开（vite.config.ts->build->调试是开发过程中必备的一项技能，掌握了这项技能，可以很好的定义bug所在。我们在开发vue3的时候， 如果借用浏览器调试的话，需要安装一个浏览器插件：vue developtools。这里仅说明如何调试与vue3相关的，其他还有关于dom/css等相关的调试修改，不在此处赘述。→ F5, 启动调试。
2024-04-06 23:53:59
908
1
原创 vite打包失败 - out of memory
在做项目时，随着需求的不断增加，我们的代码文件会越来越大，但是在打包时，在 Node 中通过 JavaScript 使用内存的大小却是有限制的。于是，今天打算部署代码时，报错了:<--- JS stacktrace --->==== JS stack trace =========================================0: ExitFrame [pc...
2024-04-06 21:35:09
7451
4
原创 《图解Vue3.0》- 调试
如何对vue3项目进行调试调试是开发过程中必备的一项技能，掌握了这项技能，可以很好的定义bug所在。一般在开发vue3项目时，有三种方式。代码中添加debugger;使用浏览器调试：sourcemap需启用vs code 调试：先开启node服务，后启用vs code的调试模式具体使用如下：debugger调试法当打开开发者模式时才会起作用(F12), 但是使用完之后将其删除，...
2024-04-06 15:08:36
2076
2
原创 手机短视频设置背景文字工具
以前喜欢发抖音，内容是一些古诗文，然后找不到合适模板，于是自己就写了一个小工具，功能如下：时间展示、支持选择背景、设置背景的透明度、设置古诗文题目、设置古诗文内容、设置古诗文译文。当设置好了以后，使用截...
2024-04-06 07:30:00
436
原创 LogicFlow 在HTML中的引入与使用
LogicFlow的引入与使用，相较于BPMNJS相对容易一些，更加灵活一些，但是扩展代码可能写得更多一些。
2024-04-05 23:36:03
403
原创 BPMNJS 在原生HTML中的引入与使用
在网上看到的大多是基于vue使用BPMN的示例或者教程，竟然没有在HTML使用的示例，有也是很简单的介绍核心库的引入和使用，并没有涉及到扩展库。于是简单看了下，真的是一波三折，坎坎坷坷。不过结局还算是好的，最终也能在HTML中直接使用BPMNJS了。可能还有一些扩展没有涉及到，但是目前的功能应该已经基本符合需求了。
2024-04-05 23:34:46
1391
原创 html5如何在使用原生开发的情况下实现组件化
我们知道如何在vue/react中使用组件化开发，那么如果只是一个简单的界面，一个HTML就搞定的事情，你还会去新建一个vue/react项目吗？在使用原生HTML开发时，我们也会遇到一些常见的功能、模块，那么如何在原生HTML中使用组件化呢？其实最典型的代表就是JQuery了。常见的实现方式有两种，一种是利用class预定义某些特定的组件，另一种是使用JS初始化的方式，选择到某个DOM，然后生成对应的组件。
2024-04-05 15:10:07
543
原创 VS 点击页面自动定位到解决方案资源管理器目录位置
Tools->Option->Projects And Solutions->General, tick “track Active Item in Solution Explorer”工具-> 选项->项目和解决方案-> 常规-> 在解决方案资源管理器中跟踪活动项展示结果：如果我的博客对你有帮助、如果你喜欢我的博客内容，请 “点赞” “评论” “收藏” 一键三连哦！听说 ???? 点赞 ???? 的人运气不会太差，每一天都会元气满满哦 嘿嘿!!! ❤️
2024-04-03 07:46:41
2943
1
原创 VS 切换编程背景图
工具->扩展和更新->下载ClaudiaIDE重启VS2019工具->选项->ClaudiaIDE，根据自己的喜好修改图片，图片大小以及透明度。看着如此美丽的风景，敲代码的心情也会好很多，哈哈~如果我的博客对你有帮助、如果你喜欢我的博客内容，请 “点赞” “评论” “收藏” 一键三连哦！听说 ???? 点赞 ???? 的人运气不会太差，每一天都会元气满满哦 嘿嘿!!! ❤️ ❤️ ❤️大家的支持就是我坚持下去的动力。点赞后不要忘了???? 关注 ????我哦！个人
2024-03-29 07:44:26
1405
1
原创 Web Components使用（一）
在使用Web Components之前，我们先看看上一篇文章Web Components简介，其中提到了相关的接口、属性和方法。正是这些接口、属性和方法才实现了Web Components的主要技术：Custom elements（自定义元素）、Shadow DOM（影子DOM）、HTML templates（HTML模板）。由于并不是所有的接口以及接口所包含的方法都会被用到，所以我们从实际的案例出发，逐步了解Web Components的使用。需求1：创建一个基础的组件，包含一个输入框，和一个but
2024-03-28 07:43:16
5308
4
原创 Web Components简介
简介谷歌公司由于掌握了 Chrome 浏览器，一直在推动浏览器的原生组件，即 Web Components API。相比第三方框架，原生组件简单直接，符合直觉，不用加载任何外部模块，代码量小。目前，它还在不断发展，但已经可用于生产环境。组件化、复用，这几乎是所有开发者追求的东西。Web Components API就是为此而提出。可以使用来创建封装功能的定制元素，可以在你喜欢的任何地方重用，不必担心代码冲突。Web Components API允许我们创建可重用的定制元素，并且在我们的web应用中直接使
2024-03-27 07:43:43
3257
1
原创 Web Components初探
组件化，标签语义化，是前端发展的趋势。现在流行的组件化框架有React、Vue等，标签语义化在H5中添加的article、dialog等。Web Components 就是类似的一套技术，允许您创建可重用的定制元素，并且在您的web应用中使用它们。Web Components由三项主要技术组成，它们可以一起使用来创建封装功能的定制元素，可以在你喜欢的任何地方重用，不必担心代码冲突。**Custom elements（自定义元素）：**一组JavaScript API，允许您定义custom elem
2024-03-26 07:42:09
712
1
Docker Community Edition 18.06.1-ce-win73 2018-08-29
2020-10-14
licecap录屏生成gif
2020-10-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人