JavaScript DOM 编程艺术(1)---> JavaScript语法
二. JavaScript语法目录
2.1 语法
javaScript代码要通过HTML/XHTML文档才能执行。可以有两种方式完成这一点,第一种是将JavaScript代码放到文档<head>标签中的<Script>标签之间:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title> <script>
JavaScript goes here!
</script> </head>
<body>
Mark up goes here!
</body>
</html>
另一种更好的方式是把JavaScript代码存放为一个扩展名为.js的独立文件,典型做法是在文档的<head>部分放一个<script>标签,并把它的src属性指向该文件:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test2</title> <script src="Mairr.js"></script> </head>
<body>
Mark up goes here!
<!--其中,<script>标签最好放置在</body>标签之前,能够使浏览器更快的加载页面,后面章节会详细介绍-->
</body>
</html>
(1) 语句
一系列指令构成,这些指令叫做语句。JS的语句分隔要求不那么严格,换行即可表示语句的结束,当然,出于编程习惯,最好加上分号。(一下三种编程方式都是正确的,建议选择最后一种)
<!--直接回车换行-->
first statement
second statement <!--分号隔开-->
first statement; second statement; <!--分号并换行-->
first statement;
second statement;
(2) 注释
- 单行注释: // ...
- 块注释: /* .... */
- HTML文档中注释: <!--这是要注释掉的部分-->
- javascript中有半边即可作为行注释: <!--这是只是掉的行内容,后半部分括号可以不需要了
(3) 变量
javaScript允许直接对变量赋值而无需事先声明(弱编程语言)。如果对某个变量赋值之前未声明,赋值操作将自动声明该变量。出于编程习惯,最好对变量做出声明;例如:var name,age。
变量的命名要满足以下原则:
- 变量和其他语法元素的名字都是区分大小写的;
- 变量名中不允许有空格、标点(美元符号除外$);
- 变量名允许包含字母、数字、美元符号(&),但是,第一个字符不允许是数字;
- 较长变量名建议加上下划线增加可读性;(var my_name;);
(4) 数据类型
a. 字符串
字符串包括(但不限于)字母、数字、标点符号和空格。字符串必须包在引号里面,单引号或者双引号都可以。有的时候字符串内部有单引号/双引号,需要用转义字符(\);在javaScript中,用反斜杠对字符进行转义: var mood = 'don\'t ask';(以避免和但引号混淆)。
b. 布尔值
布尔数据只有两个可选值---->ture/false。(注意ture/false不要用引号括起来,否者会将其当做做字符串的赋值操作)
c. 数值
JavaScript允许使用带小数点的数值,并且允许任意位小数,这样的数称为浮点数,数值前添减号(-)表示负数。
(5) 数组
JavaScript根本不需要在声明数组时候必须给出元素个数,向数组中添加元素操作称为填充。var person = Array("mairr",1949,ture)。
(6) 对象
与数组一样,对象也是使用一个名字表示一组值。对象的每个值都是对象的属性。例如:
var Mairr = Object();
Mairr.name = "HuGe";
Mairr.age = 18;
Mairr.living = false;
2.3 操作
算术操作符(包含加、减、乘、除、括号、自增++、自减--)。将多个字符串首尾相连的操作叫做拼接。如下所示,拼接示例:
// 直接拼接
var message = "I am feeling" + "sad"; // 通过变量完成·拼接
var mood = "sad";
var message = "i am feeling" + mood;
2.4 条件语句
if条件语句基本语法结构:if(condition){statements;}
(1) 比较操作符
- 基本比较符“>,<,<=,>=,”
- 不等号“!=”
- 注意几个等号的区别:
- "="表示赋值符号;
- "=="不表示严格相等,例如,用"=="号比较false与空字符串的关系,会返回true,并不是严格相等;
- "==="表示严格相等;
(2) 逻辑操作符
- 逻辑与 "&&"
- 逻辑或 "||"
- 逻辑非 "!"
(逻辑运算的结果是布尔型true/false)
2.5 循环语句
(1)while循环
// 方式一
while(condition){
statements;
} // 方式二
do{
statements;
}while(condition);
(2)for循环
for(initial condition; test condition; alter condition){
statements;
}
2.6 函数
如果需要多次使用同一段代码,可以把它们封装成一个函数。函数(function)就是一组允许在你的代码里随时调用的语句。每个函数实际上是一个短小的脚本。
定义一个函数的语法如下所示:
function name(arguments){
statements;
}
变量既可以是全局的,也可以是局部的。这就是变量的作用域。
全局变量可以在脚本的任何位置被引用。一旦你在一个脚本里声明了一个全局变量,就可以从这个脚本中的任何位置(包括函数内部)引用它。全局变量的作用域是整个脚本。
局部变量只存在于声明它的那个函数的内部,在那个函数的外部是无法应用他的,局部变量的作用域仅限于某个特定的函数。
如果在函数中使用了var,那个变量将被视为一个局部变量,它只存在于这个函数的上下文中;反之,如果没有使用var,那个变量将被视为一个全局变量,如果脚本里已经有在一个与之同名的全局变量,这个函数就会改变那个全局变量的直。
示例如下:
function square(num){
total = num *num; // 此处为全局变量,当设置为 var total = num *num; --->才是局部变量
return total;
}
var total = 50; // 此处为局部变量
var number = square(20);
alert(total);
得到结果是:

