m0_61933248的博客

原创 JS事件总结

事件捕获：事件由不太具体的节点，更早的接收事件，而最具体的节点应该最后接收到事件（逐级向下传播）如果单击了某个按钮，它们认为单击事件不仅仅发生在按钮上，甚至单击了整个页面。其实不同的就是事件的触发时机，是在捕获阶段触发事件，还是在冒泡阶段触发事件。事件冒泡：事件由当前最具体的元素接收，然后。到较为不具体的节点（文档document），描述的是从页面中接收事件的顺序。Netscape是事件捕获流。2、DOM0级事件处理程序。3、DOM2级事件处理程序。1、HTML事件处理程序。IE事件流是事件冒泡流。

原创 vue对象递归响应式的原理

【代码】vue对象递归响应式的原理。

原创 js中的同步和异步，三种处理异步任务的方式

在async定义的函数里面碰到await会怎么处理呢，那这个async函数的调用执行就会被打断，await后面的代码也会被放到任务队列中，等到await拿到它后面的异步函数返回的promise中的数据，并且js引擎空闲时，再去任务队列执行后续代码。最关键的区别就是js引擎是否能把那些需要很长时间执行，不能立即拿到结果的任务交出去（交出去的动作是同步完成的），让宿主环境去执行，后续通过回调拿到执行的结果，自己则接着去处理后续的任务。这就是我前面说的“交出去”的部分，这部分确实不是JS引擎执行的。

原创 关于浮动和clear清除浮动的新理解

浮动仅仅就是让这个元素脱离文档流，让其在原本文档流的位置横向移动，并且因为浮动元素脱离了文档流，会影响文档流中它附近元素的布局。clear：right 就是当前元素的上边界，不能和前面float： riggt的元素的下边界有重叠。清除浮动就是让这个元素的上边界，不能和浮动元素的下边界有重叠。注意，这里只看这个元素。clear：left 就是当前元素的上边界，不能和。clear: both 就是左右两边都要考虑。float: left的元素的下边界有重叠。

原创 每日前端面试题-如何判断空对象，如何区分数据类型

②如果属性值是函数，undefined，Symbol，JSON.stringigy()会忽略它们。基本类型：string, number, boolean, undefined, null。返回所有属性名构成的数组，包含不可枚举属性，但是不包含Symbol类型的属性。它检查对象自身的、可枚举的属性名个数，性能好，能满足绝大多数业务场景。这是最强大、最准确的类型判断方法。等属性值，存在局限性，一般不推荐在严格的逻辑判断中使用。，包括继承自原型链的属性。类型的属性键），则要使用。创建的属性），可以使用。

原创 回溯法求解N皇后问题

原创 分治法求解最大子序列和问题的思路（无代码，纯讲解）

原创 每日前端面试题-防抖和节流

防抖：事件被触发后，等待一段时间再执行函数，等待期间事件再次触发，需要重新计时。

原创 每日前端面试题-js事件循环

异步任务是通过异步api进行注册的回调函数，异步api本身是同步的，注册的回调函数会放在事件表中，只有这些回调函数等待的外部信号发生时，这些回调函数才会被放到任务队列中，等待js主线程去调用。就是那些不会立即执行，需要等待外部信号（定时器到时、网络响应返回、用户触发事件等）的任务。

原创 每日前端面试题-css塌陷

这里强调一点，只有父子元素的外边距塌陷问题才是因为子元素影响到了父元素的外边距，也就是影响了父元素的外面，所以才能让父元素成为一个BFC的方式解决这个问题。同时设置margin-bottom和margin-top，此时这两个元素本身的外边距就是设置的值，但是实际生效的外边距是这两个值中的较大者，也就是说两个盒子的真实的外边距不是margin-bottom和margin-top的和。就会选择外边距中较大的一个生效。原因：父元素没有设置高度，它的高度是由子元素撑开的，如果子元素设置浮动，父元素的高度就为0。

原创 es6和commonjs模块化规范的深入理解

这个规范的导出方式其实都是在操作module.exports这个对象，exports实际上只是提供的一个简写，exports也是指向module.exports这个对象的，我们可以直接操作这个对象，往这个对象里面添加属性，或者直接module.exports = {}，直接导出一个新的对象。总结：两种方式都是使用一个对象作为对外接口，es6使用的是Module这个实例对象，commonjs使用的是module.exprots这个对象。

原创 多目标优化问题在适应度计算中的支配矩阵

代码执行结果，即最后的支配矩阵。

原创 path模块简单使用

【代码】path模块简单使用。

原创 未在props中声明的属性

我们用一个自定义表单input组件实现v-model来解释这个问题。默认情况下（即不设置。

原创 Vue中data和props数据代理的区别

data和props都通过代理挂载到实例上，支持this.xxxdata的代理属性可枚举），因此打印实例时可见。props的代理属性不可枚举），因此打印实例时默认隐藏，需手动访问才可见。

原创 Vue组件的一些底层细节

