karshey的博客

原创 【TypeScript】阮一峰TypeScript教程笔记：基本用法、any 类型等、类型系统

TypeScript 可以看成是 JavaScript 的超集（superset），即它继承了后者的全部语法，所有 JavaScript 脚本都可以当作 TypeScript 脚本（但是可能会报错），此外它再增加了一些自己的语法。TypeScript 对 JavaScript 添加的最主要部分，就是一个独立的类型系统。类型系统类型是人为添加的一种编程约束和用法提示。目的：提早发现错误。，在TypeScript中会报错，但在JS中不会。动态类型与静态类型JS是动态类型语言，TS是静态类型语言。

原创 【360秋招笔试】编程题第二题：修改Web（C++的AC解法）

但是看到编程题没有给异步输入数据的模板的时候傻眼了。被迫捡起用C++打题的记忆了，不然就寄了。使得等式两边成立，则输出Yes，否则输出No。很典型且要素很多的模拟题，字符串的计算+逆波兰表达式+枚举。想要进行计算，需要将等式（字符串）拆分为数字和字符。总体的过程：将字符串转换为数字和符号、计算。输入的数据范围并不大，所以枚举可以实现。这样，只需要改变参数就可以分别计算等号左边和等号右边。注意，数字的数量会比符号多1，因此可以先把第一个数字压入栈。代码写的乱乱的，也不精简，等有空的时候重新写一下。

原创 js算法：对一个数组进行乱序排序，要求每个元素不会落到原来的位置，且落到其他位置的概率相同

假设1与2换，2与3换，3与1换，那么会就出现1“换到了原位”的情况。这里我们使用一个flag标记，来记录。对一个数组进行乱序排序，要求每个元素不会落到原来的位置，且落到其他位置的概率相同。的被交换过的位置，这个位置是不能再交换的。如1与2换，那么2号位就不能再交换（：使用随机数得到与当前位置交换的下标，不能是当前位置。都会使两边的数组发生改变。，也不会有数字换到原位。

原创 【LeetCode与《代码随想录》】贪心算法篇：做题笔记与总结-JavaScript版

贪心的本质是选择每一阶段的局部最优，从而达到全局最优。

原创 民宿订购APP前端页面效果展示

原创 【前端】场景题：如何在ul标签中插入多个节点 使用文档片段

所以将子元素插入到文档片段中时不会引起页面回流，再将文档片段插入DOM树中，回流一次。因此使用DocumentFragment可以起到。每插入一次li就会回流一次，消耗性能。节点存在于内存中，并。

原创 【前端demo】动态赋值CSS

在这里，显然滑块的滑动是不能失去焦点才触发的（滑块滑动的时候box要同步移动），但颜色的选择可以（可以试一试，改变颜色是选择颜色之后再点击空白区域，方块颜色才会发生改变）。我们的目的是实现动态改变box的样式。这里的root是从html标签开始的整个文档树（DOM树）。对于radius，四个角一起变化的最大值是50%。将CSS变量直接赋值在文档树开头的style，就。因此，如果想改变box的样式，只需改变。拼接直接形成CSS变量，然后直接赋值。注意，这里root中的变量名（注意，颜色的赋值是不用加。

原创 【前端demo】CSV&JSON转换器 原生实现：CSV转换为JSON，JSON转换为CSV

要判断输入的CSV或JSON是否是对应类型，不是的话就alert提示，并不予转换。转为对象后看是否是数组，不是的话就转为数组（a转为数组的方法：[a]）后若用空格，理论上应该可以转换为JSON，但这里的代码并不能实现。，当窗口压缩到很小时，里面的字就压缩到看不到了。先判断是否是对象，不是的话就把JSON转为对象。功能不够严谨，比如输入的CSV是以逗号。再获取内容，即所有对象的value。先获取表头，即数组对象的key。可以对输入的CSV预处理一下。参考链接里输入的CSV的。

原创 【前端demo】倒计时器 可选择时间 原生实现

背景是一种绿色，字体颜色color是白色（或偏白色的浅绿色），影子text-shadow的阴影颜色是深绿色。的递归调用，会调用很多次函数。第1秒的时候调用1次，第2秒时调用2次（原本的和新递归出来的），第3秒调用4次…我们获取选择的时间后，就可以计算选择的时间与当前时间的差值，然后需要写一个计时器。使得body占满整个窗口，此时就有内容的上下居中效果了。都输出当前时间：很显然，每次都要调用一次。想要获取时间：这样就可以把点击的时间传入。想让body的内容上下居中，设置了。，这样才会有秒数动态减少的效果。

原创 【前端demo】背景渐变动画

