全栈工程
  • 一起聊聊JavaScript的6种继承方式及其优缺点

    温馨提示:想要更好的理解JS继承方式,须了解构造函数、原型对象、实例化对象、原型链等概念第一种:原型链继承利用原型链的特点进行继承functionParent(){
    this.name='web前端';
    this.type=['JS','HTML','CSS'];
    }
    Parent.prototype.Say=function(){
    console.log(this.name);
    }
    functionSon(){};
    Son.prototype=newParent();
    son1=newSon();
    son1.Say();以上例子解释:①创建一个叫做Parent的构造函数,暂且称为父构造函数,里面有两个属性name、type②通过Parent构造函数的属性(即原型对象)设

    2020-11-02 0 0 0 0
  • JS 中几种处理’this’指向的方式

    随着函数使用场合的不同,this的值会发生变化。但是有一个总的原则,那就是this指的是,调用函数的那个对象。我喜欢在JS中更改函数执行上下文的指向,也称为this指向。例如,咱们可以在类数组对象上使用数组方法:constreduce=Array.prototype.reduce;

    functionsumArgs(){
    returnreduce.call(arguments,(sum,value)={
    returnsum+=value;
    });
    }

    sumArgs(1,2,3);//=6另一方面,this很难把握。咱们经常会发现自己用的this指向不正确。下面的教你如何简单地将this绑定到所需的值。在开始之前,我需要一个辅助函数execute(func),它仅

    2020-11-02 0 0 0 0
  • 18个常用 webpack插件,总会有适合你的!

    Plugin何为插件(Plugin)?专注处理 webpack 在编译过程中的某个特定的任务的功能模块,可以称为插件。Plugin 是一个扩展器,它丰富了 webpack 本身,针对是 loader 结束后,webpack 打包的整个过程,它并不直接操作文件,而是基于事件机制工作,会监听 webpack 打包过程中的某些节点,执行广泛的任务。Plugin 的特点是一个独立的模块模块对外暴露一个 js 函数函数的原型(prototype)上定义了一个注入compiler对象的apply方法apply函数中需要有通过compiler对象挂载的webpack事件钩子,钩子的回调中能拿到当前编译的compilation对象,如果是

    2020-11-01 0 0 0 0
  • 3 个React初级开发者在组件状态中常见的错误

    关于前端开发,我最开心的事情就是总有新的东西可以学习。但我们可能一辈子都在掌握各种编程语言、库和框架,但仍然一无所知。因为我们都在学习,这也意味着我们都容易犯错误。没关系,我们的目的是变得更好。如果你犯了一个错误并从中吸取教训,你就做得很好!但是如果你没有学到任何新的东西,并且不断重复犯同样的错误,emmm。。。可能你的职业生涯就会停滞不前。本着这种精神,下面是我在 CodeReview 初级开发同学时经常看到的三个错误。我们一起来 check 一下,然后讨论如何改正它。直接修改状态在更新 React 组件状态时,最重要的是

    2020-11-01 0 0 0 0
  • 一文了解Object.fromEntries()的用法

    object.entries()转换一个objec为array。但是,如果你想做相反的事情怎么办?不用再想了! 使用Object.fromEntries()来把array转换为object 。Object.fromEntries我们先指出对象的解剖方法,对象是有一个键和一个值的东西。constobject={
    key:'value',
    };如果我们想将某物转换为对象,我们需要传递具有这两个要求的东西:key和value。满足这些要求的参数有两种:具有嵌套键值对的数组Map对象用Object.fromEntries将数组转为对象这是带有键值对的嵌套数组constnestedArray=[
    ['key1','value1'],
    ['key2

    2020-10-31 0 0 0 0
  • 10个好用的 JS 图像处理库(分享)

    用 JavaScript 处理图像可能非常困难且繁琐。 幸运的是,有许多库可以让这些变得简单得多。 下面介绍一些图像处理的库。1. Pica事例地址:http://nodeca.github.io/pica/demo/Github: https://github.com/nodeca/picapica 可在浏览器上实现高质量而且高性能的图片大小调整JS库,目标是在浏览器中以最快的速度进行高品质图像缩放。它会从web-workers,web assembly,createImageBitmap和纯JS中自动选择最佳的可用技术。Pica是一个执行数学计算的底层开发库,尽可能地减少了封装带来的影响。如果对二进制图像进行缩放,需要先加载到canvas(

    2020-10-31 0 0 0 0
  • 了解TypeScript中的两种顶级类型:any和unknown

    在 TypeScript中,any和unknown是包含所有值的类型。在本文中,我们将会研究它们是怎样工作的。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。TypeScript 的两种顶级类型anyandunknownare so-calledtop typesin TypeScript. Quoting Wikipedia:any和unknown在 TypeScript 中是所谓的“顶部类型”。以下文字引用自 Wikipedia:top type[...]是通用(universal)类型,有时也称为通用超类型,因为在任何给定类型系统中,所有其他类型都是子类型[...]。通常,类型是包含了其相关类型系统中所有可能的[值]的类型。也就是说

    2020-10-30 0 0 0 0
  • 如何正确比较 JavaScript 中的对象?

    如何正确比较 JavaScript 中的对象?下面本篇文章给大家解决一下比较 JavaScript 对象的四种方式。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。比较 JavaScript 中的原始值非常简单。只需使用任何一种可用的相等运算符即可,例如严格相等运算符:'a'==='c';//=false
    1===1;//=true但是对象却有结构化数据,所以比较起来比较困难。在本文中,你将学习如何正确比较 JavaScript 中的对象。1. 引用比较JavaScript 提供了 3 种对值进行比较的方法:严格相等运算符===宽松相等运算符==Object.is()函数当

    2020-10-30 0 0 0 0
  • 分享编写更好的react代码的5个技巧

    在本文中,我想分享几个技巧,这些技巧将改善你的React代码。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。1. 解构 props在 JS 中解构对象(尤其是 props)可以大大减少代码中的重复。看下面的例子://ParentComponent
    importReactfrom'react';

    importCoffeeCardfrom'./CoffeeCard';

    constCafeMenu=()={
    constcoffeeList=[
    {
    id:'0',
    name:'Espresso',
    price:'2.00',
    size:'16'
    },
    {
    id:'1',
    name:'Cappuccino',
    price:'3.5

    2020-10-29 0 0 0 0
  • 实现图片懒加载的几种方法

    懒加载就是延时加载,即当对象需要用到的时候再去加载。本文就来为大家介绍几种实现图片懒加载的方法,希望对大家有一定的帮助。懒加载,顾名思义,在当前网页,滑动页面到能看到图片的时候再加载图片故问题拆分成两个:如何判断图片出现在了当前视口 (即如何判断我们能够看到图片)如何控制图片的加载方案一如何判断图片出现在了当前视口clientTop,offsetTop,clientHeight以及scrollTop各种关于图片的高度作比对这些高度都代表了什么意思?这我以前有可能是知道的,那时候我比较单纯,喜欢死磕。我现在想通了,背不过的东西就不要背了

    2020-10-29 0 0 0 0
技术支持: 建站ABC | 管理登录