达内广州C++学院|c++培训|广州达内科技C++/C#培训|.NET培训|IT培训|达内广州岗顶中心 达内广州C++学院|c++培训|广州达内科技C++/C#培训|.NET培训|IT培训|达内广州岗顶中心
达内新闻
 当前位置:主页 > 达内新闻 >

web前端程序员需要学习哪些JavaScript技巧

时间:2019-06-06  来源:未知  作者:广州达内培训

随着互联网的不断发展,企业对web前端编程开发程序员的需求量也在不断的增加,今天我们就一起来了解一下,web前端程序员需要掌握的几种JavaScript编程技巧。

web前端程序员需要学习哪些JavaScript技巧

1.判断对象的数据类型

使用Object.prototype.toString配合闭包,通过传入不同的判断类型来返回不同的判断函数,一行代码,简洁优雅灵活。

2.ES5实现数组map方法

值得一提的是,map的二个参数为一个参数回调中的this指向,如果一个参数为箭头函数,那设置二个this会因为箭头函数的词法绑定而失效

另外就是对稀疏数组的处理,通过hasOwnProperty来判断当前下标的元素是否存在与数组中。

3.ES5实现数组的some方法

执行some方法的数组如果是一个空数组,终始终会返回false,而另一个数组的every方法中的数组如果是一个空数组,会始终返回true

4.ES5实现数组的reduce方法

因为可能存在稀疏数组的关系,所以reduce需要保证跳过稀疏元素,遍历正确的元素和下标。

5.使用reduce实现数组的flat方法

因为selfFlat是依赖this指向的,所以在reduce遍历时需要指定selfFlat的this指向,否则会默认指向window从而发生错误

原理通过reduce遍历数组,遇到数组的某个元素仍是数组时,通过ES6的扩展运算符对其进行降维(ES5可以使用concat方法),而这个数组元素可能内部还嵌套数组,所以需要递归调用selfFlat

同时原生的flat方法支持一个depth参数表示降维的深度,默认为1即给数组降一层维度

6.实现ES6的class语法

ES6的class内部是基于寄生组合式继承,它是目前理想的继承方式,通过Object.create方法创造一个空对象,并将这个空对象继承Object.create方法的参数,再让子类(subType)的原型对象等于这个空对象,就可以实现子类实例的原型等于这个空对象,而这个空对象的原型又等于父类原型对象(superType.prototype)的继承关系

而Object.create支持二个参数,即给生成的空对象定义属性和属性描述符/访问器描述符,我们可以给这个空对象定义一个constructor属性更加符合默认的继承行为,同时它是不可枚举的内部属性(enumerable:false)

而ES6的class允许子类继承父类的静态方法和静态属性,而普通的寄生组合式继承只能做到实例与实例之间的继承,对于类与类之间的继承需要额外定义方法,这里使用Object.setPrototypeOf将superType设置为subType的原型,从而能够从父类中继承静态方法和静态属性

7.函数柯里化(支持占位符)

使用方法:

通过占位符能让柯里化更加灵活,实现思路是,每一轮传入的参数先去填充上一轮的占位符,如果当前轮参数含有占位符,则放到内部保存的数组末尾,当前轮的元素不会去填充当前轮参数的占位符,只会填充之前传入的占位符

8.偏函数

使用方法:

偏函数和柯里化概念类似,个人认为它们区别在于偏函数会固定你传入的几个参数,再一次性接受剩下的参数,而函数柯里化会根据你传入参数不停的返回函数,直到参数个数满足被柯里化前函数的参数个数

Function.prototype.bind函数就是一个偏函数的典型代表,它接受的二个参数开始,为预先添加到绑定函数的参数列表中的参数,与bind不同的是,上面的这个函数同样支持占位符

9.斐波那契数列及其优化

利用函数记忆,将之前运算过的结果保存下来,对于频繁依赖之前结果的计算能够节省大量的时间,例如斐波那契数列,缺点就是闭包中的obj对象会额外占用内存

10.实现函数bind方法

函数的bind方法核心是利用call,同时考虑了一些其他情况,例如

