JavaScript语法约定和程序调试原理解析


Posted in Javascript onNovember 03, 2020

JavaScript 语法约定

1、大小写的区分

1). JavaScript的关键字,永远都是小写的;

2). 内置对象,如Math和Date是以大写字母开头的;

3). 对象的名称通常是小写;若是多个单词,驼峰(Camel)命名法。

驼峰(Camel)命名法:开头单词小写,后面单词首字母大写。使用的很普遍,很多人习惯这种命名方法。示例:userName。

2、变量、对象和函数的名称命名

当声明变量、对象和函数的名称时大小写,数字,下划线,美元符号都可以,但是必须以字母,下划线,美元符号开头。否者会出现Uncaught SyntaxError类型的错误提示。

3、分号 ";"

JavaScript允许开发者自行决定是否以分号结束一行代码。
如果没有分号,JavaScript就将行代码的结尾看作该语句的结尾,不会报错。但最好每写完一行代码就加上";" 作为结尾。

4、运算符周围的空格

在运算符( = + - * / )周围以及逗号之后添加空格,如下:

var a = 2 + 5;var arr = ["a", "b", "c"];

5、代码缩进

使用对代码块缩进使用 4 个空格,使代码块更加清晰。如以下格式:

function isFunny(){
  var isTrue=true;
	if(isTrue){
		console.log("你是对的");
	}
}

JavaScript 语法约定的特点:

  • 善代码可读性
  • 提升代码可维护性

JavaScript 程序调试

1、打开浏览器,按F12进入调试界面:

JavaScript语法约定和程序调试原理解析

Elements:用于查看和编辑当前页面中的HTML和CSS元素。

JavaScript语法约定和程序调试原理解析

Console:用于显示脚本中所输出的调试信息,或运行测试脚本等。

Sources:用于查看和调试当前页面所加载的脚本的源文件。在source目录下进行调试。在该模式下,点击js里每一行即可以加断点。

JavaScript语法约定和程序调试原理解析

断点调试细节后续讲到!!!

  • Network:用于查看HTTP请求的详细信息,如请求,响应及返回内容等。
  • Timeline:用于查看脚本的执行时间,页面元素渲染时间等信息。
  • Profiles:用于查看CPU执行时间与内存占用等信息。
  • Resource:用于查看当前页面所请求的资源文件,如HTML,CSS样式等。
  • Audits: 用于优化前端页面,加速网页加载速度等。

2、用alert,每次都弹框判断出错的位置

alert() 会阻塞 UI 和 alert() 以下的 javascript 代码的执行,必须点击 '确定' 按钮才能继续,非常低效。当使用 alert() 进行弹出时,最后产品上线后,会降低用户体验。

3、用console.log,这个数据量小还可以,调试时console.log是最常用的命令之一。

console.log()可以接受任何字符串、数字和JavaScript对象。与alert()函数类似,console.log()也可以接受换行符\n以及制表符\t。console.log()语句所打印的调试信息可以在浏览器的调试控制台中看到。不同的浏览器中console.log()行为可能会有所不同。

以上仅是个人见解,若有不足之处欢迎在下方评论指出,那就先分享到这里!! ? 后续继续更新!!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 表单的友好用户体现
Jan 07 Javascript
div+css布局的图片连续滚动js实现代码
May 04 Javascript
Web前端设计模式  制作漂亮的弹出层
Oct 29 Javascript
利用javascript解决图片缩放及其优化的代码
May 23 Javascript
减少访问DOM的次数提升javascript性能
Feb 24 Javascript
解析JavaScript的ES6版本中的解构赋值
Jul 28 Javascript
Node.js的MongoDB驱动Mongoose基本使用教程
Mar 01 Javascript
js实现多图左右切换功能
Aug 04 Javascript
jQuery实现三级联动效果
Mar 02 Javascript
详解Vue整合axios的实例代码
Jun 21 Javascript
opencv 识别微信登录验证滑动块位置
Aug 07 Javascript
基于ajax及jQuery实现局部刷新过程解析
Sep 12 jQuery
解决vux 中popup 组件Mask 遮罩在最上层的问题
Nov 03 #Javascript
React Native登录之指纹登录篇的示例代码
Nov 03 #Javascript
解决VantUI popup 弹窗不弹出或无蒙层的问题
Nov 03 #Javascript
wepy--用vantUI 实现上弹列表并选择相应的值操作
Nov 03 #Javascript
使用vant的地域控件追加全部选项
Nov 03 #Javascript
vue vant中picker组件的使用
Nov 03 #Javascript
vue-amap根据地址回显地图并mark的操作
Nov 03 #Javascript
You might like
虫族 Zerg 热键控制
2020/03/14 星际争霸
php数组函数序列之next() - 移动数组内部指针到下一个元素的位置,并返回该元素值
2011/10/31 PHP
巧用php中的array_filter()函数去掉多维空值的代码分享
2012/09/07 PHP
获取URL文件名后缀
2013/10/24 PHP
手把手编写PHP框架 深入了解MVC运行流程
2016/09/19 PHP
php json_encode与json_decode详解及实例
2016/12/13 PHP
实例分析10个PHP常见安全问题
2019/07/09 PHP
CSS中一些@规则的用法小结
2021/03/09 HTML / CSS
clientX,pageX,offsetX,x,layerX,screenX,offsetLeft区别分析
2010/03/12 Javascript
基于mootools插件实现遮罩层新手引导
2012/05/24 Javascript
Javascript中 关于prototype属性实现继承的原理图
2013/04/16 Javascript
javascript数组快速打乱重排的方法
2014/01/02 Javascript
jquery实现更改表格行顺序示例
2014/04/30 Javascript
jQuery插件ImageDrawer.js实现动态绘制图片动画(附源码下载)
2016/02/25 Javascript
深入浅析JavaScript中的3DES
2016/08/24 Javascript
基于javascript实现的快速排序
2016/12/02 Javascript
详解webpack分包及异步加载套路
2017/06/29 Javascript
360doc网站不登录就无法复制内容的解决方法
2018/01/27 Javascript
使用sessionStorage解决vuex在页面刷新后数据被清除的问题
2018/04/13 Javascript
深入剖析Node.js cluster模块
2018/05/23 Javascript
ES6 Promise对象的应用实例分析
2019/06/27 Javascript
Android 自定义view仿微信相机单击拍照长按录视频按钮
2019/07/19 Javascript
JS常见错误(Error)及处理方案详解
2020/07/02 Javascript
[57:55]EG vs Fnatic 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
寻找网站后台地址的python脚本
2014/09/01 Python
python爬虫的数据库连接问题【推荐】
2018/06/25 Python
win10 64bit下python NLTK安装教程
2018/09/19 Python
python飞机大战pygame游戏背景设计详解
2019/12/17 Python
python怎么调用自己的函数
2020/07/01 Python
pytorch加载语音类自定义数据集的方法教程
2020/11/10 Python
HTML5 实战PHP之Web页面表单设计
2011/10/09 HTML / CSS
几个Linux面试题笔试题
2016/08/01 面试题
QA工程师岗位职责
2013/11/20 职场文书
工作自我评价分享
2013/12/01 职场文书
机关单位动员会主持词
2014/03/20 职场文书
药剂专业求职信
2014/06/20 职场文书