1. 理解访问器属性原理与应用场景,并实例演示
访问器属性
本质上是方法,调用使用属性访问
语法
user = {
// 常规(数据)属性
data: {name: "佐罗",age: 10,address:'xx-xx-xx-1222'},
// 方法(访问器)属性
getAge() {return this.data.age;},
setAge(age) {this.data.age = age;},
getInfo(){
return `name:${this.data.name} age:${this.data.age} address:${this.data.address}`
},
};
// 伪装成属性的方法
// get age(){return this.data.age;}
// console.log(user.age)
// set age(age){this.data.age = age;}
// user.age获取年龄 user.age=20设置年龄
2. 实例演示获取dom元素的二个重要方法
//dom元素获取方法(一)
//querySelector、getElementById
document.getElementById('name')
items = document.querySelectorAll("li");
f = document.querySelector('#login').querySelector('#name')
//console.log(f.value)
f1 = document.forms.login
//dom元素获取方法(二)
//对于forms来说,索引与id同义,可以直接使用input的name属性来匹配表单控件元素,控件可以用name来引用,如果没有name,就用id
name = document.forms.login['name'].value
name2 = document.forms.login.name.value
psw = document.forms.login['psw'].value
console.log(name,name2,psw)
//对象转json
info = {name,psw}
console.log(JSON.stringify(info))
练习-变量使用范围
let x = 1 //全局变量 x=1
function test1(a,b){
let x = 2 //函数局部变量
console.log(x)
}
test1()//打印2
console.log(x)//打印1
let a = 1 //全局变量 x=1
function test2(c,d){
a = 2 //给内存中的a重新赋值2
console.log(a)
}
console.log(a)//打印1 函数未执行
test2()//打印2
a = 3
console.log(a)//打印3
//闭包-函数当成返回值
function f2() {
// a是 f2的私有变量
let a = 1;
return function() {
return a++;
};
}
let fr = f2();//存储后后面才能累加
console.log(fr())
console.log(fr())
console.log(fr())
console.log('-------')
//闭包的条件
// 1. 父子函数
// 2. 子函数中调用父函数中的变量
// 3. 返回子函数
function useLive(){
let lives = 10 //假设1个英雄有10条命
//生命使用后会减少1条
//函数局部变量lives外部不可见,会比较安全
//使用一条生命
return function(){
return --lives
}
}
//lives = 1 //函数内的lives不受全局变量的影响
let func1 = useLive()
console.log(func1())
console.log(func1())