bind返回的函数被new调用作为构造函数时,绑定的值会失效并且改为new指定的对象

定义了绑定后函数的length属性和name属性(不可枚举属性)

绑定后函数的原型需指向原来的函数

11.实现函数call方法

原理就是将函数作为传入的上下文参数(context)的属性执行,这里为了防止属性冲突使用了ES6的Symbol类型

【免责声明】:本内容转载于网络,转载目的在于传递信息。文章内容为作者个人意见,本平台对文中陈述、观点保持中立,不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。




上一篇:运城网页性能优化关于图片类型与特点分析
下一篇:没有了

友情链接:
  • CentOS 8.0 有望在一个月左右发布
  • WWDC2019开发者大会首日亮点:SwiftUI,,Xcode 11,ARKit 3
  • 德国的华为专利泄露的或是ARKOS操作系统?
  • Apple宣布推出SwiftUI,新的UI框架
  • Apple推出适用于iPhone的iOS 13,采用黑暗模式与性能改进
  • Mozilla Thunderbird应用程序现已在Microsoft Store上提供
  • Apple发布iOS 13,macOS 10.15,iPadOS 13,tvOS 13和watchOS 6
  • NVIDIA发布418.52.10 Vulkan Linux测试版驱动程序
  • Safari技术预览版83发布,可用于macOS Mojave和macOS High Sierr
  • 家具制造业如何升级?提升效率和生产力需借助哪些技术和工具?
  • Mesa 19.1 将于下周发布,许多OpenGL/Vulkan改进
  • Sway 1.1 发布,为Swaybar增加触控支持
  • Vulkan 1.1.110 发布,带来两个新扩展
  • 据LWN.net报道,openSUSE可能独立于SUSE
  • Storm 2.0.0 发布,支持Java架构
  • Linux Kernel 5.2-rc3 发布,相当正常的版本
  • Qt Design Studio 1.2 发布,Sketch集成
  • 如何用社群营销快速获客增加销量
  • Fedora 28 Linux生命周期结束,请升级到Fedora 30
  • 全地形全掌控 哈弗H9助你纵横驰骋天地间
  • Clear Linux 继续阻止非root用户访问dmesg
  • 网络广告具有哪些优势?
  • Mozilla的Servo开始研究Linux视频加速
  • QQ浏览器小程序重磅更新
  • Genode OS 19.05 发布,添加64位ARM,默认情况下使用C++ 17
  • 【保利春拍】瑰丽珠宝与名贵时计相互的碰撞
  • Steam Linux市场份额在5月份略有增长
  • 微软发布PowerShell 7的第一个预览版,并制定功能路线图
  • Apache Avro 1.9 发布,增加ZStandard支持
  • Qt 5.13 Beta 4 发布,支持Lottie、WebAssembly和glTF 2.0导入
  • Fedora 31考虑使用Zstd压缩其RPM包而不是XZ
  • 问鼎金瞳奖评审团大奖,“我是创益人”交出答卷
  • nCine是一个有趣的开源2D游戏引擎
  • Google Chrome 成为互联网的看门人
  • TypeScript 3.5 发布,新增Omit 辅助类型
  • 直击中国网络视听大会:把握短视频六大营销趋势
  • 华为Mate 20 Pro重回Android Q Beta支持名单中
  • 小程序找到精准种子用户冷启动秘籍
  • PyPI宣布2FA用于提高Python包下载安全性
  • APP推广渠道和实用经验分享,总有一些是你需要的
  • 电商APP找到新用户&留住新用户关键2步
  • Krita 4.2 发布,更好的绘图平板电脑支持
  • 连接线下, 小程序为汽车行业使用场景赋能
  • Material-UI v4 发布,CSS特异性
  • 互联网运营需掌握的五类专业术语
  • 抓住短视频社交商业机遇,“2019快手商业化营销中国行·广州站”
  • openSUSE Leap 42.3 Linux操作系统将于2019年6月30日停止支持 -
  • MuseScore 3.1 发布,音乐制谱软件
  • 福建体彩网 官方网站
  • 正规的彩票app
  • 澳客网怎么了
  • 大乐透免费预测
  • 好日子高手论坛