- 博客(244)
- 收藏
- 关注
RSS订阅原创 【JS基础】call apply bind
如果函数不在严格模式下，null 和 undefined 会被替换为全局对象，并且原始值会被转换为对象。如果函数不在严格模式下，null 和 undefined 将被替换为全局对象，并且原始值将被转换为对象。是返回绑定this之后的函数，如果这个新的函数作为构造函数被调用，那么this不再指向传入给bind的第一个参数，而是指向新的实例。一个类数组对象，用于指定调用 func 时的参数，或者如果不需要向函数提供参数，则为 null 或 undefined。argsArray 可选。
2024-08-24 16:11:34
358
原创 【JS基础】this
对于setTimeout中的函数，这里存在隐式绑定的this丢失，也就是当我们将函数作为参数传递时，会被隐式赋值，回调函数丢失this绑定，因此这时候setTimeout中的this指向window。注意：开启了严格模式，只是使得函数内的this指向undefined，它并不会改变全局中this的指向。因此this1中打印的是undefined，而this2还是window对象。箭头函数内的this是由外层作用域决定的。
2024-08-12 16:12:14
450
原创 【JS基础】执行上下文和执行栈
执行上下文是当前JavaScript代码被解析和执行的一个环境。执行上下文包含了当前代码的变量和函数声明、作用域链、this的值等信息。
2024-08-08 15:13:25
523
原创 vue JSX实现一个通用表单生成器
项目中有大量的简易表单，使用组件将其封装起来提高工作效率该组件封装不适用于太具有个性化的表单使用冻结优化配置信息。
2022-07-24 19:02:25
1588
原创 Vue.js全局API——directive
实现一个自定义loading指令 请求数据还未返回加载loading,数据加载完成loading隐藏 一、创建指令 src目录新建directives文件夹 loading.js import Vue from "vue" import Loading from './loading.vue' console.log('Loading', Loading) const loadingDirective = { // v-loading 所绑定的元素插入到页面上时触发 inserte
2022-05-29 22:38:32
692
原创 Vue.js全局API——filter
情景 将后台存的数字订单状态格式化显示在前端 使用filter 新建filters文件 order.js 写处理订单的filter方法 export default { setOrderStatus (status) { switch (status) { case 1: return '待付款' case 2: return '待发货' case 3: ret
2022-05-24 21:36:00
571
原创 5道偏原理的面试题
写在前面 CSDN话题挑战赛第1期 活动详情地址：https://marketing.csdn.net/p/bb5081d88a77db8d6ef45bb7b6ef3d7f 参赛话题：前端面试宝典 话题描述：欢迎各位加入话题创作得小伙伴，如果我没有猜错得话，我觉得你是应该同我一样是一位前端人。如今前端在IT事业中的占比越来越重，已经成为不可缺少的部分，前端技术也是层出不穷，各种技术类、技术框架也蜂拥而出，前端面试的难度也随之增加，如果我们拥有一套前端面试宝典。如果你是应聘者：你就可以从容的solo面试官，
2022-05-20 22:07:51
602
原创 使用Vue的mixin混入打造UI组件库
一、定制自己的组件 在src下新建一个libs 设计组件传值样式 Button.vue <template> <button :class="['my-btn', btnStyle]"> <slot></slot> </button> </template> <script> export default { name: 'MyBtn', props: { btnStyle: Stri
2022-05-19 23:35:15
283
原创 重写forEach解决异步问题
情景 需按顺序调用的接口无法使用forEach遍历调用 // 已封装的promise请求数组 const fetchList = [getInfo, getData, gettable] fetchList.forEach(async (item) => { await item() }) 这里生成的是多个async函数，无法保证其执行顺序 forEach封装 forEach源码 // Production steps of ECMA-262, Edition 5, 15.4.4.1
2022-05-18 00:08:03
266
原创 extend实现一个modal函数式组件
效果 实现 一、封装一个基础modal弹窗 新建一个messageBox组件 messageBox.vue <template> <div :class="['message-box', type]"> <div class="inner"> <header class="header"> <h1 class="title">{{title}}</h1> <s
2022-05-17 00:01:25
400
原创 一道关于arguments的面试题、匿名立即执行函数
arguments和实参的关系 情景一： function side(arr) { arr[0] = arr[2] } // 这里c有初始值，会运用到es6结构赋值，就是处于严格模式下 function fn(a,b,c = 3) { c = 10 side(arguments) // 不会影响到abc // a: 1, b:1, c:10 return a + b + c } fn(1,1,1) // 12 情景二： function side(arr)
2022-05-14 23:59:41
369
原创 Object和Map的区别
概念 Object是最常用的一种引用类型数据，可用于存储键值对的集合，在ECMAScript 1st 里添加的 Map是键值对的集合，采用Hash结构存储，在ECMAScript2015版本里新增的 Hash，一般翻译做散列、杂凑，或音译为哈希，是把任意长度的输入（又叫做预映射pre-image）通过散列算法变换成固定长度的输出，该输出就是散列值。这种转换是一种压缩映射，也就是，散列值的空间通常远小于输入的空间，不同的输入可能会散列成相同的输出，所以不可能从散列值来确定唯一的输入值。简单的说就是一种将
2022-05-13 23:28:09
2041
原创 JS中的稀疏数组与密集数组
一、概念 密集数组： 占据连续的内存空间，数组元素之间紧密相连，不存在间隙 const arr = [1, 2, 3, 4, 5] 稀疏数组: 数组原素之间存在间隙 const arr = [1, 2, 3] arr[9] = 9 arr // [1, 2, 3, empty × 6, 9] 二、特点 对于稀疏数组中empty不能用filter、map、forEach等方法处理 const arr = [1, 2, 3] arr[9] = 9 arr // [1, 2, 3, empty × 6,
2022-05-12 21:57:00
433
原创 2021年度总结——波澜不惊
回首2021，展望2022 时光如梭，今天是2021年的最后一天了，回想这一年，感觉忙忙碌碌了一年，仔细想想感觉啥也没干，总的来说今年时光依旧，波澜不惊吧。 健康 年底的体检是对自我感觉良好赤裸裸的打脸，各种大大小的毛病，平时对嘴巴放纵迟早会在身体上体现出来的，还有就是工作的原因导致作息不规律， 跑步锻炼计划断断续续，缺乏运动。 在2022新的一年里做以下规划： 调整作息时间，按时吃饭 跑步锻炼不能放弃 双休周末多去运动，少待在家里打游戏 个人成长 今年大概读了4，5本，只有两本是完全看完的
2021-12-31 23:28:54
1742
2
原创 解决Antd输入框卡顿问题及Pubsub.js的使用
项目场景： 项目中通过表单来填写校验大量复杂数据 问题描述： 项目中使用的是Ant Design of Vue这个组件库，使用FormModel 表单,数据字段和校验较多时,表单操作卡顿；eg： a-input输入框，等你输入完字及，几秒后才慢慢出现你输入的字符 原因分析： vue在进行输入时，进行了多次的render刷新渲染操作，导致了input框输入时发生的卡顿现象 解决方案： 官方给出的解决办法，将 Form 相关的业务独立到一个单独的组件中，减少组件渲染的消耗，如果有很多校验项，可把它
2021-12-02 22:27:53
2957
原创 async函数&&await关键字
async函数 基本概念 async 就是 Generator 函数的语法糖 const {promisify} = require('util') const {readFile} = require('fs') const path = require('path') const file1 = path.join(__dirname,'./txt/1.txt') const file2 = path.join(__dirname,'./txt/2.txt') const readFileP =
2021-07-04 20:20:39
329
原创 Generator函数
Generator Generator(生成器) 函数是 ES6 提供的一种异步编程解决方案，并且Generator函数的行为与传统函数完全不同。 定义Generator函数 function* f() { } 形式上，Generator 函数是一个普通函数，但是有两个特征。 function关键字与函数名之间有一个星号 函数体内部可以使用yield关键字，定义不同的内部状态（yield在英语里的意思就是“产出”）。 ...
2021-06-28 21:50:03
268
原创 Iterator
Iterator Iterator（遍历器、迭代器） 是一个对象，Iterator对象需要包含一个next方法，该方法返回一个对象IteratorObject，此对象有两个属性，一个value表示当前结果，一个done是一个布尔值表示是否可以继续迭代 let it = makeIterator(); function makeIterator() { let nextIndex = 0; return { next: function() { return nextInd
2021-06-22 23:40:12
227
2
原创 Reflect
Reflect Reflect是 ES6 为了操作对象而提供的新 API。ES6把原先版本中很多语言层面的API，比如Object.defineProperty delete in等集中在了Reflect的静态方法上，引入Reflect的目的有这样几个。 将Object对象的一些明显属于语言内部的方法（比如Object.defineProperty），放到Reflect对象上。现阶段，某些方法同时在Object和Reflect对象上部署，未来的新方法将只部署在Reflect对象上。也就是说，从Ref
2021-06-20 22:47:06
222
原创 Proxy
Proxy 在ES6之前Object.defineProperty可以拦截对象属性的读取和修改操作，Proxy 可以理解成比这个API更强大的，在目标对象之前架设一层的“拦截”。外界对该Proxy对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写。Proxy 这个词的原意是代理，用在这里表示由它来“代理”某些操作，可以译为“代理器”。 注意：只有对生成的 Proxy 实例操作才能起到拦截的作用 生成Proxy实例： let proxy = new Proxy(ta
2021-06-17 22:59:48
251
原创 Set与WeakSet
Set ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。需要记录不同成员的又不希望重复记录的情况下可以用到Set 生成Set let set1 = new Set() let set2 = new Set([1,2,3]) Set实例属性 Set.prototype.size：返回Set实例的成员总数。 Set四个操作方法 Set.prototype.add(value)：添加某个值，返回Set结构本身。 Set.prototype.delete
2021-06-15 00:00:58
253
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人