javascript入门进阶(一)
javascript 入门进阶
这里主要讲解一下在入门阶段很难注意的一些知识点,不一定有用。但是会了总比不会强。
1.HTML为<script>
标签准备的6个属性:
-async:可选。表示应该立刻下载脚本,但不应妨碍页面中的其他操作。(其他的下载可以等待)
-charset:可选。表示通过src指定的代码的字符集。
-defer:可选。表示脚本可以延迟到文档被解析和显示之后在执行。该版本值对外部JavaScript有效果
-src:可选。执行代码的外部文件。
——type:可选。编写代码使用的脚本语言的内容类型。
几个小例子:
defer的先后出现次序
<!doctype html>
<html>
<head>
<script defer src="test.js"></script>
<script defer src="test2.js"></script>
</head>
<body>
</body>
</html>
HTML要求脚本按照他们出现的先后顺序执行,因此第一个延迟脚本会先于第二给延迟脚本执行。就是test1.js会先执行。因此最好只包含一个延迟脚本。
:fa-star:defer属性只适用于外部脚本文件。
async的异步响应:
<!doctype html>
<html>
<head>
<script async src="test.js"></script>
<script async src="test2.js"></script>
</head>
<body>
</body>
</html>
第二个脚本文件可能会在第一个脚本文件之前执行。
:fa-star:async属性只适用于外部脚本文件。
2.JavaScript执行
javascript解释过程包括两个阶段,预处理(预编译)和执行。在预编译期,JavaScript解释器将完成对JavaScript代码的预处理操作,把JavaScript代码转换为字节码;在执行期,JavaScript解释器的字节码生成二进制机械码,并且按照书序执行,完成程序设计的任务。
预编译包括词法分析和语法分析。词法分析主要对JavaScript脚本进行逐一分析,检查脚本是否呼和JavaScript规范,是否存在语法错误
HTML文档在浏览器中的解析过程是:按文档流从上到下逐步解析页面的结构和信息。javascript代码作为嵌入的脚本应该也算做HTML文档的组成部分。所以JavaScript代码在装载时的执行顺序也是根据<script>
的标签出现的顺序来确定的。
预编译
当JavaScript引擎解析脚本时,他会在预编译期对所有的声明的变量和函数预先进行处理。
alert(a);//返回undefined
var a=1;
alert(a);//返回1
JavaScript解释器是按照代码先后顺序进行解析的,如果在前面代码行中没有为变量赋值,则JavaScript解释器会使用默认值undefined。
f();//调用函数,显示语法错误。
avr f=function f(){
alert(1);
}
在预编译器JavaScript解释器只能为了声明变量f进行处理,而对于变量f的值,只能等到执行期时按顺序进行赋值,自然就会出现语法错误。
onload事件只有在文档加载完毕才会响应,因此为了运行安全,一般设计在页面初始化完毕之后才允许JavaScript代码执行,这样就可以避免因为代码加载延迟对JavaScript执行的影响。
3.错误处理
JavaScript是松散型的,不会验证函数的参数,因此错误只会在代码运行期间出现。
错误类型
-ERROR:普通异常,通常和throw和trycatch语句一同使用。利用属性name可以声明或了解异常的类型,利用message属性可以设置和读取异常的详细信息。
- EvalError:在不正确使用eval()方法时抛出。
- SyntxError:抛出语法错误。
- RangerError:在数字超出合法范围时抛出。
- TypeError:当一个值得类型错误是抛出该异常。在变量中保存意外的类型,或者在访问不纯在的方法时,都会导致
- URIError:由URI的编码和编码方法抛出。
这些代码抛出了一个通用错误,其中有一跳自定义错误。
var e = new Error('Could not parse input');
// e.message is 'Could not parse input'
throw e;
这个方式主要是应用在上千行代码的程序中,你可以抛出一个带有包含了函数的名称,以及为什么会发生错误的明确描述。如果一个复杂的WEB程序发生了这个错误,那么查找问题的根源也容易多了。
错误事件
在任何web浏览器中,onerror事件处理程序都不会创建event对象,但是他可以接受三个参数;错误消息,,错误消息所在的URL和行号。
但是有些时候只有错误消息才会有用。剩下两个在有些情况下不能准确的完成一些事情。
window.onerror=function(message,url,line){
alert(message);
}
只要发生错误,无论是不是浏览器生成的都会触发error事件。并且执行这个处理程序。然后浏览器默认的机制发挥作用。
但是也可以通过以下方式,来组织浏览器报告错误的默认行为。
window.onerror=function(message,url,line){
alert(message);
return false;
}
通过返回false,这个函数实际上是充当了整个文档中的trycatch语句,可以捕获所有无代码处理的运行时的错误,可以说是避免浏览器错误报告的最后一道防线。
3.标识符
标识符是表示名称的意思,有以下几条规则。
第一个字符必须是字母,下划线(_)或美元$符号。
除了第一个字符之外,其他位置的自负可以使用字母,数字,下划线,美元符号。
标识符名称不能与JavaScript关键字或保留字同名。
可以在标识符中使用Unicode转义序列。
允许用户不声明变量,而直接为变量赋值,因为JavaScript解释器能够自动隐式声明变量。但是隐式声明的变量总是作为全局变量而存在的。
function f(){
a=1;//不声明变量
var b=2;
}
f();
alert(a);//返回1
alert(b);//提示语法错误,找不到该变量。
函数未调用之前,函数内部定义的全局变量是无效的,这是因为在JavaScript预编译器,仅对函数名,函数内各种表示符建立索引。
只有当JavaScript执行其时,才按照顺序为变量进行赋值,并初始化。而在执行期,如果函数未被调用,则函数内代码是不被解析的,所以才有了如下情况。function f(){
a=1;
var b=2;
}
try{
alert(a);//尝试读取变量。
}catch{
alert(e.message);//显示错误信息,变量a未定义
}
f();//调用函数
alert(a);//读取全局变量a,返回值为1
变量的作用域
全局作用域是指变量在整个页面脚本中都是可见的,可以自由访问。
局部作用域是指变量仅能在生命的函数内部可见,函数外是不允许访问的。
全局变量是所有全局变量的容器在web浏览器中,全局对象名为windows
上面的话是这个意思
var f=123;
window.f=123;//两者的意思是一样的。
//下面有一个小知识
f=123//隐式全局变量,刚才讲过。以这种方式定义的全局变量被称为隐式的全局变量
4.数据类型
- number
- javascript数值类型不再细分整形,浮点型,所有数值都属于浮点型。
- 数值直接量可以细分为整形直接量和浮点型直接量。浮点数就是带有小数点的数值,而整数是不带小数点的数。
var int=1;//整形数值
var float =1.0//浮点型数值
+toString()是一个非常实用的办法,它可以根据所传递的参数把数值转换为对应进制的数值字符串
var a=32;
document.writeln(a.toSting(2));//返回二进制字符串
document.writeln(a.toSting(4));//返回字符串200
document.writeln(a.toSting(16));//返回字符串20
document.writeln(a.toSting(30));
document.writeln(a.toSting(32));
//对于直接量,不能直接调用toString();必须加一个()
document.writeln((32).toSting(2));
- 字符串
- 布尔值
- NULL
- Null类型只有一个值,即null,他表示空值。
- typeof运算符检测null,返回Object,表名它属于对象类型。
- Undefined
- undefined是Undefined类型的唯一值,他表示未定义的值。当声明变量为赋值时,或者定义属性未设置值时,默认他们的值为undefined。
几个小例子
**使用constructor检测类型
对于对象,数组等复杂数据,可以使用Object对象的constructor属性进行检测。constructor表示构造器,概述性质引用的是构造当前对象的函数。
var o={};
var a=[];
alert(o.constrcutor==Object);//返回true
alert(o.constrcutor==Array);//返回true
**但是对于undefined和null特殊值就不能够使用constructor属性,要不然会抛出异常,你必须确定,其中是true
javascript入门进阶(一)的更多相关文章
- JavaScript入门进阶(二)
JavaScript进阶入门(二) 转换为数字 使用parseInt() parseInt函数会先查看位置0处的字符,如果该位置不是有效数字,则将返回NaN,如果0处的字符是数字,则将查看位置1处的字 ...
- JavaScript入门篇 编程练习
编程挑战 一.定义"改变颜色"的函数 提示: obj.style.color obj.style.backgroundColor 二.定义"改变宽高"的函数 提 ...
- 慕课网JavaScript入门篇课程笔记
1.js注释很重要 单行注释,在注释内容前加符号 “//”. <script type="text/javascript"> document.write(" ...
- JavaScript入门篇
记录一下在慕课网学习JavaScript的过程. 以下内容均来自慕课网. 传送:https://www.imooc.com/code/401 为什么学习JavaScript 1. 所有主流浏览器都支持 ...
- Java 入门进阶
Java 入门进阶 發表於 2015-04-16 http://xielong.me/2015/04/16/%E6%9C%8D%E5%8A%A1%E7%AB%AF%E5%B7%A5%E7%A8%8B% ...
- JavaScript入门--慕课网学习笔记
JAVASCRIPT—(慕课网)入门篇 我们来看看如何写入JS代码?你只需一步操作,使用<script>标签在HTML网页中插入JavaScript代码.注意, <script&g ...
- javascript入门笔记3-dom
1.通过ID获取元素 document.getElementById("id") <!DOCTYPE HTML> <html> <head> & ...
- JavaScript入门
本篇内容是学习慕课网相关课程后,总结出可能未来会忘记的内容 (一)JavaScript入门操作 1.js代码插入位置,以及执行顺序 <head> <script type=" ...
- JavaScript入门基础
JavaScript基本语法 1.运算符 运算符就是完成操作的一系列符号,它有七类: 赋值运算符(=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=).算术运 ...
随机推荐
- android完整智能家居、备忘录、蓝牙配对、3D动画库、购物车页面、版本更新自动安装等源码
Android精选源码 app 版本更新.下载完毕自动自动安装 android指针式分数仪表盘 ANdroid蓝牙设备搜索.配对 Android 图片水印框架,支持隐形数字水印 android3D旋转 ...
- 如何回收VCSA 6自带的vPostgres数据库空间
最近有学生连续反应由于VCSA磁盘空间满了,导致服务无法正常启动,寻求压缩数据库空间的问题.首先说下,VCSA的数据库是没办法图形界面管理的, 它的内置vPostgres数据库的管理只能通过命令行来完 ...
- idea出现 Unable to open debugger port (127.0.0.1:xxxx): java.net.SocketException "socket closed" 解决方案
第一种:重启电脑,太费劲: 第二种: 1)根据端口号找到进程pid netstat -aon|findstr "1099" 2)杀掉进程pid即可 netstat -aon|fin ...
- dhcp server
centos yum install dhcp -y cat /etc/dhcp/dhcpd.conf default-lease-time 7200; max-lease-time 14400; s ...
- python数据类型:列表List和Set
python数据类型:列表List, Set集合 序列是Python中最基本的数据结构 序列中每个元素都分配一个数字,表示索引 列表的数据项不需要具有相同的类型 列表中的值可以重复并且有 ...
- hashCode() 和 equals()比较
1. 首先equals()和hashCode()这两个方法都是从Object类中继承过来的. equals()方法在Object类中定义如下: public boolean equals(Object ...
- cs231n spring 2017 lecture3 Loss Functions and Optimization
1. Loss function是用来量化评估当前预测的好坏,loss function越小表明预测越好. 几种典型的loss function: 1)Multiclass SVM loss:一般的S ...
- spring security之Remember Me
spring-security.xml配置 环境: spring版本:5.0.7.RELEASE spring-security.xml引入: http://www.springframework.o ...
- JS数组去重算法
思路: 1.创建一个新的数组存放结果 2.创建一个空对象 3.for循环时,每次取出一个元素与对象进行对比,如果这个元素不重复,则把它存放到结果数组中,同时把这个元素的内容作为对象的一个属性,并赋值为 ...
- 基于seo的话 一个页面里的h1标签应该控制在多少个
不能出现多个,一个页面只能出现一次,次数多了就会造成权重分散