惠州企业网站设计,品牌网站怎么做,网站建设学的是什么知识,福建省住房和城乡建设网站一.JavaScript介绍
1.1什么是JavaScript
JavaScript简称“js”#xff0c;js与java没有任何关系。
js是一种“轻量级、解释型、面向对象的脚本语言”。
二.JavaScript的两种导入方式
2.1内联式
在HTML文档中使用script标签直接引用。 scriptconsole.log…一.JavaScript介绍
1.1什么是JavaScript
JavaScript简称“js”js与java没有任何关系。
js是一种“轻量级、解释型、面向对象的脚本语言”。
二.JavaScript的两种导入方式
2.1内联式
在HTML文档中使用script标签直接引用。 scriptconsole.log(Hello,world,内联样式)/script
2.2外联样式
在HTML中使用script标签的“src”属性引入 script src./JS/myscript.js/script
在这里我有一个JS文件夹,里面有一个“myscript.js”名字的js文件
文件内容如下
console.log(Hello,world,外联样式);
效果 三.js的变量作用域
3.1全局作用域
在“函数之外”定义的变量拥有“全局作用域”被定义的变量叫作“全局变量”
var carName porsche;// 此处的代码可以使用 carNamefunction myFunction() {// 此处的代码也可以使用 carName
}
而“全局变量”可以在JS程序中的任何地方被访问例如
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodyscriptvar x 100;console.log(x在第一个script标签中被访问,x)function pt(){console.log(x在pt函数中被访问,x)}pt();/scriptscriptconsole.log(x在第二个script标签中被访问,x)/script
/body
/html
效果 可见全局变量哪怕是在不同的script标签中仍然可以被访问。
那么全局变量在被调用位置的后面还能不能访问呢如下所示 scriptconsole.log(x在最前面script标签中被访问,x)/scriptscriptvar x 100;console.log(x在第一个script标签中被访问,x)/script
效果 报错了显示“x没有被定义”。
这说明作用域只在被定义的开始位置到整个HTML文档结束这与其它编程语言中的变量作用域是类似的如果学习过(C/C、python等等)应该很好理解。
3.2函数(局部)作用域
在“函数”定义的变量拥有”函数作用域“被叫作“局部变量”
例如
// 此处的代码不可以使用 carNamefunction myFunction() {var carName porsche;// code here CAN use carName
}// 此处的代码不可以使用 carName 很好理解吧就跟编程语言中的局部作用域是一样的。
“局部变量只能在被定义的函数中访问”
例如
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodyscriptfunction sample(){var x 100;console.log(x在sample函数中被调用,x);}sample();console.log(x在script标签中被调用,x);/script
/body
/html
效果 可以看到在script标签中调用x报错提示“没有定义x”。
这说明x是一个局部变量。
3.3块作用域
块作用域是ES2015新订的规则。
块作用域指的是在“{}(花括号)”中定义的变量具有块作用域在块外无法访问。
值得注意的是使用“var”在块内定义变量仍然可以在块外访问只有使用“let”定义的变量才不可以在块外访问。
例如 { var x 10; } // 此处可以使用 x 比如
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodyscript{var x 10;let y 100;}console.log(块外访问var定义的x,x);console.log(块外访问let定义的y,y);/script
/body
/html
效果 看到使用let定义的变量y具有“块作用域”
3.4重新定义变量的问题【重要】
使用var两次定义变量第二次定义在某个块中会造成值改变因为var默认是全局变量哪怕在块中。
例如
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodyscriptvar x 100;console.log(第一次访问var定义的x,x);{var x 10;}console.log(第二次访问var定义的x,x);/script
/body
/html
效果 可以看到全局变量x在块内被修改了
但如果我们在块中使用“let”定义x那么就可以解决这个问题了因为let定义的变量具有块作用域不会改变全局变量x scriptvar x 100;console.log(第一次访问var定义的x,x);{let x 10;}console.log(第二次访问var定义的x,x);/script
效果
