好久没更新了
This commit is contained in:
92
js/lx/a.html
Normal file
92
js/lx/a.html
Normal file
@@ -0,0 +1,92 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<script>
|
||||
var a = 2
|
||||
// var obj1 = {
|
||||
// a: 1,
|
||||
// fn1: (function (a) {
|
||||
// this.a = a
|
||||
// a++
|
||||
// return function () {
|
||||
// this.a = a++
|
||||
// console.log(this)
|
||||
// console.log(a)
|
||||
// }
|
||||
|
||||
// })(a)
|
||||
|
||||
// }
|
||||
// var fn1 = obj1.fn1
|
||||
// var fn1=function () {
|
||||
// this.a = a++
|
||||
// console.log(this)
|
||||
// console.log(a)
|
||||
// }
|
||||
|
||||
// console.log(fn1.toString())
|
||||
// fn1()
|
||||
|
||||
// console.log(getA)
|
||||
// if ('a' in window) {
|
||||
// var a = ''
|
||||
// function getA(a) {
|
||||
// a = a || this.a
|
||||
// console.log(this.a)
|
||||
// }
|
||||
// getA(a)
|
||||
// }
|
||||
|
||||
|
||||
|
||||
var c = 3
|
||||
function getC() {
|
||||
this.c++
|
||||
console.log(this,'kkkk')
|
||||
return function () {
|
||||
c = this.c * 2
|
||||
console.log(c)
|
||||
}
|
||||
}
|
||||
var obj3 = {
|
||||
c: 2,
|
||||
getC: (function () {
|
||||
this.c -= 1 //win.c-1 win.c=2
|
||||
console.log(this.c, this,'sss')
|
||||
return this.getC //obj3.getc=win.getc
|
||||
})()
|
||||
|
||||
}
|
||||
// var a=obj3.getC()
|
||||
// a()
|
||||
// obj3.getC()()
|
||||
|
||||
getC() //win.c++ =>win.c=3
|
||||
|
||||
console.log(obj3.getC.toString(),"aaaaaaa")
|
||||
obj3.getC()
|
||||
// console.log(obj3.c,window.c)
|
||||
var f3=obj3.getC;
|
||||
f3()
|
||||
// console.log(window.c)
|
||||
// console.log(obj3.c)
|
||||
|
||||
//step1 立即执行函数 => this 指向window win.c-1 -> win.c=2
|
||||
//step2 getC() this.c -=> win.c++ =>2+1 =>3
|
||||
//step3 obj3.getC() step1中 obj3.getc= win.getc 所以就是执行win.getc
|
||||
// 即 winc++ win.c=3
|
||||
//obj3.getc时 this指向的是obj3，this.c操作的是obj3.c , 所以obj3.c 也+1等于3
|
||||
//step4 f3本身等于win.getc函数， 执行f3() 即执行 win.getc() =>win.c++ win.c=4
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
97
js/lx/callapply.md
Normal file
97
js/lx/callapply.md
Normal file
@@ -0,0 +1,97 @@
|
||||
1.
|
||||
window.color = 'red';
|
||||
document.color = 'yellow';
|
||||
|
||||
var s1 = {color: 'blue' };
|
||||
function changeColor(){
|
||||
console.log(this.color);
|
||||
}
|
||||
|
||||
changeColor.call(); //red (默认传递参数)
|
||||
changeColor.call(window); //red
|
||||
changeColor.call(document); //yellow
|
||||
changeColor.call(this); //red
|
||||
changeColor.call(s1); //blue
|
||||
|
||||
2
|
||||
var Pet = {
|
||||
words : '...',
|
||||
speak : function (say) {
|
||||
console.log(say + ''+ this.words)
|
||||
}
|
||||
}
|
||||
Pet.speak('Speak'); // 结果：Speak...
|
||||
|
||||
var Dog = {
|
||||
words:'Wang'
|
||||
}
|
||||
|
||||
//将this的指向改变成了Dog
|
||||
Pet.speak.call(Dog, 'Speak'); //结果： SpeakWang
|
||||
|
||||
3
|
||||
用 apply重写上面两个函数
|
||||
|
||||
4
|
||||
function add(c,d){
|
||||
return this.a + this.b + c + d;
|
||||
}
|
||||
|
||||
var s = {a:1, b:2};
|
||||
console.log(add.call(s,3,4)); // 1+2+3+4 = 10
|
||||
console.log(add.apply(s,[5,6])); // 1+2+5+6 = 14
|
||||
|
||||
5.画出原型链
|
||||
//游戏--->王者---->小乔---->花嫁
|
||||
|
||||
6
|
||||
function C1(name) {
|
||||
if (name) {
|
||||
this.name = name;
|
||||
}
|
||||
}
|
||||
|
||||
function C2(name) {
|
||||
this.name = name;
|
||||
}
|
||||
|
||||
function C3(name) {
|
||||
this.name = name || 'join';
|
||||
}
|
||||
C1.prototype.name = 'Tom';
|
||||
C2.prototype.name = 'Tom';
|
||||
C3.prototype.name = 'Tom';
|
||||
alert((new C1().name) + (new C2().name) + (new C3().name));
|
||||
|
||||
7
|
||||
function Fn(num) {
|
||||
this.x = this.y = num;
|
||||
}
|
||||
Fn.prototype = {
|
||||
x: 20,
|
||||
sum: function () {
|
||||
console.log(this.x + this.y);
|
||||
}
|
||||
};
|
||||
let f = new Fn(10);
|
||||
console.log(f.sum === Fn.prototype.sum);
|
||||
f.sum();
|
||||
Fn.prototype.sum();
|
||||
console.log(f.constructor);
|
||||
|
||||
8
|
||||
var print=function(){alert(1);}
|
||||
function Fn() {
|
||||
print=function(){alert(2);}
|
||||
return this;
|
||||
}
|
||||
function print(){alert(3);}
|
||||
Fn.prototype.print=function(){alert(4);}
|
||||
Fn.print=function(){alert(5);}
|
||||
|
||||
print();
|
||||
Fn.print();
|
||||
Fn().print();
|
||||
new Fn.print();
|
||||
new Fn().print();
|
||||
|
||||
120
js/lx/jsthis.md
Normal file
120
js/lx/jsthis.md
Normal file
@@ -0,0 +1,120 @@
|
||||
# this
|
||||
1
|
||||
|
||||
function fn2(){
|
||||
console.log(this.n)
|
||||
var n='n'
|
||||
this.n=10
|
||||
console.log(n)
|
||||
}
|
||||
var obj={fn2:fn2, n:1}
|
||||
fn2()
|
||||
obj.fn2()
|
||||
console.log(obj.n, window.n)
|
||||
|
||||
//undefined 'n'
|
||||
//1 'n'
|
||||
//10 10
|
||||
|
||||
2
|
||||
|
||||
function f(){console.log(this)}
|
||||
|
||||
var obj={
|
||||
fn: (function(){
|
||||
return this.f
|
||||
})(),
|
||||
f: function(){console.log(this)}
|
||||
}
|
||||
f()
|
||||
obj.f()
|
||||
obj.fn()
|
||||
// window obj obj
|
||||
|
||||
3
|
||||
|
||||
var n = 10
|
||||
var obj1={
|
||||
n:1,
|
||||
f:function(){this.n++; n=this.n++}
|
||||
}
|
||||
|
||||
obj1.f()
|
||||
console.log(n) // 2
|
||||
console.log(obj1.n) // 2
|
||||
window.setTimeout(obj1.f, 1000)
|
||||
|
||||
//2
|
||||
//3
|
||||
|
||||
4
|
||||
|
||||
console.log(getA)
|
||||
if('a' in window){
|
||||
var a = ''
|
||||
function getA(a){
|
||||
a = a||this.a
|
||||
console.log(this.a)
|
||||
}
|
||||
getA(a)
|
||||
}
|
||||
|
||||
5
|
||||
|
||||
var a=2
|
||||
var obj1 = {
|
||||
a:1,
|
||||
fn1: (function(a){
|
||||
this.a = a
|
||||
a++
|
||||
return function(){
|
||||
this.a = a++
|
||||
console.log(a)
|
||||
}
|
||||
|
||||
})(a)
|
||||
}
|
||||
obj1.fn1() // 4
|
||||
var fn1 = obj1.fn1
|
||||
fn1() // window.a = 4,a=5
|
||||
|
||||
6
|
||||
|
||||
var c=3
|
||||
function getC(){
|
||||
this.c++
|
||||
return function (){
|
||||
c=this.c*2
|
||||
console.log(c)
|
||||
}
|
||||
}
|
||||
var obj3={
|
||||
c: 2,
|
||||
getC:(function(){
|
||||
this.c -= 1
|
||||
return this.getC
|
||||
})()
|
||||
}
|
||||
getC() // window.c = 3
|
||||
obj3.getC() // obj3.c=3
|
||||
var f3=obj3.getC
|
||||
f3() // window.c=4
|
||||
console.log(window.c) // 4
|
||||
console.log(obj3.c) // 3
|
||||
|
||||
|
||||
for (var i = 1; i <= 5; i++) {
|
||||
|
||||
setTimeout( function timer() {
|
||||
|
||||
console.log(i);
|
||||
|
||||
}, 1000 );
|
||||
|
||||
}
|
||||
|
||||
上面的代码会输出什么？怎么改动上述代码，使其依次输出1、2、3、4、5 并说明原因
|
||||
|
||||
|
||||
理论题：
|
||||
谈谈什么是闭包
|
||||
115
js/lx/this.md
Normal file
115
js/lx/this.md
Normal file
@@ -0,0 +1,115 @@
|
||||
# this
|
||||
1
|
||||
|
||||
function fn2(){
|
||||
console.log(this.n)
|
||||
var n='n'
|
||||
this.n=10
|
||||
console.log(n)
|
||||
}
|
||||
var obj={fn2:fn2, n:1}
|
||||
fn2()
|
||||
obj.fn2()
|
||||
console.log(obj.n, window.n)
|
||||
|
||||
|
||||
2
|
||||
|
||||
function f(){console.log(this)}
|
||||
|
||||
var obj={
|
||||
fn: (function(){
|
||||
return this.f
|
||||
})(),
|
||||
f: function(){console.log(this)}
|
||||
}
|
||||
f()
|
||||
obj.f()
|
||||
obj.fn()
|
||||
|
||||
|
||||
3
|
||||
|
||||
var n = 10
|
||||
var obj1={
|
||||
n:1,
|
||||
f:function(){this.n++; n=this.n++}
|
||||
}
|
||||
|
||||
obj1.f()
|
||||
console.log(n)
|
||||
console.log(obj1.n)
|
||||
window.setTimeout(obj1.f, 1000)
|
||||
|
||||
|
||||
4
|
||||
|
||||
console.log(getA)
|
||||
if('a' in window){
|
||||
var a = ''
|
||||
function getA(a){
|
||||
a = a||this.a
|
||||
console.log(this.a)
|
||||
}
|
||||
getA(a)
|
||||
}
|
||||
|
||||
5
|
||||
|
||||
var a=2
|
||||
var obj1 = {
|
||||
a:1,
|
||||
fn1: (function(a){
|
||||
this.a = a
|
||||
a++
|
||||
return function(){
|
||||
this.a = a++
|
||||
console.log(a)
|
||||
}
|
||||
|
||||
})(a)
|
||||
}
|
||||
obj1.fn1()
|
||||
var fn1 = obj1.fn1
|
||||
fn1() // window.a = 4,a=5
|
||||
|
||||
6
|
||||
|
||||
var c=3
|
||||
function getC(){
|
||||
this.c++
|
||||
return function (){
|
||||
c=this.c*2
|
||||
console.log(c)
|
||||
}
|
||||
}
|
||||
var obj3={
|
||||
c: 2,
|
||||
getC:(function(){
|
||||
this.c -= 1
|
||||
return this.getC
|
||||
})()
|
||||
}
|
||||
getC()
|
||||
obj3.getC()
|
||||
var f3=obj3.getC
|
||||
f3()
|
||||
console.log(window.c)
|
||||
console.log(obj3.c)
|
||||
|
||||
|
||||
for (var i = 1; i <= 5; i++) {
|
||||
|
||||
setTimeout( function timer() {
|
||||
|
||||
console.log(i);
|
||||
|
||||
}, 1000 );
|
||||
|
||||
}
|
||||
|
||||
上面的代码会输出什么？怎么改动上述代码，使其依次输出1、2、3、4、5 并说明原因
|
||||
|
||||
|
||||
理论题：
|
||||
谈谈什么是闭包
|
||||
Reference in New Issue
Block a user