JavaScript 中语法规范及调试

  版权声明:未经博主授权,内容严禁分享转载  


JavaScript 开发环境

  JavaScript 脚本可以使用任意一款纯文本编辑器进行编程开发。

常见的前端开发编辑器:

    - 轻量级:nodepad++、editplus、vi/vim

    - 中量级:Sublime Text、Atom

    - 重量级:AptanaStudio(基于 eclipse)、JetBrains WebStorm(收费软件)

  IDE:集成开发环境,编辑器(代码提示/代码补全)+ 调试器 + 项目管理 + FileWatcher(文件监视器) + 服务管理器

  所有的程序运行都需要相应的环境,JavaScript 程序运行在 JS 脚本解释器中,简称 JS 引擎。

JS 引擎可以独立安装在操作系统中,也可以嵌入在浏览器内核。

浏览器内核主要由两部分组成:

    - 内容排版引擎——解析 HTML/CSS

    - 脚本解释引擎——解析 JavaScript

  目前,所有浏览器的内核中,都默认安装了 JS 引擎。

  所以,只要有浏览器就可以解释运行 JS 程序。

  

浏览器内核

  

JavaScript 语法规范

JavaScript 注释规范

  不会被 JavaScript 引擎解释执行的代码。

  - 单行注释: //

  - 多行注释:   /*    */

<script>
// 单行注释
// document.write("hello"); // 多行注释
/*
document.write("JavaScript");
*/
</script>

规范要求

  - JavaScript 使用 “;” 分号表示一条语句的结束。

  - 严格区分大小写。

  - 字符串必须使用 引号 包裹,单引号、双引号都可以,但必须成对出现。

JavaScript 脚本错误

  当 JS 脚本出现错误时,程序会停止运行,并会在控制台输出错误信息。

  一个页面如果有多个 <script> 标记,JS 脚本在执行过程中,若一个  <script> 标记中某一行语句出错,则同一个 <script> 标记内错误语句后面的代码将终止执行。

  其他 <script> 内的代码依然继续往下执行。

使用控制台查看脚本错误信息

  控制台(console)是浏览器中用于 JS 代码调试的平台。

  打开方式

    - 点击“开发者工具”打开。

    - Windows上使用快捷键 F12 开启。

    - mac 上使用快捷键 command + alt + i 开启。

例如

  

JavaScript 输出

JavaScript 的三种输出方式

  - 向网页中输出:document.write();

  - 弹出提示框:alert();

  - 在控制台输出:console.log();

JavaScript 输出 - 向网页中输出

JavaScript 使用 document.write() 方法向网页输出内容。

  - 注意:此方法会改变网页原本结构,因此在开发过程中很少使用。

<script>
document.write("hello<br/>");
</script>

  

JavaScript 输出 - 弹出提示框

使用 alert() 方法,可以在网页上弹出一个提示框。

  - 注意:alert() 方法弹出提示框会暂停程序的执行,并且无法操作网页,知道点击了“确定”按钮,浏览器提示框是不允许自定义制定的,有的网页有偏凉的提示框那不是浏览器自带的,而是用 div css js 自己编写的。

<script>
alert("这是一个弹框提示!")
</script>

  

JavaScript 输出 - 向控制台输出

使用 console.log() 方法可以向控制台输出内容。

  - 注意:console.log() 此方法常用的调试方法,通常用来查看程序的执行结果。

<script>
console.log("这是向控制台输出的结果")
</script>

  

JavaScript 的组成

完整的 JavaScript 语言由三部分组成

  - ECMAScript(核心 JavaScript)——描述了改语言的基本语法及对象。

  - DOM (文档对象模型,Document Object Model)——描述了处理网页元素和内容的方法和接口。

  - BOM(浏览器对象模型,Browser Object Model)——描述了访问和操作浏览器窗口的方法和接口。


完成!累了,休息一下,明天继续!加油!

