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,但是我觉得还是有很多东西值得关注的.


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

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

目录
打赏
0
0
0
0
17
分享
相关文章
解锁JavaScript模块化编程新纪元:从CommonJS的基石到ES Modules的飞跃,探索代码组织的艺术与科学
【8月更文挑战第27天】随着Web应用复杂度的提升,JavaScript模块化编程变得至关重要,它能有效降低代码耦合度并提高项目可维护性及扩展性。从CommonJS到ES Modules,模块化标准经历了显著的发展。CommonJS最初专为服务器端设计,通过`require()`同步加载模块。而ES Modules作为官方标准,支持异步加载,更适合浏览器环境,并且能够进行静态分析以优化性能。这两种标准各有特色,但ES Modules凭借其更广泛的跨平台兼容性和现代语法逐渐成为主流。这一演进不仅标志着JavaScript模块化的成熟,也反映了整个JavaScript生态系统的不断完善。
63 3
[JS]面试官:你的简历上写着熟悉jsonp,那你说说它的底层逻辑是怎样的?
本文介绍了JSONP的工作原理及其在解决跨域请求中的应用。首先解释了同源策略的概念,然后通过多个示例详细阐述了JSONP如何通过动态解释服务端返回的JavaScript脚本来实现跨域数据交互。文章还探讨了使用jQuery的`$.ajax`方法封装JSONP请求的方式,并提供了具体的代码示例。最后,通过一个更复杂的示例展示了如何处理JSON格式的响应数据。
48 2
[JS]面试官:你的简历上写着熟悉jsonp,那你说说它的底层逻辑是怎样的?
提高JavaScript编程效率
提高JavaScript编程效率
37 3
JavaScript控制台:提升Web开发技能的秘密武器
作为Web开发人员,掌握JavaScript控制台中的各种方法至关重要。本文介绍了22种实用的console方法,从基本的log()到高级的profile()和memory,每种方法都配有示例和说明,帮助开发者更高效地调试和记录信息。通过了解这些工具,您可以优化代码、提高开发速度,减少错误,使编码过程更加顺畅愉快。
53 1
JavaScript控制台:提升Web开发技能的秘密武器
JavaScript闭包:解锁编程潜能,释放你的创造力
【10月更文挑战第25天】本文深入探讨了JavaScript中的闭包,包括其基本概念、创建方法和实践应用。闭包允许函数访问其定义时的作用域链,常用于数据封装、函数柯里化和模块化编程。文章还提供了闭包的最佳实践,帮助读者更好地理解和使用这一强大特性。
28 2
用JavaScript编程控制网页上checkbox选择状态:全选、全部取消、反选
用JavaScript编程控制网页上checkbox选择状态:全选、全部取消、反选
用JavaScript编程定义二维数组并初始化,然后输出元素值
用JavaScript编程定义二维数组并初始化,然后输出元素值
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等