javascript挑战编程技能-第四题:谈个if讲点逻辑

简介: javascript挑战编程技能-第四题:谈个if讲点逻辑

(请仔细阅读带*****号的地方)

前三节课我们,我们编写的程序都有点简单。

就是根据输入计算然后输出结果。


上一节课写了一些工具方法,其实jQuery.js已经有了很好的封装。

后面的demo中会开始使用,不了解的朋友可以查阅官网api。

http://api.jquery.com/


这里我不做过多的讲解哦。其实很好懂的,我的学习路线跟其他的前段不太一样,

我是一开始就学习的angular.js,后面项目中有用到jq,也没去看,

反正有些方法知道就直接用,不知道就直接自己写dom操作.


今天这节课我想说的是,在编程中处理的更多的问题是需要根据用户的输入或者服务端返回的数据创建选择分支的.


从这结课开始,我们的代码会越来越长,越来越复杂.

代码解析到底层,其实无非就是是和否的逻辑,

我想学过汇编语言的会对这个概念有比较清晰的认识.

接下来我们先简单的看一下JavaScript中if的用法


if(a === b){

//条件成立执行这里的代码.

}


*****这里有一点要强调的,一般在做判断的时候,在这里使用绝对等于(===),三等号.

*****因为在js中使用等于(==).会有一个自动类型转换的过程,可能会引起一些错误.


这个在第二节的编程规范里面已经提过了.这点是我见过的最容易被忽略的点,

所以我这里再强调一遍.

上面的代码执行时当a和b相等,值和类型都相等.

有时也会执行不相等的时候.

那就是

if(a === b){
//条件成立执行
}else{
//条件不成立执行
}


有时候可能条件更多,

就会使用if-elseif-else这样的结构

if(a === b){
//条件a===b成立执行
}else if(a === c){
//条件a===c成立执行
}else{
//以上条件不成立执行
}


如果有更多的选择分支,为了是代码看起来更加的简洁,可以使用swith

switch(a){
        case:b
         // 条件a===b成立执行
        break;
       case:c
       // 条件a===c成立执行
        break;
       case:d
       // 条件a===d成立执行
        break;
       default:
       //都不成立时执行
       break;
}


*****这里也有一点需要强调的,不要使用代码贯穿(额,这个名词不知道对不对,就这个意思)

*****就是尽量不要使用省略中间的break这样的用法.

*****还有就算所有条件都不成立时什么都不执行,也不要省略default-break,因为服务端返回的数据不一定就能按照预期的样子,都会有出错的时候.

*****还有一点就是关于if的嵌套使用,这点呢,在实际开发中也经常用到,但是呢,我的建议是尽量避免这样的用法.

*****因为if嵌套会增加代码的阅读难度,给后续的维护增加困难.

这里有一个简单的规避方案.如:

if(a === b){
 if(c===d){
 //这里其实可以写成if(a===b&&c===d)但是在实际项目中可能不可以的,比如这个的else还有一个if的话,这里只是演示,不要较真.
 }
}
可以写成
if(a===b){
e();
}
function e(){
 if(c===d){


//这里其实可以写成if(a===b&&c===d)但是在实际项目中可能不可以的,比如这个的else还有一个if的话,这里只是演示,不要较真.

}

}

尽量让if只有一层.


*****在这里呢,还有另外一个建议,我觉得不管是初学者还是有经验的老程序员都可以这么做的.

*****那就是开始动手敲代码之前,先借助笔和纸写出代码逻辑和分析需求.

*****这会让你编写代码时思维比较清晰,

*****在这个过程中,你关注的之后代码逻辑和需求分支.

*****你不会注意语法和代码结构这些东西,

*****会使你写出来的代码更少的出现bug.


我看书上说,最好画流程图.但是我觉得,画流程图比较麻烦.

费的时间也多,对于不太爱动笔的程序员来说,还是不太容易做到的.

还有关于是否写伪代码这东西,我想说,如果英文不是太好的朋友,

请用中文写伪代码,不然你自己还要想半天,真的浪费时间.

伪代码指的就是在动手敲代码之前,把逻辑先写出来,看一下是否有遗漏分支,如

if a=b
就xxxxx
else
就yyyyy


或者

1.a=b xxx
2.a=c yyy
3.a=d zzzz


最后提一个建议.


关于函数名命名

*****不管英文好坏,尽量使用英文,别使用拼音,会让自己的代码看起来档次很低.

其实很多语言最开始学习的第一个关键字就是if,但是我觉得还是有很多东西值得关注的.


今天的篇幅感觉有点长了,就不做题了.

第四节课就到这里结束了吧,

目录
相关文章
|
6月前
|
JavaScript 前端开发 Java
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
157 24
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
|
7月前
|
JavaScript Ubuntu Linux
如何在阿里云的linux上搭建Node.js编程环境?
本指南介绍如何在阿里云Linux服务器(Ubuntu/CentOS)上搭建Node.js环境,包含两种安装方式:包管理器快速安装和NVM多版本管理。同时覆盖全局npm工具配置、应用部署示例(如Express服务)、PM2持久化运行、阿里云安全组设置及外部访问验证等步骤,助你完成开发与生产环境的搭建。
|
存储 JavaScript 前端开发
JavaScript编程实现tab选项卡切换的效果+1
JavaScript编程实现tab选项卡切换的效果+1
|
8月前
|
JavaScript 前端开发 IDE
【编程向导】Js与Ts差异详解:选择与权衡
JavaScript 一直是 Web 开发的基石,以其灵活性和动态性著称,但其松散类型可能导致大型项目中出现难以调试的错误。TypeScript 作为 JavaScript 的超集,通过引入静态类型系统,提供了更高的类型安全性和更好的工具支持,尤其适合大型团队和复杂项目。本文详细对比了 JavaScript 和 TypeScript 的优缺点,并提供了实际代码示例,帮助开发者根据项目需求选择合适的工具。
955 2
|
12月前
|
XML JavaScript 前端开发
JavaScript控制台:提升Web开发技能的秘密武器
作为Web开发人员,掌握JavaScript控制台中的各种方法至关重要。本文介绍了22种实用的console方法,从基本的log()到高级的profile()和memory,每种方法都配有示例和说明,帮助开发者更高效地调试和记录信息。通过了解这些工具,您可以优化代码、提高开发速度,减少错误,使编码过程更加顺畅愉快。
143 1
JavaScript控制台:提升Web开发技能的秘密武器
|
11月前
|
前端开发 JavaScript 持续交付
提高JavaScript编程效率
提高JavaScript编程效率
135 3
|
11月前
|
自然语言处理 JavaScript 前端开发
JavaScript闭包:解锁编程潜能,释放你的创造力
【10月更文挑战第25天】本文深入探讨了JavaScript中的闭包,包括其基本概念、创建方法和实践应用。闭包允许函数访问其定义时的作用域链,常用于数据封装、函数柯里化和模块化编程。文章还提供了闭包的最佳实践,帮助读者更好地理解和使用这一强大特性。
93 2
|
JavaScript 前端开发
JavaScript编程实现tab选项卡切换的效果
JavaScript编程实现tab选项卡切换的效果
|
JavaScript 前端开发
用JavaScript编程控制网页上checkbox选择状态:全选、全部取消、反选
用JavaScript编程控制网页上checkbox选择状态:全选、全部取消、反选
|
JavaScript 前端开发 安全
JavaScript编程实现字符和字符串翻转
JavaScript编程实现字符和字符串翻转

热门文章

最新文章