当你将这个配置对象注册到Vue实例的 components 选项中时，Vue内部会自动调用 Vue.extend() 方法来处理这个配置对象。- 继承关系 ： VueComponent.prototype.__proto__ === Vue.prototype ，所以组件实例可以访问Vue原型上的方法。1. 组件的注册形式 ：注册的是构造函数，这样Vue才能根据需要多次实例化组件。所以注册的实际上是 Vue.extend() 返回的构造函数。- Vue实例 ：通过 new Vue() 创建，是根实例。

原创 nodejs中http模块搭建web服务器

【代码】nodejs中http模块搭建web服务器。

原创 async/await的基本使用以及fetchAPI的部分细节

关于fetch请求的细节，fetch请求返回的是一个Promise对象，但是，注意哈，上边的代码使用了await处理了返回的Promise对象，也就是说这里最后实际上的返回值是Promise执行完成后的服务器响应对象，也就是response对象。async可以加在函数前，这是这个函数就变成了一个异步函数的环境，但是，很重要的一点，异步函数环境中也是可以有同步代码的，await异步操作之前的同步代码执行是不会受到影响的，但是await异步操作之后的同步代码会延迟执行。

原创 js中异步回调函数的执行机制与事件循环

setTimeOut的延迟事件是1s，但是同步代码的执行需要2s，此时1s后调用栈仍然不为空，定时器的回调函数 fn 会一直在任务队列中等待，只有调用栈完全清空，事件循环才会将任务队列中的回调函数fn放入调用栈执行。2、任务队列：所有异步回调函数，（包括setTimeOut，DOM，Promise等）都会被放入任务队列等待执行。3、事件循环：他的工作就是不断检查调用栈是否为空，如果为空，就会从任务队列中取出第一个任务放到调用栈中执行。1、调用栈：同步代码会按照顺序进入调用栈执行。

原创 手撕JS实现call，apply，bind

就相当于是把myCall的调用者，也就是sayHi那个函数，重新赋值给传给myCall的context参数上下文，也就是person上下文对象，就相当于person对象有了这个方法，然后通过person调用这个方法，this自然就指向了perosn，也就是myCall的参数这样就改变了sayHi函数调用是它内部的this的指向，因为通过myCall函数真正调用sayHi的是person。// 返回一个空对象，且使创建出来的实例的__proto__指向_this的prototype，且完成函数柯里化。

原创 怎么在定义函数参数时给参数设置默认值

/ 输出 null（null 是假值，但不会触发默认值）func2({ num: null });// 输出 10（null 是假值，触发默认值）func1({ num: 0 });// 输出 0（0 是假值，但不会触发默认值）func2({ num: 0 });// 输出 10（0 是假值，触发默认值）// 用 = 设置默认值（仅 undefined 时生效）// 用 || 设置默认值（所有假值都会触发）

原创 用遗传算法解决旅行商问题（JS实现）

下面是js代码实现的，但是js确实天生不适合用来算法，问题规模稍微提高一点，比如种群数量设为1000的时候，代码运行效率真的是非常地慢呀，其实小规模问题，最后的结果还是挺好的，下面看代码，有亿点点长......交叉操作：有序交换个体基因数组中的部分基因，从父代1中选一段基因复制到子代中，再从父代2中选则一段不重复的没有复制到子代的基因，并有序复制到子代中。最佳路径: 6 -> 8 -> 1 -> 0 -> 2 -> 5 -> 7 -> 9 -> 4 -> 3 -> 6。

原创 闭包究竟是什么

表现为 "一个能访问外部函数变量的内部函数"，但本质是函数和其绑定的作用域的结合体。这个概念确实容易混淆，关键是要理解：闭包的核心价值在于。，而不只是函数本身。

原创 每日前端面试题-js中的浅拷贝和深拷贝

这里边的扩展运算符...，对于数组里边的引用类型，复制的仍是这个元素的引用，不是值的复制。浅拷贝的特点：只会给基本类型元素进行拷贝，对于嵌套的对象或者数组，仅仅复制其引用，所以。修改拷贝后的嵌套数据会影响原对象。

原创 js中promise的基本使用

代码的执行过程：pendingundefinedsetTimeout里的回调函数（包含，但它已经被安排进了任务队列，等待时间到了就会触发。0ms ~ 1ms： 调用，向promise注册回调函数，此时promise的状态还是pending，所以回调函数会被promise暂时储存起来(不会立即执行)pending1000ms：异步任务触发调用resolve，resolve是「存入数据的动作」，结果容器是「存储数据的空间」。resolve负责把异步结果 “存进去”，

原创 JS中的原型对象和原型链

prototype指向的是构造函数为所创建的实例准备的一个原型对象，也就是说这个函数的__proto__指向的是另一个，这个函数自身的原型对象。__proto__在对象和函数身上都有，因为函数也是对象。__proto__就是指向这个对象的原型对象，可以说__proto__才真正构成了原型链。找原型对象可以说就是找爸爸，每一个对象的原型对象，也就是它爸爸，只能通过__proto__去找。而他的爸爸在哪呢，其实就是在他的缔造者，他的构造函数身上的prototype属性指向的对象。

原创 JS中的构造函数和普通函数

**在js中，构造函数和普通函数没有什么区别，只是习惯使用大驼峰命名构造函数，普通函数也可以使用 new 关键字去调用。Person { name: '张三' }

