javascript12个你必须掌握的技能
网站建设的时候,作为码农,总喜欢写一些高效且省事的代码,这里,dbestech为你提供关于JavaScript的使用技巧点。
1. 空(null, undefined)验证
当我们创建了一个新的变量,我们通常会去验证该变量的值是否为空(null)或则未定义(undefined)。这对于JavaScript编程来说,是一个经常要考虑到的验证。
如果直接写,那么像下面这样:
if (variable1 !== null || variable1 !== undefined || variable1 !== '') { let variable2 = variable1; } |
我们可以使用一个更加简洁的版本:
let variable2 = variable1 || ''; |
如果你不信,在谷歌浏览器开发者面板的控制台下试试!
//值为null的例子let variable1 = null;let variable2 = variable1 || '';console.log(variable2);//输出: '' //值为undefined的例子let variable1 = undefined;let variable2 = variable1 || '';console.log(variable2);//输出: '' //正常情况let variable1 = 'hi there';let variable2 = variable1 || '';console.log(variable2);//输出: 'hi there' |
2. 数组
这个好像比较简单!
非优化代码:
let a = new Array(); a[0] = "myString1"; a[1] = "myString2"; a[2] = "myString3"; |
优化代码:
let a = ["myString1", "myString2", "myString3"]; |
3. if true .. else 的优化
let big;if (x > 10) {big = true;}else {big = false;} |
简化后:
let big = x > 10 ? true : false; |
极大简化了代码量!
let big = (x > 10);let x = 3,big = (x > 10) ? "greater 10" : (x < 5) ? "less 5" : "between 5 and 10";console.log(big); //"less 5"let x = 20,big = {true: x>10, false : x< =10};console.log(big); //"Object {true=true, false=false}" |
4. 变量声明
尽管JavaScript会自动将变量上提(hoist),使用该方法可以将所有的变量都在函数的头部用一行搞定。
优化前:
let x;let y;let z = 3; |
优化后:
let x, y, z=3; |
5. 赋值语句的简化
简化前:
x=x+1;minusCount = minusCount - 1;y=y*10; |
简化后:
x++;minusCount --;y*=10; |
假设 x=10
,y=5
,那么基本的算术操作可以使用如下的简写方式:
x += y // x=15x -= y // x=5x *= y // x=50x /= y // x=2x %= y // x=0 |
6. 避免使用RegExp
对象
简化前:
var re = new RegExp("\d+(.)+\d+","igm"),result = re.exec("padding 01234 text text 56789 padding");console.log(result); //"01234 text text 56789" |
简化后:
var result = /d+(.)+d+/igm.exec("padding 01234 text text 56789 padding");console.log(result); //"01234 text text 56789" |
7. If 条件优化
虽然很简单,但还是值得提一下。
简化前:
if (likeJavaScript === true) |
简化后:
if (likeJavaScript) |
我们再来句一个判断非真的例子:
let c;if ( c!= true ) {// do something...} |
简化后:
let c;if ( !c ) {// do something...} |
9. 函数参数优化
我个人倾向于使用获取对象元素的方式来访问函数参数,当然这个见仁见智啦!
通常使用的版本:
function myFunction( myString, myNumber, myObject, myArray, myBoolean ) {// do something...}myFunction( "String", 1, [], {}, true ); |
我喜欢的版本:
function myFunction() {/* 注释部分console.log( arguments.length ); // 返回 5for ( i = 0; i < arguments.length; i++ ) {console.log( typeof arguments[i] ); // 返回 string, number, object, object, boolean}*/}myFunction( "String", 1, [], {}, true ); |
译者注:原文下方有评论表示不建议用楼主的方法,使用第一种方法函数参数的顺序是可以变动的,第二种你就要小心了。
10. charAt()的替代品
简化前:
"myString".charAt(0); |
简化后:
"myString"[0]; // 返回 'm' |
译者注:我相信用第一种方法的人已经不多了吧!
11. 函数调用还可以更短
简化前:
function x() {console.log('x')};function y() {console.log('y')};let z = 3;if (z == 3){x();} else {y();} |
简化后:
function x() {console.log('x')};function y() {console.log('y')};let z = 3;(z==3?x:y)(); |
你说四不四很短?
12. 如何优雅的表示大数字
在JavaScript中,有一个简写数字的方法,也许你忽略了。1e7
表示10000000。
简化前:
for (let i = 0; i < 10000; i++) { |
简化后:
for (let i = 0; i < 1e7; i++) { |
javascript12个你必须掌握的技能的更多相关文章
- 【腾讯Bugly经验分享】程序员的成长离不开哪些软技能?
本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/57ce8068d4d44a246f72baf2 Dev Club 是一个交流移动 ...
- CI Weekly #8 | CI/CD 技能进阶路线
在使用 flow.ci 进行持续集成的过程中,也许你会遇到一些小麻烦.最近我们整理了一些常见问题在 flow.ci 文档之 FAQ,希望对你有用.如果你遇到其他问题,也可以通过「在线消息」或去 Git ...
- [转] 评 WOW技能天赋设计
本文转至:http://bbs.chinaunix.net/thread-1692302-8-1.html(只作转载, 不代表本站和博主同意文中观点或证实文中信息)再比如,传说中的面向对象本该大显神威 ...
- Java程序员应该掌握的10项技能
这篇文章主要介绍了作为Java程序员应该掌握的10项技能,包括java的知识点与相关的技能,对于java的学习有不错的参考借鉴价值,需要的朋友可以参考下 1.语法:必须比较熟悉,在写代码的时候ID ...
- 技能收获与C语言学习
你有什么技能比大多人(超过90%以上)更好? 我会的东西很多,喜欢的东西太多,但是很遗憾广而不专,会而不精.学了很多东西我都是为了娱乐,因为以前我们那里过于强调学习,很多爱好也都被扼杀在摇篮里.我觉得 ...
- unity 利用ugui 制作技能冷却效果
using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; ...
- .NET WEB程序员需要掌握的技能
本来这个是我给我们公司入职的新人做一个参考,由于 @张善友 老师在他的微信号转了我的这篇文章<<.Net WEB 程序员需要掌握的技能>>,很多人觉得比较有用,说是看了后知道一 ...
- 你get了无数技能,为什么一事无成
前几日看到阮一峰老师的发的一句话,颇有感慨,「你只是坐在电脑前,往网上发表了一段文字或者一张图片,随便什么,就能够接触到多少陌生的灵魂.这就是我热爱互联网的原因」.我打心底认为这是一个最好的时代, ...
- Jass 技能模型定义(—):半人马酋长的反击光环
Jass是什么? 先阐释一下什么是jass吧,百度:JASS(正确地说是JASS 2)是魔兽3的程序语言,用于控制游戏和地图的进行,也是魔兽游戏和地图的基础. 地图编辑器中摆放的单位( ...
随机推荐
- oracle知识总结
Oracle 分页案例: SELECT * FROM(SELECT A.*, ROWNUM RN FROM (SELECT * FROM Table_name) AWHERE ROWNUM <= ...
- HTML 5 桌面提醒
<script> function showNotice(title,msg){ var Notification = window.Notification || window.mozN ...
- ggplot你不知道的细节
例一 Michaelis-Menten动力学方程 这个例子中采用出自文献中的一组有关于浮萍氮摄取的数据,共2两个变量8个观测值,其中底物浓度与浮萍的氮取速率之间可以通过M-M动力学方程来进行描述.在这 ...
- C++_基础2-复合数据类型
C语言使用术语“派生类型”,C++对类关系使用术语“派生”.所以就改用“复合类型”. 数组 数组是一种数据格式,能够存储多个同类型的值. 数组声明应指出以下三点: 存储在每个元素中的值的类型: 数组名 ...
- 格子刷油漆(dp)-----------蓝桥备战系列
标题:格子刷油漆 X国的一段古城墙的顶端可以看成 2*N个格子组成的矩形(如图1所示),现需要把这些格子刷上保护漆. 你可以从任意一个格子刷起,刷完一格,可以移动到和它相邻的格子(对角相邻也算数),但 ...
- Olesya and Rodion (思维)
Olesya loves numbers consisting of n digits, and Rodion only likes numbers that are divisible by t. ...
- BZOJ - 1458 / P4311 最大流应用 贪心
题意:给定n*m的图,每个士兵可以占领当前行和列,第i行至少要R[i]个士兵占领,第j列至少要C[j]个士兵占领,部分网格无法占领,求占领所用最少士兵数,若无解则输出orz 士兵的贡献情况有1(只有效 ...
- HDU - 2276 位运算矩阵快速幂
挺有意思的一道题 要会运用一些常见的位运算操作进行优化 题目的本质就是要求下面的式子 \(dp[i][j+1]=(dp[i-1][j]+dp[i][j]) \mod 2\) (第\(i\)个字符在\( ...
- PIE SDK自定义滤波
1.算法功能简介 自定义滤波可以自由设置滤波模板,对数据进行处理,自定义滤波器的一般规则要求: ( 1) 滤波器的大小应该是奇数,这样它才有一个中心,例如 3x3, 5x5 或者 7x7.有中心了,也 ...
- IDEA查看第三方jar包的源代码时出现Decompiled.class file, bytecode version:52.0 (Java 8)的解决方案
IDEA中使用Ctrl+左键查看第三方jar包的源代码时,出现Decompiled.class file, bytecode version:52.0 (Java 8),说明IDEA没找到该类的.ja ...