- 博客(30)
- 收藏
- 关注
RSS订阅
原创 vue中动态改变对象或是数组数据，页面能够实时刷新数据
vue中动态改变对象或是数组数据，保证页面也是跟着随时改变的，现有三种方法实现：1、改变引用data:{ obj:{ name:'gou', age:18 }},直接更换变量引用obj = { name:'gou', age:18， address:'beijin'}2、 数组使用数组函数pop、push、...
2019-07-29 20:59:28
23157
原创 腾讯云前端面经
腾讯云招聘一共四面，第一面是你以后的同事面试，主要考察基础知识，第二面是以后的直属领导，会考察基础原理，以及和职位的匹配度，三面是主管，考察项目等整体，四面为hr面试。一面：一面都比较基础，涉及js，vue和网络安全。1、自我介绍（单纯的自我介绍，没有根据自我介绍的内容再去问问题）2、算法题：括号对称，具体题目和leecode上的一道提比较类似，但不太一样，（题目忘记了这是leecode上的题目）题目描述：给定一个只包括 '('，')'，'{'，'}'，'['，']' 的字符串，判断
2021-12-30 15:18:50
1322
1
原创 Uncaught Error: ＜br＞[vue-router] route config “component“ for path: /home cannot be a string id.＜br＞
vue中引入路由是报错：Uncaught Error: <br>[vue-router] route config "component" for path: /home cannot be a string id.<br> Use an actual component instead。原因：compontent因为不正确。一开始的写法：解决：修改为：import device from '@/page/device/device' { .
2021-07-13 16:10:37
3221
转载 webpack loader理解
loaderloader 用于对模块的源代码进行转换。loader 可以使你在import或 "load(加载)" 模块时预处理文件。因此，loader 类似于其他构建工具中“任务(task)”，并提供了处理前端构建步骤的得力方式。loader 可以将文件从不同的语言（如 TypeScript）转换为 JavaScript 或将内联图像转换为 data URL。loader 甚至允许你直接在 JavaScript 模中importCSS 文件！示例例如，你可以使用 loader ...
2021-06-17 18:15:01
277
转载 JS里的宏任务和微任务详解
宏任务（macrotask ）和微任务（microtask ）https://www.cnblogs.com/wangziye/p/9566454.html为什么要引入微任务，只有一种类型的任务不行么？面渲染事件，各种IO的完成事件等随时被添加到任务队列中，一直会保持先进先出的原则执行，我们不能准确地控制这些事件被添加到任务队列中的位置。但是这个时候突然有高优先级的任务需要尽快执行，那么一种类型的任务就不合适了，所以引入了微任务队列。macrotask 和 microtask 表示异步任务的两种分类
2021-05-13 09:22:39
481
转载 js 常见的6种继承（原型链继承，构造函数继承，组合继承，原型式继承，寄生式继承，寄生组合式继承）
继承是面向对象的，使用这种方式我们可以更好地复用以前的开发代码，缩短开发的周期、提升开发效率。那么，请你先思考几个问题：JS 的继承到底有多少种实现方式呢？ES6 的 extends 关键字是用哪种继承方式实现的呢？第一种：原型链继承原型链继承是比较常见的继承方式之一，其中涉及的构造函数、原型和实例，三者之间存在着一定的关系，即每一个构造函数都有一个原型对象，原型对象又包含一个指向构造函数的指针，而实例则包含一个原型对象的指针。重点：让新实例的原型等于父类的实例。特点：实例可继承的属性有：实例
2021-05-12 17:41:42
856
原创 JS Arguments对象详解
arguments是一个对应传递给函数参数的类数组对象；使用场景：针对同一个方法被多处调用，但是参数数量不确定的情况下，可以更具arguments索引进行判断。例如：function func1(a, b, c) { console.log(arguments[0]); // 1 console.log(arguments[1]); // 2 console.log(arguments[2]); // 3 } func1(1, 2, 3);1、arg.
2021-05-11 17:39:24
5599
翻译 promise async\await详解
promisepromise是一个异步的解决方案；或者从语法上将，他是一个对象，可以获取异步操作的消息；从本意上讲，他是一种承诺，承诺过一段时间他会返回一个执行结果：resolve 或者reject；promise代表一个异步操作的执行返回状态，这个执行返回状态再创建是是未知的，允许我们为执行结果的成功或失败指定处理方法；functionpromise解决的问题回调地狱promise支持多个并发的请求，用promise.all，并按顺序获取请求后的返回数据promise可以解决异步的问题，但他
2021-04-09 16:13:04
741
原创 js实现堆排序
堆排序：思想：创建大根堆或小根堆，然后将顶部节点移到数组已经排好的顺序之后，heapSort(){var a = [53, 17, 78, 9, 45, 65, 87, 32];let temp;for (let m=a.length -1;m>=0;m--) { temp = a[m]; a[m] = a[0]; a[0] = temp; this.creatDagendui(a)}console.log(a)},creatDagendui(a)
2021-04-08 15:23:12
145
原创 js实现选择排序
思想：每次在数组中找到最小的，放在已排序好的之后所以最后一个一定是最大的，只用排序len-1次实现：for循环n-1次，第二层循环从i+1开始，并且当前min = i；对比a[j]与a[min]的大小，记录min位置；第二层循环结束后，交换i与min位置的值，往复循环 n-1次xuanzeSort(){ var a = [53, 17, 78, 9, 45, 65, 87, 32]; // 找到最小的； for (let i = 0;i<a.length-1;
2021-04-08 15:20:37
94
原创 js实现插入排序
插入排序：思想：每次将关键字插入到已经排好序的子集中空间复杂度：O(1);时间复杂度：最好，已经排序好的：O（n）最坏，逆序：O（n^2）则平均为：O（n^2）稳定性：稳定实现：charuSort(){var a = [53, 17, 78, 9, 45, 65, 87, 32];// 每次将关键字插入到排好的子集中for (let i = 1;i<a.length;i++) { if (a[i]<a[i-1]){ // 只有当前元素比上一个元素小的时候才进行元素
2021-04-08 15:19:14
198
原创 js实现快速排序
思想：最主要的是要找到基准点，第一次快速排序之后，将数组分成两个，一个数组中所有的值都小于基准值，一个都大于；逐次递归对两个数组进行快排；直到 low == high == base实现：kuaisuSort(a,low,high){if (low < high) { let position = this.test(a,low,high); this.kuaisuSort(a,low,position); this.kuaisuSort(a,position+1,
2021-04-08 15:17:46
140
原创 js中的数据类型
1、数据类型数据类型主要包含有：number，boolean，null，undefine，string，symbol，BigInt，object：{array，object，function，Date，Math，RegExp}；[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-miauP8wK-1617866092312)(https://s0.lgstatic.com/i/image2/M01/04/F0/CgpVE1_4DdGAJ_EXAAE38RQC0js096.png
2021-04-08 15:15:37
95
原创 js 闭包详解
JavaScript 中的闭包是相当重要的概念，并且与作用域相关知识的指向密切相关，在大厂的前端面试过程中经常会被提及。作用域基本介绍JavaScript 的作用域通俗来讲，就是指变量能够被访问到的范围，在 JavaScript 中作用域也分为好几种，ES5 之前只有全局作用域和函数作用域两种。ES6 出现之后，又新增了块级作用域，下面我们就来看下这三种作用域的概念，为闭包的学习打好基础。全局作用域在编程语言中，不论 Java 也好，JavaScript 也罢，变量一般都会分为全局变量和局部变量两种
2021-04-08 15:14:25
364
原创 js深浅拷贝-深拷贝，浅拷贝
浅拷贝的原理和实现自己创建一个新的对象，来接受你要重新复制或引用的对象值。如果对象属性是基本的数据类型，复制的就是基本类型的值给新对象；但如果属性是引用数据类型，复制的就是内存中的地址，如果其中一个对象改变了这个内存中的地址，肯定会影响到另一个对象。浅拷贝只能拷贝一层浅拷贝，对象拷贝的时候，基本数据类型不会随之变化，拷贝对象中引用数据类型会出现拷贝后随之改变方法一：object.assignobject.assign 是 ES6 中 object 的一个方法，该方法可以用于 JS 对象的合并等多个
2021-04-08 15:12:46
275
原创 jsthis指向问题： new、apply、call、bind详解
JavaScript 中的 apply、call 和 bind 方法是前端代码开发中相当重要的概念，并且与 this 的指向密切相关 很多人对它们的理解还比较浅显，如果你想拥有扎实的 JavaScript 编程基础，那么必须要了解这些基础常用的方法。希望通过这一讲的学习，你可以彻底掌握它们。为了方便你更好地理解本讲的内容，在课程开始前请你先思考几个问题：1、用什么样的思路可以 new 关键词？2、apply、call、bind 这三个方法之间有什么区别?3、怎样实现一个 apply 或者 call
2021-04-08 15:08:54
164
原创 vue子组件频繁向父组件传值，父组件未更新数据
子组件频繁向父组件传值，父组件未更新数据在实际项目中，我们经常遇到这种情况就是父子组件互相通信。举例：图片上传组件，上传多张图片时，只在页面展示第一张图片，其余不展示，这时并不是所有的数据绑定问题，而是组件通信问题，或是说组件渲染问题。出现这样的情况，其主要原因时进入页面后子组件已经被渲染，当再次更新数据后，子组件未重新渲染导致数据没有实时更新显示。最简单的方法时在调用子组件时加上v-if，...
2019-12-27 17:59:00
1001
原创 日期、Math、数组api及对象api
1、日期格式化var date = new Date();var year=date.getFullYear();var month=date.getMonth();var day=date.getDay();var hour=date.getHours();var minute=date.getMinutes();var second=date.getSeconds();if(m...
2019-10-31 19:57:29
157
原创 Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-
vue 报错：Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop’s value. Prop being muta...
2019-10-31 19:41:19
331
原创 初学vue组件应该注意的细节-子组件不可随意修改父组件数据
1、子组件中，data必须为function，否则报错；只有根组件data可为对象形式错误示范：Vue.compoent('row',{ data:{ }})正确示范：Vue.compoent('row',{ data:function(){ return{ } }， ...
2019-09-27 13:55:54
332
原创 vue组件的性能优化
如果需要对一些组件反复的进行出现和消失的操作，着由几种方法可以实现1、v-if v-show，条件渲染<child-one v-if="type==child-one"></child-one><child-two v-if="type==child-two"></child-two>2、component中的is属性：这里type为...
2019-09-27 13:53:47
982
原创 vue过滤器、计算属性及watch监听
过滤器1、vue中允许自定义过滤器，可用于一般文本常见的格式转换：（1）双花括号中插入值{{message | filterA}}（2）v-bind表达式<div v-bind:id="rawId |formatId"></div>过滤器应该被添加在js表达式的尾部，有管道符号filterseg：本地实例过滤器：竖线与字符串必须有空格<div ...
2019-09-27 13:52:16
537
1
原创 vue组件插槽与作用域插槽
1、在组件中加入自定义的htmlslot标签为vue中特有标签，意为插槽，是指在组件中可以自定义插入dom；//使用组件：<box-content> <div slot="header">header</div> <div slot="footer">footer</div></box-content>...
2019-07-30 21:08:04
688
原创 vue非父子组件之间的通信：bus总线（中央发布令）
1、bus总线中央发布令如图所示，加入组件：1–3需要进行数据传递，一般情况下会通过组件2作为中间者，进行传值；但如果组件：3–3也需要通信，这时候再通过3向上传，一层一层是非常复杂的；vue是一个轻量级的框架，遇到复杂的数据处理时，需要借助其他工具；这里我们使用 bus 总线（中央发布令）代码示例：已下代码中列举了两种组件之间通过change事件进行通信；首先将bus挂载到vue实例中...
2019-07-30 16:30:37
204
原创 vue绑定样式、条件渲染
绑定样式有三种方法；1、类名绑定这里的类名有数据isActived决定；isActived为ture时，div类名为actived<div :class="{actived:isActived}"></div>2、数组绑定<div :class="[className1,className2]"></div>data:{ cl...
2019-07-29 20:57:27
449
原创 js事件冒泡、代理及通用事件封装
1、通用事件封装及代理当动态数据很多时，如何给每个img绑定点击事件-代理；代理的好处：代码简洁，只会对父级dom做一次的事件绑定给浏览器的压力也比较小（内存或渲染的压力）事件冒泡过程：根据dom树形结构一层一层向上冒泡；（阻止冒泡）<div id="div1"> div1</div><div id="div2"> div2</d...
2019-07-28 22:38:10
218
原创 js中异步和单线程使用场景及常见问题
使用异步的场景setTimeoutajax 请求数据图片load 加载点击事件setTimeout异步–结果：100、300、200console.log(100);setTimeout(function(){ console.log(200)},1000);console.log(300)同步–结果：100、200、300consol...
2019-07-26 10:23:40
224
原创 构造函数、原型及原型链
1、构造函数funcion Foo (name,age){ this.name=name; this.age=age; this.class='class-1'; return this;//默认return this，可不用写}var f = new Foo('gouhuan',18);var f2 = new Foo('zhaohuanling',1...
2019-07-26 10:22:26
131
原创 js中this的指向、作用域和闭包
this指向问题1、this在执行的时候才会确定指向的是什么，不执行无法确定。this的几种不同的使用场景构造函数对象属性普通函数call、apply、bind构造函数：this先指向一个空对象，再对this赋值，最后返回this;function Foo(name){ //this = {}; this.name = name; //return...
2019-07-26 10:20:19
351
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人