js
理解
JavaScript
代码,加载Web页面时在浏览器中运行,这个代码能够对用户的动作做出响应、更新或修改页面、与Web服务器通信,总的来讲,可以让页面感觉到更像是一个应用而不是一个文档。
作用域种类
作用域的决定了这些变量的可访问性
1.局部作用域(函数作用域)
在js函数中声明的变量会变成函数的局部变量,局部变量只能在函数内部访问。
由于只能在函数内部识别局部变量,因此能够在不同函数中使用同名变量。
在函数开始时会创建局部变量,在函数完成时会删除它们。
f1();
function f1(){
var n = 5;
if(true){
var n = 10;
}
console.log(n); // 10
}
2.块级作用域
块级作用域的范围是:一切大括号{} 内部使用let/const
声明的变量
function f1(){
let n = 5;
if(true){
let n = 10;
}
console.log(n); // 5
}
3.全局作用域
函数之外声明的变量回变成全局变量,网页的所有脚本和函数都能访问它。
对尚未声明的变量进行赋值,此变量将自动成为全局变量
function myFunction() {
name = "lihua";//未声明的变量
}
在“严格模式”中不会自动创建全局变量。
局部作用域与块级作用域的区别是作用范围不同
局部作用域:仅限于函数体内部声明的变量
块级作用域:一切大括号{} 内部使用let/const
声明的变量
for里用var的作用域
function f2(){
for(var i=0;i<10;i++){
console.log('i');//输出0~9
}
console.log(i);//10
}
f2();
console.log(i);//未定义
let var const
-
var
变量可以用window 点出来,let
和const
不可以
var a = 100;
console.log(a,window.a); // 100 100
let b = 10;
console.log(b,window.b); // 10 undefined
const c = 1;
console.log(c,window.c); // 1 undefined
var
可以变量的提升:可以先使用后声明,let
和const
不可以同一作用域下,
var
可以同名变量,即以声明的值进行覆盖,let
和const
不可以
函数提升
函数的提升是可以直接在函数声明之前调用该函数
js
代码执行前引擎会先进行预编译,预编译期间会将函数声明提升至其对应作用域的最顶端
提升的只是函数的声明,不会提升函数表达式
break
跳多重循环
public class Test {
public static void main(String [] args){
//给循环层设置外层标签wc
wc:for(int i=1;i<=9;i++){
//给循环层设置内层标签nc
nc:for(int j=1;j<=i;j++){
System.out.print(j+"*"+i+"="+j*i+"\t");
if(j==3){
break wc;//跳出到外层wc
}
}
System.out.println();
}
System.out.println("结束");
}
}
ajax
异步
AJAX
= 异步 JavaScript
和 XML
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
//简单实例
使用 AJAX 修改该文本内容
回调函数
在JavaScript
中,回调函数具体的定义为:函数A作为参数(函数引用)传递到另一个函数B中,并且这个函数B执行函数A
var fs = require("fs");
function writeFile(callback) {
fs.writeFile('input.txt', '我是通过fs.writeFile 写入文件的内容', function (err) {
if (!err) {
console.log("文件写入完毕!")
c = 1
callback(c)
}
});
}
var c = 0
writeFile(function (x) {
console.log(x)
})
闭包
定义:能够读取其他函数内部变量的函数
function f1(){
var a = 10;
function f2(){
console.log(a);
}
return f2; // f1返回了f2的引用
}
var result = f1(); // result就是f2函数了
result();
当一个值在内存中失去引用时,垃圾回收机制会根据特殊的算法找到它,并将其回收,释放内存。
函数的执行上下文,在执行完毕之后,生命周期结束,那么该函数的执行上下文就会失去引用。其占用的内存空间很快就会被垃圾回收器释放,闭包的存在,会阻止这一过程
原型 原型链
原型是JavaScript
中的继承的基础,JavaScript
的继承就是基于原型的继承。
JavaScript是基于原型的我们创建的每个函数都有一个 prototype
(原型) 属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。
原型链
JavaScript
中所有的对象都是由它的原型对象继承而来。而原型对象自身也是一个对象,它也有自己的原型对象,这样层层上溯,就形成了一个类似链表的结构,这就是原型链
Window.localStorage
使用localStorage创建一个本地储存name/value
对
//保存数据
localStorage.setItem("key","value");
//读取数据
var lastname=localStorage.getItem("key");
//删除数据
localStorage.removeItem("key");
JSON
json.stringify
可以将js
值或者对象转换为 JSON
字符串
JSON.parse
可以将 JSON
字符串转换为对象
使用json.stringify
可以将对象或者数组转化为字符串,然后进行本地存储,待从本地存储读取的时候要使用JSON.parse
进行转化,再次将字符串转化为对象或者数组
localStorage.setItem(keyName, JSON.stringify(valueArrObj));
var valueArrObj = JSON.parse(localStorage.getItem('informationName'));
js创建对象的方式
1.使用new运算符调用构造函数,创建一个实例对象
//语法格式:
var objectName=new functionName(args);
//例子:
var arr=new Array();//定义一个空数组
2.使用直接量快速创建对象
//是最高效、最简便的方法
var objectName={
name1 : value1,
name2 : value2,
...
namen : valuen
}
//例子
let valueObj = {
'txt': 'txtInput',
'delayTime': 0,
'cheak': false,
'collect': false
}
splice()
方法
有添加和删除数组元素的功能
//两个参数,从第j项开始删除,共删除掉1项
newTaskArr.splice(j,1); //删除掉第j项
//三个参数,向指定位置添加任意的项
newTaskArr=["Banana", "Orange", "Apple", "Mango"];
newTaskArr.splice(2,0,"orange","blue"); //从第二项开始添加"orange","blue"
//如果第二项不为零,则先删除给定的项,再添加给的项
//["Banana","orange","blue", "Orange", "Apple", "Mango"]
HTML DOM nodeValue
nodeValue
是JavaScript
中的一个HTML DOM属性;nodeValue
属性可以返回或者设置指定节点的值
节点值根据节点类型的不同而有所不同:
1、文本节点:nodeValue
属性值就是文本节点的内容。
2、属性节点:nodeValue
属性值就是属性节点的值。
3、文档节点和元素节点:nodeValue
属性是不可用的。
HTML DOM appendChild()
appendChild()
方法向节点添加最后一个子节点。
HTML DOM insertBefore()
node.insertBefore(node0,node1);
//node0:插入的内容
//node1:插入该节点的前面
HTML DOM cloneNode()
方法传递的参数为true或false
true 它将复制当前节点的所有子节点的内容
false只复制当前节点
HTML DOM getElementsByTagName()
返回带有指定标签名的对象的集合
属性:
textContent
:只获取相应片段的文本,不会获取到标签内容。获取的文本保持原来的格式(空格,换行任然存在)
innerHTML
:将获取到的所有元素,以HTML的形式展示出来,包括文本和和标签(相当于直接获取了HTML的相应片段)
innerText
:只获取相应片段的文本,不会获取到标签内容。获取的文本没有原来的格式
HTML DOM classList
属性
classList
属性返回元素的类名,作为 DOMTokenList
对象。
该属性用于在元素中添加,移除及切换 CSS
类。
classList
属性是只读的,但你可以使用 add()
和 remove()
方法修改它。