全局变量total的值变成了400,而不是局部变量的50。
2.7 对象
对象(Object)是一种数据类型,包含在对象里的数据可以通过两种形式访问——属性(property)和方法(method):
- 属性是隶属于某个特定对象的变量;
- 方法是只有某个特定对象才能调用的函数;
对象就是由一些属性和方法组合在一起而构成的一个数据实体,在javaScript里,属性和方法都使用"点"语法来访问:
- Object.property
- Object.method()
为给定对象创建一个新实例需要使用new关键字
var Mairr = new person;
2.7.1 内建对象
JavaScript提供了一系列预先定义好的对象,这些可以拿来就用的对象称为内建对象。JavaScript中有许多内置对象,其中包括Array对象、Math对象、Date对象。例如,可以直接新建实例,然后调用其属性/方法:
// 例一
var beatles = new Array();
beatles.length; // 例二
var current_date = new Date();
var taday = current_date.getDay();
2.7.2 宿主对象
除了内建对象之外,JavaScript脚本里使用一些已经预先定义好的其他对象。这些对象不是有JavaScript语言本省提供的,而是由他的运行环境提供的。具体到Web应用,这个环境就是浏览器。由浏览器提供的预定义对象被称为宿主对象。
宿主对象包括Form、Image、Element等。我们可以通过这些对象获得关于网页上表单、图像和各种表单元素等信息。
JavaScript DOM 编程艺术(1)---> JavaScript语法的更多相关文章
- Javascript DOM 编程艺术(第二版)读书笔记——基本语法
Javascript DOM 编程艺术(第二版),英Jeremy Keith.加Jeffrey Sambells著,杨涛.王建桥等译,人民邮电出版社. 学到这的时候,我发现一个问题:学习过程中,相当一 ...
- 读书笔记:JavaScript DOM 编程艺术(第二版)
读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...
- 《JavaScript DOM 编程艺术》 学习笔记
目录 <JavaScript DOM 编程艺术> 学习笔记 第一章 js简史 第二章 js语法 准备工作 语法 第三章 DOM DOM中的D DOM中的O DOM中的M 第四章 js图片库 ...
- JavaScript DOM编程艺术(第2版)的简单总结
介绍 JavaScript DOM编程艺术(第2版)主要讲述了 JavaScript.DOM 和 HTML5 的基础知识,着重讲述了 DOM 编程,并通过几个实例演示了具有专业水准的网页开发. 下面介 ...
- JavaScript DOM 编程艺术·setInterval与setTimeout的动画实现解析
先贴上moveElement()函数的大纲,为了方便观看,删了部分代码,完整版粘到文章后面. function moveElement(elementID,final_x,final_y,interv ...
- JavaScript DOM编程艺术学习笔记(一)
嗯,经过了一周的时间,今天终于将<JavaScript DOM编程艺术(第2版)>这本书看完了,感觉受益匪浅,我和作者及出版社等等都不认识,无意为他们做广告,不过本书确实值得一看,也值得推 ...
- JavaScript DOM编程艺术第一章:JavaScript简史
本系列的博客是由本人在阅读<JavaScript DOM编程艺术>一书过程中做的总结.前面的偏理论部分都是书中原话,觉得有必要记录下来,方便自己翻阅,也希望能为读到本博客的人提供一些帮助, ...
- 《JavaScript dom 编程艺术》 placeholder占位符IE8兼容办法。
在<JavaScript dom 编程艺术>第11章学来的. 相对于用JavaScript替换文本框的提示语句 <!DOCTYPE html> <html lang=&q ...
- 《javascript dom编程艺术》笔记(一)——优雅降级、向后兼容、多个函数绑定onload函数
刚刚开始自学前端,如果不对请指正:欢迎各位技术大牛指点. 开始学习<javascript dom编程艺术>,整理一下学习到的知识.今天刚刚看到第六章,记下get到的几个知识点. 优雅降级 ...
- 《JavaScript DOM 编程艺术》
前几天京东买了一本书,在豆瓣上好评如潮,买下了啃一啃,书名<JavaScript DOM 编程艺术>,在好好深造一下javaScript.一边啃,一边敲.当然应该要做好笔记.一些简单的就看 ...
随机推荐
- maven的java web项目启动找不到Spring ContextLoaderListener的解决办法
用maven搭建的java web项目,上传到git仓库后,当同事clone下来项目,部署到tomcat运行时,就报了如下错误,即启动web项目时,加载web.xml文件,找不到spring的监听器, ...
- 表单处理的方案与注意事项(servlet)
摘要 表单是后端程序员用的与接触最多的,我这里例举了常用处理办法,与注意事项 sevlet处理代码 package myform; import java.io.IOException; import ...
- 《剑指Offer》附加题_用两个队列实现一个栈_C++版
在<剑指Offer>中,在栈和队列习题中,作者留下来一道题目供读者自己实现,即"用两个队列实现一个栈". 在计算机数据结构中,栈的特点是后进先出,即最后被压入(push ...
- Akka(32): Http:High-Level-Api,Route exception handling
Akka-http routing DSL在Route运算中抛出的异常是由内向外浮出的:当内层Route未能捕获异常时,外一层Route会接着尝试捕捉,依次向外扩展.Akka-http提供了Excep ...
- Nginx-OpenResty安装配置
上两篇中介绍了: Ngnix技术研究系列1-通过应用场景看Nginx的反向代理 Ngnix技术研究系列2-基于Redis实现动态路由 发现,应该加一篇OpenResty的安装部署说明,方便大家按图索骥 ...
- #1094 : Lost in the City by C solution
时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 Little Hi gets lost in the city. He does not know where he is ...
- 微信小程序之bindtap事件绑定传参
wxml代码: <view class='fen'> <text bindtap='prev' data-page="{{pageDang}}">上一页&l ...
- 如何让Vim成为我们的神器
Vim 是 Linux 系统上的最著名的文本/代码编辑器,也是早年的 Vi 编辑器的加强版,而 gVim 则是其 Windows 版.它的最大特色是完全使用键盘命令进行编辑,脱离了鼠标操作虽然使得入门 ...
- hdu 3001 Travelling(状态压缩 三进制)
Travelling Time Limit: 6000/3000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...
- java三级考试理论题
Java试卷 一.单项选择题: 1. 试题: 在WINDOWS环境下,ODBC在__A____中设置 A. 控制面板 B. 注册表 C. 浏览器 D. 写字板 2. 阅读以下描述: C <jsp ...