JavaScript 中语法规范及调试的更多相关文章

  1. web前端(14)—— JavaScript的数据类型,语法规范1

    编辑器选择 对js的编辑器选用,有很多,能对html编辑的,也能对js编辑,比如notepad++,visual studio code,webstom,atom,pycharm,sublime te ...

  2. JSLint检测Javascript语法规范

    前端javascript代码编写中,有一个不错的工具叫JSLint,可以检查代码规范化,压缩JS,CSS等,但是他的语法规范检查个人觉得太“苛刻”了,会提示各种各样的问题修改建议,有时候提示的信息我们 ...

  3. javascript中正则表达式的基础语法

    × 目录 [1]定义 [2]特点 [3]元字符[4]转义字符[5]字符组[6]量词[7]括号[8]选择[9]断言[10]模式[11]优先级[12]局限性 前面的话 正则表达式在人们的印象中可能是一堆无 ...

  4. Javascript用途,语法特点,难点,调试工具,引入方式,命名规范,变量声明及赋值,数据类型,运算符

    JavaScript用来干什么 数据的验证 将动态的内容写入到网页当中(ajax) 对事件做出相应 读写html当中的内容 检测浏览器 创建cookies 模拟动画 语法特点 基于对象和事件驱动的松散 ...

  5. JavaScript语法规范

    推荐的JavaScript编码规范 阅读 247 评论 0 喜欢 0 作为前端开发人员,我相信每一个人都或多或少的用到原生的JavaScript,也正是因为用的人多,导致编码风格也是多种多样的,而不规 ...

  6. web前端(15)—— JavaScript的数据类型,语法规范2

    Object对象 说这个对象之前,如果您对编程语言开发稍微有点了解的话,应该知道面向对象是什么意思,而js也有面向对象一说,就因为如此,js才会这么强大. 什么是面向对象 其实所有支持面向对象的编程语 ...

  7. 一篇文章带你了解JavaScript中的语法,数据类型,流程控制语句以及函数

    作者 | Jeskson 来源 | 达达前端小酒馆 1 JavaScript有多重要啊,才能让我说说一下,其中的语法,操作符,数据类型,内置功能等. 语法: 在JavaScript中的变量,函数名和操 ...

  8. JavaScript中if语句优化和部分语法糖小技巧推荐

    前言 在前端日常开发过程中,if else判断语句使用的次数应该是比较频繁的了,一些较为复杂的场景,可能会用到很多判断,在某个代码块使用很多if else时,代码会显得较为冗余,阅读起来不够清晰. 除 ...

  9. 第二章 JavaScript核心语法

    第二章   avaScript核心语法 一.变量的声明和赋值 JavaScript是一种弱类型语言,没有明确的数据类型,也就是在声明变量时不需要指定数据类型,变量的类型由赋给变量的值决定. 在Java ...

随机推荐

  1. HOJ 2133&POJ 2964 Tourist(动态规划)

    Tourist Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 1503 Accepted: 617 Description A ...

  2. canvas API笔记

    HTML5添加的最受欢迎的功能就是<canvas>元素,这个元素负责在页面的指定区域通过js动态地在这个区域绘制图形. <canvas> 由几组API构成. 准备: <c ...

  3. CF45G Prime Problem 构造+数论

    正解:构造+数论 解题报告: 传送门! maya这题好神仙啊我jio得,,,反正我当初听的时候是没有太懂的,,, 首先这题你要知道一些必要的数学姿势 比如哥德巴赫猜想巴拉巴拉的 然后直接讲题趴QAQ ...

  4. Android(三) 匹配屏幕密度

    过去,程序员通常以像素为单位设计计算机用户界面.例如:图片大小为80×32像素.这样处理的问题在于,如果在一个dpi(每英寸点数) 高的显示器上运行该程序,则用户界面会显得很小.在有些情况下,用户界面 ...

  5. 关于HttpServletRequest报红叉的解决办法

    今天导入项目的时候,发现报错了,如题.然后找到了解决办法 解决方法:鼠标右击项目工程——>Build Path——>点击comfigure Build Path进入----->选择j ...

  6. if判断代码 转变为 流程图

    转换规则如下: if 代表一个菱形+问号 if后面的条件代表菱形里的内容+↓yes(向下箭头和yes) if同级的else代表右拐向下箭头和no 执行语句块代表一个矩形. if 今天发工资: 先还信用 ...

  7. mysql 数据操作 单表查询 目录

    mysql 数据操作 单表查询 mysql 数据操作 单表查询 简单查询 避免重复DISTINCT mysql 数据操作 单表查询 通过四则运算查询 mysql 数据操作 单表查询 concat()函 ...

  8. 006-Redis 发布订阅

    Redis 发布订阅(pub/sub)是一种消息通信模式:发送者(pub)发送消息,订阅者(sub)接收消息. Redis 客户端可以订阅任意数量的频道. 下图展示了频道 channel1 , 以及订 ...

  9. Java-idea-设置类头注释和方法注释

    一.文件级别的注释         主要是通过File-->Setting-->Editor→File and Code Template中来设置 可以再右侧include中设置File ...

  10. [py][mx]django自定义认证类-实现邮箱作为用户名登录

    创建自定义验证用户名密码类CustomBackend users/views.py from django.contrib.auth import authenticate, login from d ...