原创 vue基础知识点总结

计算属性computed: *****一定注意在计算属性里边写的表面上是一个方法，但是实际上是调用这个方法，并且使用这个方法名字作为vm身上的属性名去使用的，一定不能在插值语法中去调用这个属性fullName(),这样的写法是错误的。// 当有人读取fullName的值的时候，get就会被调用，且返回值作为fullName的值。2.所有不被Vue管理的函数（定时器的回调函数，ajax的回调函数，promise的回调函数）最好写成箭头函数，因为。console.log('numbers改变了')

原创 CoMMEA(Coevolutionary framework for generalized multimodal multi-objective optimization)算法和CMMO算法对比

设计一款无人机，目标为。

原创 CMMO(Coevolutionary Multimodal Multi-objective Optimization)算法的思路

但如果它的目标值接近Pareto前沿，且决策空间分布稀疏，A队可能会保留它（注意这里并不是A队会考虑决策空间的多样性，而是这个多样性的解恰好符合A队的Pareto前沿，所以说是A队被动的选择这个结果，就像上边说的，如果这个多样性的解不符合A队多目标优化的结果，一样会被淘汰）。：B队通过动态调整的ε值，控制“多少稍差的解可以参与进化”，间接影响A队的搜索方向。：两队的后代合并后，A队的环境选择会保留非支配解，B队的环境选择会保留多样性解。，最终A队输出的解集自然包含B队发现的多样性。

原创 关于多模态多目标优化算法的理解

多变量多模态：可能有多个不同的发动机方案，同时还有多个不同的轮胎尺寸方案（这是又一个变量）它们之间可以有多种组合，也就是多种候选方案，当然一个变量也有很多的候选方案，这都是多模态问题。单变量多模态：可能有多个不同的发动机（只是一个变量）方案（比如涡轮增压、电动机），都能达到同样的“速度+油耗”组合。决策空间：就是很多的待选方案，当然这些方案可能只有一个影响因素，也可能有多个影响因素，是这多个影响因素的组合方案。：如果你既要汽车跑得快，又要省油，还要便宜，这就是多目标（互相冲突，跑得快可能费油）。

原创 搜索框仿写

【代码】搜索框仿写。

原创 滑动注册登录页面

【代码】滑动注册登录页面。

原创 块级元素和行内元素

最常见的像是 img input 标签都属于可替换元素，他们的表现像是inline-block，但是实际上属于inline。上下内边距比较特殊，视觉上会生效（背景色、边框会扩展），但是不会影响行高，且不会推开周围的元素。常见的块级元素：div, p, h1~h6, ul, li,section。像是特殊的可替换元素 img input，他们表现得就像是行内块元素。其实就是行内元素的特性，再加上可以设置宽高，内外边距。3.宽高，内外边距都可以设置，但是无效。在一行显示，宽度由内容决定，但是他们可以设置宽高。

原创 position定位的详细总结

例如距离顶部10px的时候，就变成固定定位了，所以sticky这个定位中的top、right、bottom、left设置的是相对定位变成固定定位的阈值，或是临界点，它不会像相对定位和固定定位一样，设置这些值，位置就发生偏移，粘性定位不会。这是绝对定位，top、right、bottom、left的参考对象是最近的已定位的祖先元素（即position的值不是static值的元素）如果没有最近已定位的祖先元素，那么就会相对于初始块（通常是body）进行定位。

原创 关于清除浮动—添加伪元素方法

由于这个添加的伪元素清除了左边的浮动，同时它本身的高度有为零，所以他就相当于是在浮动的box盒子的底部边线处，而这个伪元素又是父容器的子元素，父容器在计算高度的时候需要把这个伪元素也包裹在内，也就是把这个浮动的box元素也包裹在内。浮动的元素，父容器在计算高度的时候是不会计算他的高度的，因为浮动的box相当于在这个父容器的上边，父容器看不到它。

原创 仿写bilibili首页导航栏

【代码】仿写bilibili首页导航栏。

原创 Vue2中实例配置对象的methods和computed配置项的区别

你完全正确：计算属性的键值在模板中表现为一个普通属性（实际是缓存值），而方法的键值表现为一个需要调用的函数引用。这是 Vue 框架有意为之的设计，目的是让开发者写出更高效、更清晰的代码。

原创 关于javascript中的原型

prototype所有函数特有的一个属性，这是一个对象属性，对的，只有函数才有这个属性，即使是普通的函数也有，这个对象属性中有一个constructor属性，这个是默认的，它指向这个函数本身。__proto__是所有对象的属性，是的，所有对象，当然也包括函数，他们内部都有这样一个属性，这个属性就指向了他的原型对象，也就是这个实例对象的缔造者身上的prototype属性。js的原型机制中最重要的就是两个属性，__proto__和prototype。

原创 为什么说javascript中的函数是一等公民

JavaScript 中的函数堪称 “超级对象”，它既具备普通对象的特性，又拥有可调用的能力，并且能够参与各种高阶操作。这种特性让 JavaScript 能够实现函数式编程，还能支持像闭包、回调函数、Promise 等强大的功能。