狗哥小黑-CSDN博客

原创【无标题】

前端面试考点1. 继承方式原型链继承构造函数继承组合继承原型式继承寄生继承寄生组合继承 extends继承说出每个继承方式的优缺点原型链继承造成实例原型共享构造函数继承只能继承实例不能继承原型组合继承每次实例化都会执行构造函数继承影响性能原型式继承说服实例指向相同的内存即：原型式继承object.creat() 是通过prototype继承存在共享串改的可能寄生继承增加了自身对象扩展的方法或属性等但同样存在内存共享 object.create继承原因造

2022-01-11 16:24:59 89 1

原创 JavaScript弱类型的问题

1. 异常需要等到运行时才能发现const obj = {}// obj.foo()setTimeout(() => {obj.foo()}, 1000000)=========================================2. 函数功能可能发生改变function sum (a, b) {return a + b}console.log(sum(100, 100))console.log(sum(100, ‘100’))==================

2021-12-23 22:58:45 576

原创详解vue原理之观察模式Dep-＞Watcher

根据前几节课，相信大家都明白的vue的基本原理能够实现vue响应及渲染这如果还不清楚的请看上几篇文章这节课我们讲解vue中数据的响应实现即vue中的观察模式如果还不明白观察模式的也请看我的文章详解js中观察模式和订阅发布模式的区别Dep(Dependency)功能收集依赖，添加观察者(watcher)通知所有观察者结构下面是代码的基本实现 // 要实现数据的响应机制即数据变化视图变化 // 在vue的响应机制中我们要使用观察模式来监听数据的变化

2021-04-25 18:10:32 2427

原创详解vue原理中的编译compiler

前面我们讲了vue五种类型中的vue及ovserver这节课我们讲第三中类型compilerCompiler下面我们简单讲解下compiler的功能和结构功能1：负责编译模板，解析指令/插值表达式2：负责页面的首次渲染3：当数据变化后重新渲染视图结构简单梳理下compiler的实现思路在compiler中我们需要编译模板因此需要遍历当前dom对象即el dom对象中的节点在这里针对每个不同的节点做判断在这里用isTextNode判断文本节点 isElementNode

2021-04-25 16:06:40 1498

原创 vue原理之observer