可能也会出现height为0的情况，这是需要令html的。注意，直接在body上加。

原创 【前端demo】圣诞节灯泡 CSS动画实现轮流闪灯

水平阴影的位置|垂直阴影的位置|模糊距离|阴影的尺寸|阴影的颜色|将外部阴影 (outset) 改为内部阴影。点击OFF时：相当于添加了停止动画和灰色背景色的样式，覆盖了原先的样式。因此，点击ON时：需要把OFF添加的style去除掉。也可以亮灯，因为没有style后就显示原先CSS的亮灯效果了。想要有按钮ON和OFF，点击ON就开灯，点击OFF就关灯。我们希望灯泡闪亮是按顺序的：粉色先，蓝色其次，最后绿色。OFF按钮的事件：获取节点，并设置关灯。实现方法：为灯泡设置动画开始的时间，即。

原创 【前端demo】简易计算器 原生实现

注意，table的margin是失效的。

原创 【前端demo】CSS border-radius可视化 原生实现

/ 事件委托 获取子元素的data-index：event.target.attributes[2].value。不知道在哪的话可以输出event看看。

原创 【前端demo】将二进制数转换为十进制数 原生实现

https://github.com/florinpop17/app-ideas文章目录效果JavaScript实现进制转换原生代码遇到的问题效果二进制转换为十进制若输入为空或不是二进制，提示清空JavaScript实现进制转换parseIntparseInt('111',2)手动实现bin是输入的字符串。function Bin2Dec(bin) { let dec = 0; for (let index = bin.length - 1; index

原创 【前端】求职必备知识点4-CSS：flex、隐藏元素（7种方法）、单位

R表示红色，G表示绿色，B表示蓝色，三种颜色的值都可以是正整数或百分数。A表示Alpha透明度。取值0~1之间，类似opacity。px % em 这3个单位，可以适用于大部分项目开发，且拥有较好兼容性。flex-grow 和 flex-shrink 在 flex 属性中。将影响元素盒模型的属性设置为0，若有元素内有子元素或内容，应该设置其。则为 1，flex-basis 为 0%。都能实现透明效果，但最大的。

原创 【前端】求职必备知识点3-CSS：BFC、position、两栏布局、三栏布局、水平居中（6种方法）、垂直居中（7种方法）

上述式子中，top和bottom为0，margin等于auto，此时浏览器为了满足这个等式会把上下的距离均匀分给margin，即达到我们想要的居中效果。横向也是一样的道理。原理：对当前元素的position设置为absolute，并且相对于父元素定位。的三栏布局：注意绝对定位的元素脱离文档流，相对于最近的已经定位的祖先元素进行定位。因此需要知道子元素的大小。原理：属于同一个BFC的两个相邻的Box的margin会发生重叠。原理：计算BFC的高度时，浮动子元素也参与计算。相对于该元素所在行的基线的垂直对齐。

原创 【前端】CSS垂直居中的7种方法

因此，如果我要让box在wrapper里面垂直居中，我可以在wrapper的div里面加一个div。vertical-align 属性设置元素的垂直对齐方式。该属性定义行内元素的。样式，那么box就可以在div里面垂直居中了。相对于该元素所在行的基线的垂直对齐。，同样的给box一个。

原创 【前端】CSS水平居中的6种方法

左右两边间隔相等的居中。

原创 【前端】求职必备知识点2-CSS：优先级、盒子模型、标准流、浮动流、定位流

由于相对定位是不脱离标准文档流的，而且相对定位的元素会占用标准流中的位置，所以当给相对定位的元素设置margin padding等属性时会影响到标准流中的布局，即。设置了clear属性的元素，相应的会在两侧按照没有浮动元素的样式排下去，所以不会受到浮动元素的影响，从而实现清除浮动。子元素浮动后，由于父级元素没有高度，下面的元素会顶上去，造成页面的塌陷。因此，需要给父级加个。关于为什么说浮动流是“半”脱标准流：因为浮动的盒子的位置会受到前面的标准流的影响。，只在父盒子内部影响，不影响外面的其他盒子。

原创 【前端】求职必备知识点1-HTML

呈现，就是把如何渲染html页面的权利交给了浏览器，有多少种浏览器就有多少种展示方式。比如章节、页眉、页脚或文档中的其他部分。如侧栏、文章的一组链接、广告、友情链接、相关产品列表等。main，帮助到搜索引擎以及搜索工程师找到网站的主要内容，本身并不承载特殊的功能和意义。address： 作者、相关人士或组织的联系信息（电子邮件地址、指向联系信息页的链接）。article： 定义外部的内容，其中的内容独立于文档的其余部分。footer：页脚，只有当父级是body时，才是整个页面的页脚。

