笔试:var let const、 解构赋值、call apply bind改变函数内部的this指向

1. var let const

作用域变量提升重复声明修改
var函数作用域存在可以可以
let块级作用域不可以可以
const块级作用域不可以不可以

1)var:用于声明变量

  var a = 8; //全局变量
   function fun() {
       var a = 6; //局部变量
       console.log(a); //6
   }
   fun()
   console.log(a);//8

函数内省略var:

        var a = 8; //全局变量
        function fun() {
            a = 6; //全局变量
            console.log(a); //6
        }
        fun()
        console.log(a);//6

注意:var 声明的变量存在提升

2)let 声明变量特征

  1. 声明的变量具有块级作用域的特征;
  2. 在同一个块级作用域不能重复声明变量;
  3. let声明的变量不存在变量提升

3)const
定义的变量不允许修改

const x = 1;
console.log(x);//1
x = 2;
console.log(x);//Uncaught TypeError: Assignment to constant variable.

const 声明创建一个值的只读引用:

const obj = {
	a:1,
	b:2
};
console.log(obj.a);//1
obj.a = 3;
console.log(obj.a);//3

2. 解构赋值

解构赋值语法是一种 Javascript 表达式。通过解构赋值, 可以将属性/值从对象/数组中取出,赋值给其他变量。

var a, b, c, rest;
[a, b] = [10, 20];
console.log(a); // 10
console.log(b); // 20
console.log(c); //undefined

[a, b, ...rest] = [10, 20, 30, 40, 50];
console.log(a); // 10
console.log(b); // 20
console.log(rest); // [30, 40, 50]

var o = {p: 42, q: true};
var {p, q} = o;
console.log(p); // 42
console.log(q); // true

3. 函数调用方式

  1. 函数调用
    function foo() {
        console.log(this);//this指向window
    }
    foo();
  1. 对象方法调用
    创建了一个对象 (myObject), 对象有两个属性 (firstName 和 lastName), 及一个方法 (fullName):
    fullName 方法是一个函数。函数属于对象。 myObject 是函数的所有者。
var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function () {
        return this.firstName + " " + this.lastName; //this指向当前对象(myObject)
    }
}
myObject.fullName();         // 返回 "John Doe"
  1. 构造函数调用
    如果函数调用前使用了new关键字,则是调用了构造函数
    this指向被创建的对象
// 构造函数:
function myFunction(arg1, arg2) {
    this.firstName = arg1;
    this.lastName  = arg2;
}
 
// This    creates a new object
var x = new myFunction("John","Doe");
x.firstName;    
  1. 上下文调用模式
    函数名.call( 对象, 参数 );
    函数名.apply( 对象, [ 参数 ] );
   //1. call()
   var o =  {
       name: 'sunny'
   }
   function fn(a, b) {  
       console.log(this);//{name: 'sunny'}
       console.log(a + b);//3
   }
   fn.call(o, 1, 2);

   //call 可以调用函数,可以改变函数内的this指向
   //可以实现继承
   function Father(uname, age, sex) {  
       this.uname = uname;
       this.age = age;
       this.sex = sex;
   }
   function Son(uname, age, sex) {  
       console.log(this);//Son {}
       Father.call(this, uname, age, sex);
   }
   var son = new Son('刘德华', 18, '男');
   console.log(son);//Son {uname: '刘德华', age: 18, sex: '男'}
   var o = {
       name: 'sunny'
   };
   function fn(color) {
       console.log(this);
       console.log(color); //'pink'
   };
   fn.apply(o, ['pink']);//{name: 'sunny'}  pink
   //1. 也是调用函数,第二个可以改变函数内部的this指向
   //2. 但是它的参数必须是数组(伪数组)
   //3. apply 的主要应用,可以利用apply 借助于数学内置对象求最大值
   // Math.max();
   var arr = [1, 66, 3, 99, 4];
   // var max = Math.max.apply(null, arr);
   var max = Math.max.apply(Math, arr);
   var min = Math.min.apply(Math, arr);
   console.log(max, min);//99 1

call apply bind总结
相同点:都可以改变函数内部的this指向
不同点:
1. call和apply会调用函数,并且改变函数内部的this指向
2. call和apply传递的参数不一样,call传递参数aru2,aru1,…形式,apply传递数组
3. bind不会调用函数,可以改变函数内部this指向

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值