上节课我们讲了vue五种类型中的vue 实现data响应这节课我们讲第二中类型observerObserver功能负责把 data 选项中的属性转换成响应式数据data 中的某个属性也是对象，把该属性转换成响应式数据数据变化发送通知具体代码实现如下class Observer { constructor(data) { this.walk(data) } // 1. 判断数据是否是对象，如果不是对象返回

2021-04-25 00:08:39 3798

原创 vue原理代码的基本实现

上一篇，我们分析了vue的基本结构这节课我们就按照vue的基本结构去实现我们需要的功能即：vue原理经过上节课的分析我们可以得知Vue的功能1:负责接收初始化的参数(选项)2:负责把 data 中的属性注入到 Vue 实例，转换成 getter/setter3:负责调用 observer 监听 data 中所有属性的变化4：负责调用 compiler 解析指令/插值表达式vue结构在这里给大家分析下_proxyData() 即：代理data 其目的是将data中的数据转换为g

2021-04-24 22:46:11 387 1

原创详解vue实现原理之vue基本结构和功能

**本章我讲向大家讲解vue实现的基本原理该原理我会分成很多个小章节一步一步的为大家讲解咋们小步快跑1. 在模拟vue原理之前我们得明白vue的基本结构以及我们需要实现的基本功能我们打印vue实例关注我们需要模拟的成员2. 如下代码是一个基本的vue实例let vm = new Vue({ el: '#app', data: { count: 1, msg: '文案' }});以上代码vue实例化可以看出vue是一个构造

2021-04-24 21:48:24 951 1

原创详解js中观察模式和订阅发布模式的区别

观察者模式和订阅发布模式的区别是没有事件中心在观察者模式中发布者需要知道订阅者的存在不需要像订阅发布模式一样需要事件中心来隔离订阅者和发布者详细可参考上偏文章详解js中订阅发布模式的原理即运用场景观察者模式中只有订阅者和发布者观察者观察者（订阅者）--watcher 所有的订阅者中都有一个update方法当事件发生的时候会调用所有订阅者的unpdate方法在vue的响应机制中当数据发生变化时会调用观察者的update方法 update方法会去更新视图发布者 update

2021-04-24 18:23:07 482

原创详解js中订阅发布模式的原理即运用场景

订阅发布模式由三部分构成1：订阅者2：事件中心3：发布者具体实现流程发布者发布消息给事件中心事件中心通知所有的订阅者案例1：家长都想知道自己孩子在学校的成绩因此老师就创建了一个群来告知家长学习成绩在这里家长就是订阅者群就相当于是实践中心而老师就是发布者老师只需要向群（事件中心）发布消息所有的家长都能得知消息这就是订阅发布模式案例2vue中的自定义事件在自定义事件中 new一个vue实例这个实例就相当于我们的事件中心 on注册事件在这里就是订阅者而on

2021-04-24 16:54:36 1068

原创 js实例化New原理

要明白new原理就得明白new的实例化过程及返回值1.新生成对象2.链接到原型3.绑定this4.返回新对象具体代码如下相当简单方法一： function Mynew(fn, ...args) { let obj = {}; obj.__proto__ = fn.prototype; let result = fn.apply(obj, [...args]); return result instanceof Object ? result : obj;}

2021-04-04 00:38:37 190

原创高级前端之js数据结构之线二叉树（下）

废话少说，上干货，二叉树数据结构实现增删改查排序等功能 class Node { constructor(key) { this.key = key; this.left = null; this.right = null; } } class BinaryTree { root = null; arr = []; insert(key

2021-03-21 20:11:39 73

原创高级前端之js数据结构之线性结构（下）

双向链表如果你把上面介绍的单向列表都看明白了，那么这里介绍的双向列表其实差不多，无外乎多了一个指针而已从上面的图可以很清楚的看到双向链表和单向链表的区别。双向链表多了一个指向上一个节点的指针。**初始化节点指向前一个节点的指针指向后一个节点的指针节点数据class ListNode { this.prev = null; this.next = null; this.key = key;}初始化双向链表头指针指向NULLclass List {

2021-03-21 01:03:47 90

原创高级前端之js数据结构之线性结构

上一节课我们讲到了基本的堆和队列，不明白的同学可回过头再学习一下，这一节课，我们花时间重点讲一下线性结构在讲数组之前，我们先回顾下开发者常用的数组数组其实是一种线性表的顺序存储结构，它的特点是用一组地址连续的存储单元依次存储数据元素。而它的缺点也正是其特点而造成，比如对数组做删除或者插入的时候，可能需要移动大量的元素。这里大致模拟一下数组的插入操作：function insert(arr, index, data) { for (let i = arr.length; i >index;

2021-03-20 21:05:50 236

原创高级前端之js数据结构与算法

从本篇开始我们讲解js中常用的数据结构与算法咋们小步快跑每篇一个知识点本篇我们讲数据结构__栈栈是一个先进后出的数据结构具体代码实现如下class Stack {items = [];// 入栈push(ele) {this.items.push(ele);}// 出栈pop() {this.items.pop()}// 末位get peek() {return this.items[this.items.length - 1];}// 是否为空栈get isEm

2021-03-20 14:55:17 444 1

原创 js常用的排序方式

最近复习js基本知识发现对时间和空间的复杂度有些含蓄不清，通过排序来梳理一下如下是手写的各种排序方式// 冒泡排序let arrs = [3, 1, 4, 6, 0, 7];function bubbSort(arr) {for (let i = 0; i < arr.length; i++) {for (let j = 0; j < arr.length - i; j++) {if (arr[j] > arr[j + 1]) {[arr[j], arr[j + 1]]

2021-03-20 12:13:35 130

原创 2021 Vue全家桶面试-大厂面试-学会了-高薪等你拿

理解vue的单项数据流所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定：父级 prop 的更新会向下流动到子组件中，但是反过来则不行。这样会防止从子组件意外改变父级组件的状态，从而导致你的应用的数据流向难以理解。额外的，每次父级组件发生更新时，子组件中所有的 prop 都将会刷新为最新的值。这意味着你不应该在一个子组件内部改变 prop。如果你这样做了，Vue 会在浏览器的控制台中发出警告。这里有两种常见的试图改变一个 prop 的情形：这个 prop 用来传递一个初始值；这个子

2021-02-27 12:38:02 455

原创 2021中高级前端面试题

最近为公司面试了一些中高级的前端开发中，主要简单考察了下原型，异步和this指向，如下是自己亲出的一小套测试题！一：有一个类如下function Person(name) {this.name = name}let p = new Person(‘Tom’);1: p.__proto__等于什么？2: Person.__proto__等于什么?二：请写出下面console的值var foo = {},F = function({};Object.prototype.a = ‘value

2021-02-26 09:51:56 2342 6

weixin_43097944的博客