原创 【小程序】封装弹出框+选择器组件：选择器选择

activityName和terminal的数据实际上不止这些。比如，我们需要通过网络请求接口请求到数据然后动态添加进activityName和terminal中。我们可以在onShow中调用请求接口的方法。只是记录自己敲码的过程，水平很烂。这个功能感觉很常见，记录一下。

原创 【MySQL】解决mysql：ERROR 1045 (28000): Access denied for user ‘root‘@‘localhost‘ (using password: NO)

my.ini在sql的跟目录上。如果忘记sql的位置，可以。一开始登入的时候报ERROR 2003.我怀疑是前面重装了sql产生的问题。添加在[mysqld]下，保存。就知道安装在哪里了。

原创 【小程序】封装时间选择组件：用单元格van-cell和插槽slot，包括起始时间和终止时间

用的组件：Cell单元格、DatetimePicker时间选择、Popup弹出层。用来在js方法中得知选择的是开始还是结束的时间。注意，这里的van-cell的value放的是时间选择器，以。功能并不完善，比如没有end必须>=start的判断等。时间选择器放在van-cell的value插槽中。可以选择起始时间和终止时间，并显示。只是记录自己敲码的过程，水平很烂。这个功能感觉很常见，记录一下。实现value的插槽，而不是。根据文档：这里要求用。会用到dayjs库。

原创 【小程序】bug：methods中方法传参报错：Component “页面路径” does not have a method “方法名” to handle event “事件”.

经过一系列对比，并没有单词拼错等问题。这样就可以完成传参。

原创 【小程序】setData与this.value直接赋值

频繁渲染可能会卡顿或闪退。

原创 【MongoDB bug】“errmsg“ : “db already exists with different case already have: [Starwar] trying to cre

好坑，如果我第一次创建的database是starWar或者是其他奇怪的大小写组合，我大概一辈子都找不到解决的方法。尽管数据库名称在服务器端是不区分大小写的，但是有些行为会导致问题，因为我们并不总是不区分。

原创 【前端】css踩坑：空元素的外边距不生效、内边距生效

一个空元素的高度、边框、外边距都是0，上下内边距为20px，那么这个空元素的框模型的高度为40px。一个空元素的高度、边框、内边距都是0，上下外边距为20px，那么这个空元素的框模型的高度为0。

原创 【小程序】输入框检验姓名、身份证（正则表达式）并提交

【代码】【小程序】输入框验证姓名、身份证（正则表达式）

原创 【小程序】input输入双向数据绑定

小程序中，如上代码，我们绑定了输入框的数据amount，并绑定了输入事件inputRealmoney。value属性绑定的是输入框的初始内容。如果输入数据，不会绑定到amount中：123是，即输入的数据；500是amount，即value绑定的初始数据。解决的方法：在bindinput的事件中设置amount。注意，用this不要用箭头函数。

原创 【小程序】为什么使用let that=this

而不是使用时所在的作用域指向的对象。这与箭头函数的作用域有关。

原创 【小程序】手动实现switch开关中带文字效果（开关左右文字相同/不同都可以）

配合wx:show：或true。

原创 【前端八股文】vue系列：vue的优点和特点、生命周期、ref、$nextTick

vue系列：vue的优点和特点、生命周期、ref、$nextTick

原创 【前端八股文】JavaScript系列：Set、Map、String常用属性方法

JavaScript系列：Set、Map、String常用属性方法

原创 【前端八股文】JavaScript系列：Array方法

JavaScript系列：Array方法

原创 【前端八股文】浏览器系列：性能优化——HTML、CSS、JS、渲染优化

浏览器系列性能优化不完全总结

原创 【题解】百度2021校招Web前端工程师笔试卷（第一批）：单选题、多选题

【题解】百度2021校招Web前端工程师笔试卷（第一批）：单选题、多选题

原创 【题解】百度2020校招Web前端工程师笔试卷（第三批）：单选题、多选题

【题解】百度2020校招Web前端工程师笔试卷（第三批）：单选题、多选题

原创 【题解】百度2020校招Web前端工程师笔试卷（第二批）：单选题、多选题

【题解】百度2020校招Web前端工程师笔试卷（第二批）：单选题、多选题

原创 【题解】百度2020校招Web前端工程师笔试卷（第一批）：单选题、多选题

【题解】百度2020校招Web前端工程师笔试卷（第一批）：单选题、多选题

原创 【前端八股文】浏览器系列：浏览器渲染、前端路由、前端缓存（HTTP缓存）、缓存存储（HTTP缓存存储、本地存储）

前端-浏览器-八股文