this练习题

function Foo() {
    getName = function () {
        console.log(1);
    };
    return this;
}
Foo.getName = function () {
    console.log(2);
};
Foo.prototype.getName = function () {
    console.log(3);
};
var getName = function () {
    console.log(4);
};

function getName() {
    console.log(5);
}

 

var myName = '全局的name'
var obj = {
    myName: '奇怪的函式',
    fn: function(a, b, c){
        return this.myName + ',' + a + ',' + b + ',' + c
    }
}

var fnA = obj.fn
var fnB = fnA.bind(null, 0)

console.log(fnB(1, 2))

 

class Parent {
  read () {
    this._read()
  }
}

class Child extends Parent{
  _read(){
    console.log('_read ok')
  }
}

let c = new Child()

c.read()

 

 

 

 

Promise.resolve()
  .then(() => {
    console.log("then1");
    new Promise((resolve, reject) => {
      resolve();
    })
      .then(() => {
        console.log("then1-1");
        return Promise.resolve();
      })
      .then(() => {
        console.log("then1-2");
      });
  })
  .then(() => {
    console.log("then2");
  })
  .then(() => {
    console.log("then3");
  })
  .then(() => {
    console.log("then4");
  })
  .then(() => {
    console.log("then5");
  }).then(() => {
    console.log("then6");
  });

 

 

// 手写bind
var body = document.body
var obj = {name: 'obj'}

function func(x, y){
    console.log(this, x, y)
}

Function.prototype.myBind = function bind(context = window, ...params){
    // let _this = this
    // return function anonymous(){
    //    _this.call(context, ...params)
    //}

　　 return (inners) => this.apply(context, params.concat(inners))

}

body.onclick = func.myBind(obj, 10, 20)



// 循环函数参数的argument
[].forEach.call(arguments, item => { console.log(item) }) 
// 检测数据类型 
console.log(Object.prototype.toString.call(1))

 

 

 

 

// 重写Object.create：

Object.create = function(prototype){

　　function Func() {}

　　　Func.prototype = prototype
　　　return new Func()

}

function Dog(name){
    this.name = name
}

Dog.prototype.bark = function(){
    console.log('wangwang')
}

Dog.prototype.sayName = function(){
    console.log('my name is ' + this.name)
}

function _new(Func, ...args){
    // 1.创建实例对象，对象.__proto__===类.prototype
    let obj = {}
    obj.__proto__ = Func.prototype  // === let obj = Object.create(Func.prototype) ie不兼容__proto__
    // 2.把类当作普通函数执行，this指向的是实例对象
    let r = Func.call(obj, ...args)
    // 3.函数r存在返回值，判断数据类型，否则就返回函数执行结果r
    if(typeof r !== 'null' && /^(function|object)$/.test(typeof r)){
        return r
    }
    return obj
    
}

var sanmao = _new(Dog, '三毛')
sanmao.bark() // => 'wangwang'
sanmao.sayName() // => 'my name is 三毛'
console.log(sanmao instanceof Dog) // => true

 

 

 

(function (){
    function handleNum(num){
        num = handleNum(num)
        return isNaN(num) ? 0 : num
    }
    Number.prototype.plus = function (num){
        num = Number(num)
        return this + num
    }

    Number.prototype.minus = function (num){
        num = handleNum(num)
        return this - num
    }
})()
var n = 10
var m = n.plus(10).minus(5)

 

 

{
    function foo(){  // 浏览器会把这行代码映射到全局window上一份
        console.log('11')
    }
    foo=1  // 操作私有的

    console.log(foo)
}
console.log(foo)

// 代码执行：如果大括号中有 函数 / let / const 则会形成一个块级上下文

{
    function foo(){}
    foo=1

    function foo(){}
    foo=2

    function foo(){}
    foo=3
}
console.log(foo)

// 全局之前操作过，所以把这以前的映射给全局

 

 

 

var a =0,b=0
function A(a){
    // 创建函数把堆地址赋值给了全局A => 全局函数A重新赋值
    A = function(b){
        alert(a+b++)
    }

    alert(a++)
}
A(1)
A(2)
// 堆内存创建完后有上下文

　　

 

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