js
文章平均质量分 73
weixin_41837346
这个作者很懒,什么都没留下…
展开
-
es6 装饰器转 es5
es6 装饰器的 es5 实现原创 2022-07-09 11:49:05 · 271 阅读 · 1 评论 -
babel 学习笔记
《Babel 插件通关秘籍》学习笔记核心概念babel 的编译流程parsertraverse(不含path)traverse(包含path)课程链接:《Babel 插件通关秘籍》核心概念babel: js 编译工具(对js代码编程)ast 在线工具作用分析和转换代码:linter、type checker、压缩混淆应用: eslint、typescript、terser模块遍历器:打包工具js 解释器babel macrosbabel 微内核架构核心包(内核,支原创 2022-03-16 19:52:10 · 1479 阅读 · 0 评论 -
浏览器调试简单错误
优先级问题//优先级 . > }{a:1}.a//改进({a:1}).a小数点问题//3.为一整体3.toString()//改进(3).toString()原创 2019-12-20 17:55:39 · 125 阅读 · 0 评论 -
GIF批量生成(js)
生成图片数组(GIF帧)//GIF生成图片数组,url:base64.//返回图片数组async function gifToFrames(url) { return new Promise(async resolve => { const div = document.createElement("div"); const img = do...原创 2020-04-24 18:40:39 · 333 阅读 · 0 评论 -
react小功能 - 文字移动
需求:模拟在图片上拖动文字功能,计算文字的坐标思路:通过鼠标事件(点击、移动、抬起)计算鼠标的移动距离,累加到文字的坐标上github:https://github.com/baixc1/csdn/tree/master/react/canvas-text-moveimport React from 'react';import './index.scss'let isDown = ...原创 2020-04-14 15:12:13 · 233 阅读 · 0 评论 -
gif图片解析与生成(GIF+文字动效)
生成 gif 图(平移+旋转+缩放)解析 GIF 图片 (生成每帧图片的base64)libgif.js 插件生成 GIF 实例解析每一帧需要在服务器端运行(node server.js),然后访问根目录 var rub = new SuperGif({ gif: img }) rub.load(() => { const imgs = [] ...原创 2020-04-13 18:23:28 · 1451 阅读 · 0 评论 -
Class继承
Class继承1.简介2. super关键字3. 类的prototype和__proto__属性4. 原生构造函数的继承5. Mixin 模式实现1.简介extends实现继承super表示父类的构造函数子类在constructor中,必须调用super方法,this必须在super方法后使用(通过父类构造函数,完成this对象的塑造)es5继承:先生成this,然后通过Parent....原创 2020-03-01 20:57:56 · 199 阅读 · 0 评论 -
ES6之函数的扩展
1. 函数参数的默认值参数定义中使用默认值function fun(x = 1, y = 2) { console.log(x, y)}fun() //1 2fun(11) //11 2fun(undefined, 22) //1 22 (传undefined使用默认值)fun(null, 2...原创 2020-01-18 17:24:42 · 104 阅读 · 0 评论 -
js类数组对象
1. 定义:拥有length属性的对象//length决定元素个数var o1 = { 2: 2, 1: 1, length: 4, a: 3 }var o2 = { 2: 2, 1: 1, a: 3 }Array.prototype.slice.call(o1) //[empty, 1, 2, empty]Array.prototype.slice.call(o2) //[]Ar...原创 2020-01-18 11:11:34 · 86 阅读 · 0 评论 -
js中的this
普通函数:this指向最后调用函数的对象function f() { return this}var obj = { f() { return this }, a: { b() { return this } }, d() { return funct...原创 2020-01-16 18:02:51 · 162 阅读 · 1 评论 -
ES6之Iterator
Iterator(遍历器)概念Iterator目的为各种数据结构,提供统一的访问机制使数据结构成员,按照某种次序排列提供新的遍历命令:for…of循环Iterator遍历过程创建指针对象,指向数据起始位置调用指针对象next方法,指针指向数据第一个成员,返回{value,done}对象重复步骤2,指针后移,直至数据结束位置遍历器模拟//遍历器模拟var...原创 2020-01-08 11:57:54 · 153 阅读 · 0 评论 -
ES6之Promise
1. 概述异步编程解决方案一个对象,可以获取异步操作的数据两个特点对象的状态不受外界影响一旦状态改变,就不会再变缺点不设置回调函数,Promise内部抛出的错误,不会反应到外部/** * 三种状态pending,resolved,rejected * pending(进行中) * fulfilled(已成功)-> resolve * rejected(...原创 2020-01-02 10:26:26 · 101 阅读 · 1 评论 -
js数据类型判断
兼容好toString/** * Object.prototype.toString.call,对象原型方法 * 1. 返回"[object type]",type为具体类型 * 2. 可以区分内置对象( Null,Array,Date...) */Object.prototype.toString === toString //true,全局方法Object.protot...原创 2019-12-30 18:34:34 · 66 阅读 · 0 评论 -
js防双击功能
定时器防双击封装/** 定时器防双击* 参数:seconds - 多少毫秒后可以点击,默认500* 返回 - Boolean,是否已点击,true-是*///封装let isClick = falsefunction preventDoubleClick(seconds) { if (isClick) { return true } else { ...原创 2019-12-26 14:26:02 · 1491 阅读 · 0 评论 -
js数组原型方法
js数组原型方法map返回新数组每个元素调用函数,返回新值var arr = [1, 4, 9].map(Math.sqrt)var arr = [1, 2, 3].map(x => x * 2)//react使用map生成元素//需配置依赖function functionComponent() { return ( <div> ...原创 2019-12-10 17:50:43 · 435 阅读 · 0 评论 -
js对象复制
基础知识Javascript 中的对象只是对内存地址的引用复制指针(引用),对应同一内存浅复制扩展运算符(spread)Object.assign(…)适用于属性值都是原始类型的对象//浅复制var obj = { a: 1, b: 2 }var obj1 = { ...obj }var obj2 = Object.assign({}, obj)限制:引用类型的值...原创 2019-12-12 16:24:18 · 127 阅读 · 0 评论