#Javascript实用效果整理

javascript设计模式——代理模式

  代理模式是为一个对象提供一个占位符,以便控制对它的访问。代理模式是一种非常有意义的模式,在生活中可以找到很多代理模式的场景。比如,明星都有经纪人作为代理。如果想请明星来办一场商业演出,只能联系他的经纪人。经纪人会把商业演出的细节和报酬都谈好之后,再把合同交给明星签。代理模式的关键是当客户不方便直接访问一个对象或者不...

javascript设计模式——策略模式

  在程序设计中,常常遇到类似的情况,要实现某一个功能有多种方案可以选择。比如一个压缩文件的程序,既可以选择zip算法,也可以选择gzip算法。这些算法灵活多样,而且可以随意互相替换。这种解决方案就是本文将要介绍的策略模式。策略模式是指定义一系列的算法,把它们一个个封装起来,并且使它们可以相互替换 奖金计算 ...

javascript设计模式——单例模式

  单例模式是指保证一个类仅有一个实例,并提供一个访问它的全局访问点。单例模式是一种常用的模式,有一些对象往往只需要一个,比如线程池、全局缓存、浏览器中的window对象等。在javaScript开发中,单例模式的用途同样非常广泛。试想一下,单击登录按钮时,页面中会出现一个登录浮窗,而这个登录浮窗是唯一的,无论单击多少...

深入理解javascript函数进阶系列第四篇——惰性函数

  惰性函数表示函数执行的分支只会在函数第一次调用的时候执行,在第一次调用过程中,该函数会被覆盖为另一个按照合适方式执行的函数,这样任何对原函数的调用就不用再经过执行的分支了。本文将详细介绍惰性函数 使用背景  因为各浏览器之间的行为的差异,经常会在函数中包含了大量的if语句,以检查浏览器特性,解决不同浏览器...

深入理解javascript函数进阶系列第三篇——函数节流和函数防抖

  javascript中的函数大多数情况下都是由用户主动调用触发的,除非是函数本身的实现不合理,否则一般不会遇到跟性能相关的问题。但在一些少数情况下,函数的触发不是由用户直接控制的。在这些场景下,函数有可能被非常频繁地调用,而造成大的性能问题。解决性能问题的处理办法就是函数节流和函数防抖。本文将详细介绍函数节流和函数...

深入理解javascript函数进阶系列第二篇——函数柯里化

  函数柯里化currying的概念最早由俄国数学家MosesSchönfinkel发明,而后由著名的数理逻辑学家HaskellCurry将其丰富和发展,currying由此得名。本文将详细介绍函数柯里化(curring) 定义  currying又称部分求值。一个currying的函数首先会接受一...

深入理解javascript函数进阶系列第一篇——高阶函数

  前面的函数系列中介绍了函数的基础用法。从本文开始,将介绍javascript函数进阶系列,本文将详细介绍高阶函数 定义  高阶函数(higher-orderfunction)指操作函数的函数,一般地,有以下两种情况  1、函数可以作为参数被传递  2、函数可以作为返回值输出  javascript中的函数...

javascript面向对象系列第四篇——OOP中的常见概念

  面向对象描述了一种代码的组织结构形式——一种在软件中对真实世界中问题领域的建模方法。本文将从理论层面,介绍javascript面向对象程序程序(OOP)中一些常见的概念 对象  所谓对象,本质上就是指事物(包括人和物)在程序设计语言中的表现形式。这里的事物可以是任何东西(如某个客观...

javascript面向对象系列第三篇——实现继承的3种形式

  学习如何创建对象是理解面向对象编程的第一步,第二步是理解继承。开宗明义,继承是指在原有对象的基础上,略作修改,得到一个新的对象。javascript主要包括类式继承、原型继承和拷贝继承这三种继承方式。本文是javascript面向对象系列第三篇——实现继承的3种形式 类式继承  大...

CSS文本效果

  本文将详细介绍CSS文本效果 凸版印刷效果  这种效果尤其适用于中等亮度背景配上深色文字的场景;但它也可用于深色底、浅色字的场景,只要文字不是黑色并且背景不是纯黑或纯白就行【浅色背景深色文本】background:hsl(210,13%,60%);color:hsl(210,13%,30%);text-s...
代码星球 ·2020-05-24

CSS遮罩效果和毛玻璃效果

  本文将详细介绍CSS遮罩效果和毛玻璃效果 普通遮罩  一般地,处理全屏遮罩的方法是使用额外标签<style>.overlay{position:fixed;top:0;right:0;left:0;bottom:0;background:rgba(0,0,0,0.8);}.lightbox{p...
代码星球 ·2020-05-24

CSS背景效果

  本文将详细介绍CSS背景效果 条纹背景【双条纹背景】background:linear-gradient(#fb350%,#58a50%);background-size:100%30px;  CSS标准规定:如果某个色标的位置值比整个列表中在它之前的色标的位置值都要小,则该色标的位置值会被设置为它前面所...
代码星球 ·2020-05-24

CSS边框效果

  本文将详细介绍CSS边框效果 半透明边框border:10pxsolidhsla(0,0%,100%,.5);background-clip:padding-box; 缝边效果outline:1pxwhitedashed;outline-offset:-10px;border-radius:4%...
代码星球 ·2020-05-24

javascript帧动画

  帧动画就是在“连续的关键帧”中分解动画动作,也就是在时间轴的每帧上逐帧绘制不同的内容,使其连续播放而成的动画。由于是一帧一帧的画,所以帧动画具有非常大的灵活性,几乎可以表现任何想表现的内容。本文将详细介绍javascript帧动画 概述【分类】  常见的帧动画的方式有三种,包括gi...
代码星球 ·2020-05-24
首页上一页...104105106107108...下一页尾页