1.对于美的东西我们很难拒绝,比如美女。哈哈哈,程序员的梗。

2.所以我希望我写出来的代码也是很美观的,让人看起来会很舒服。

3.要想让你的代码简约美观,就要涉及封装,模块化了,可复用代码。vue可以参考,但今天我不讨论vue,就从一些原生讨论一下优化的。

今后如果更加深入前端这块,我会更新后面学到的应用,我必会让我的代码更逻辑,更美观。

技术段:

在评审需求的时候,产品的需求会有各种各样的判断,这样的情况这样做,否则那样做。这是最常见的不过了。刚入门前端的同学可能会用到if(){}else{},

这是最常用到,当写多了,会发现代码会很乱。如果只有两个分支的判断,推荐使用三目运算做判断,直观!还好看。

 var judge = 1;
judege == 1 ? console.log(1) : console.log(0);

上面是一个简单的三目判断,结果是在控制台打印1.

如果只有一个判断的时候,可以用if(){},之前看了一个php的经典写法,直接把大括号给去掉,管它黑猫白猫,捉到老鼠的就是好猫。

管你怎么写,浏览器能运行就可以了。

 var judge = 1;
if(judge == 1) console.log(1);

如果有很多判断的时候,会有很多分支的时候,推荐使用switch做判断。

这样做判断会让你的代码非常的好看。

<script type="text/javascript">
var day = new Date().getDay();
switch(day) {
case 0:
x = "Today it's Sunday";
break;
case 1:
x = "Today it's Monday";
break;
case 2:
x = "Today it's Tuesday";
break;
case 3:
x = "Today it's Wednesday";
break;
case 4:
x = "Today it's Thursday";
break;
case 5:
x = "Today it's Friday";
break;
case 6:
x = "Today it's Saturday";
break;
};
console.log(x);
</script>

接下来是一些简化写法判断:

 //如果value的值为"",null,undefind,0,则执行判断
var value = 0;
if(!value) console.log(11);// //判断为true则执行判断
(value < 1) && console.log(22);// //判断为false则执行判断
(value < -1) || console.log(33);//

2018年1月3日21点13分,星期三,在深圳。想去你住的城市看大雪纷飞的样子。

js_如何优化你的代码让它更好看的更多相关文章

  1. CssStats – 分析和优化网站 CSS 代码的利器

    CssStats 是一个在线的 CSS 代码分析工具,你只需要输入网址或者直接 CSS 地址即可进行 CSS 代码的全方位分析,是前端开发人员和网页设计师分析网站 CSS 代码的利器,可以统计出 CS ...

  2. 优化C/C++代码的小技巧

    说明: 无意看到一篇小短文,猜测作者应该是一个图形学领域的程序员或专家,介绍了在光线(射线)追踪程序中是如何优化C/C++代码的.倒也有一些参考意义,当然有的地方我并不赞同或者说我也不完全理解,原文在 ...

  3. 优化C/C++代码的小技巧(转)

    源:http://www.cnblogs.com/lizhenghn/p/3969531.html 说明: 无意看到一篇小短文,猜测作者应该是一个图形学领域的程序员或专家,介绍了在光线(射线)追踪程序 ...

  4. [Android] Android开发优化之——从代码角度进行优化

    通常我们写程序,都是在项目计划的压力下完成的,此时完成的代码可以完成具体业务逻辑,但是性能不一定是最优化的.一般来说,优秀的程序员在写完代码之后都会不断的对代码进行重构.重构的好处有很多,其中一点,就 ...

  5. 《Java程序性能优化:让你的Java程序更快、更稳定》

    Java程序性能优化:让你的Java程序更快.更稳定, 卓越网更便宜,不错的书吧

  6. 用AOP来让你的JS代码变得更有可维护性吧

    此文已由作者吴佳祥授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 好吧我承认这是篇任务. 最近看到个消息,ES2017已经定稿了,心想,我去,还完全没了解ES2016呢,ES ...

  7. CSS select样式优化 含jquery代码

    CSS 下拉选择菜单基本的CSS样式不怎么好看,通过一些简单的样式优化,可以得到如下图这样的: html结构如下: <div class="sel_wrap"> < ...

  8. 如何优化C语言代码(程序员必读)

    1.选择合适的算法和数据结构 应该熟悉算法语言,知道各种算法的优缺点,具体资料请参见相应的参考资料,有很多计算机书籍上都有介绍.将比较慢的顺序查找法用较快的二分查找或乱序查找法代替,插入排序或冒泡排序 ...

  9. 解析Android开发优化之:从代码角度进行优化的技巧

    下面我们就从几个方面来了解Android开发过程中的代码优化,需要的朋友参考下   通常我们写程序,都是在项目计划的压力下完成的,此时完成的代码可以完成具体业务逻辑,但是性能不一定是最优化的.一般来说 ...

随机推荐

  1. 初学LINUX版本的选择

    1.用于企业环境:建议使用商业版本,例如Red Hat的RHEL或者是Novell的SuSE都是很不错的选择!毕竟企业的环境强调的是永续的经营,你可不希望网管人员走了之后整个机房的主机都没有人管理吧! ...

  2. 枚举当前环境中打开的所有IE

    IE程序是属于Shell的一个应用程序,要枚举当前打开的所有IE程序窗口,可以通过ShellWindows集合来打开属于Shell的当前的窗口的集合. 首先添加程序需要的头文件和tlb库 //#imp ...

  3. Redis 学习之主从复制

    该文使用centos6.5 64位    redis3.2.8 主从复制 Redis的复制功能是支持多个数据库之间的数据同步.一类是主数据库(master)一类是从数据库(slave),主数据库可以进 ...

  4. volatile并不能保证数据同步、只能保证读取到最新主内存数据

    在 java 垃圾回收整理一文中,描述了jvm运行时刻内存的分配.其中有一个内存区域是jvm虚拟机栈,每一个线程运行时都有一个线程栈, 线程栈保存了线程运行时候变量值信息.当线程访问某一个对象时候值的 ...

  5. Java线程模型

    并发不一定要依赖多线程(如PHP中很常见的多进程并发),但是在Java里面谈论并发,大多数都与线程脱不开关系. 线程是比进程更轻量级的调度执行单位,线程的引入,可以把一个进程的资源分配和执行调度分开, ...

  6. 【Python】Python 新式类介绍

    本文转载自:kaka_ace's blog 我们使用 Python 开发时, 会遇到 class A 和 class A(object) 的写法, 这在 Python2 里是有概念上和功能上的区别, ...

  7. WPF布局间的切换方法

    效果图,两种效果间的切换

  8. WPF 进度条ProgressBar

    今天研究了一下wpf的进度条ProgressBar 1.传统ProgressBar WPF进度条ProgressBar 这个控件,如果直接写到循环里,会死掉,界面会卡死,不会有进度.需要把进度条放到单 ...

  9. 【题解】CF#1012 C-Hill

    感觉这题的状态还是比较明显的.设置状态 \(f[i][j][0/1]\) 表示dp到第 \(i\) 个位置,前面(包括这里)已经出现了 \(j\) 个山峰,当前位置是不是山峰即可 dp.这样的状态有一 ...

  10. [CF452E]Three strings

    题目大意:给你三个字符串$A,B,C$,令$L=min(|A|,|B|,|C|)$,对每个$i\in[1,L]$,求出符合$A_{[a,a+i)}=B_{[b,b+i)}=C_{[c,c+i)}$的三 ...