JavaScript--对象--方法、this关键字和prototype

retager

于 2023-08-09 19:40:40 发布

阅读量48

点赞数

文章标签： javascript 原型模式前端

本文链接：https://blog.csdn.net/retager/article/details/132190791

版权

方法是一个汉语词汇，一般是指为获得某种东西或达到某种目的而采取的手段与行为方式。

在对象中，若键值对的值是一个函数，那么这个键值对就是该对象的方法。

var obj = {
       value: function () { console.log("hello") }
      }

调用该方法：

obj.value()

this关键字是一个难点，它代表函数运行时，自动生成的一个内部对象，只能在函数内部使用。

    function fn(){
     
    　　this.a = 1;
     
    }

在运用this关键字时，我们需要注意它的指向。

且this指向的永远只可能是对象，这并不会取决于this写在哪，而是取决于函数在哪调用

我们知道函数是一个特殊的对象因此函数也有一些官网提供的属性和方法，length属性就是函数的形参，而call方法则是调用函数并指定函数内部的this指向

var obj1={
     age:17,
     value:function(){
        console.log(this.age)
     }
 }
var obj2={
     age:22
 }

obj1.value.call(obj2)

使用call时，第一个参数指定了函数内部的this指向，后面的参数为传入的实参，用逗号分隔。

apply的用法与call大致相同，唯一不同的地方在于传入参数时需要用数组：

var obj1={
     value:function(a,b){
        console.log(a+b)
     }
 }
var obj2={
     
 }

obj1.value.apply(obj2,[3,4])

使用bind更改this的指向后，调用该this所在的函数时，this只会指向bind指定的指向

var obj1={
     age:25,
     value:function(){
        console.log(this.age)
     }.bind(obj2)
 }
var obj2={
     age:18
 }

obj1.value()

var obj1={
     age:25,
     value:function(){
        console.log(this.age)
     }
 }
var obj2={
     age:18
 }

var re=obj1.value.bind(obj2)
re()

当函数是声明式的写法时，不能直接调用bind函数

使用new关键字，我们可以创建一个对象

 var obj = new Object()
 obj.name = "Aric"
 obj.age  = 21

你是否会认为创建对象应该这样写

var obj  = {
    name : "Aric",
    age  : 21
}

事实上，上图使用的是语法糖，第一种方法中，Object是官方提供的一个函数。然后我们继续向下走：

function fn() {
    this.name="mary
    this.age=20
    }

var fer = new fn()
console.log(fer)

你发现了什么？

我们用new通过函数创建了一个对象，这个函数就叫构造函数。通过这种方法，系统的执行顺序为：

需注意函数内部的this指向的是创建的那个对象。

在函数中，除了length属性，还有一个prototype属性，它保存了一个内置对象。

function fn() {
    this.name="mary
    this.age=20
    }

var fer = new fn()

在上图的过程中，系统先创建一个空对象，再给这个空对象添加一个属性 __proto__，这属性保存了一个对象，这个对象就是构造函数的prototype属性中保存的那个对象，然后，调用函数，里面的this指向创建的对象，最后，表达式生成结果。

简短地说，函数有一个 prototype保存了一个对象，我们使用new函数创建对象时，创建的对象的原型对象就是它。

function fn() {
     this.a = 20
 }
fn.prototype.b = 18

var f1 = new fn()
console.log(f1.b)

让我们再创建一个对象f2

var f1 = new fn()

此时f1和f2的prototype是同一个，即

console.log(f1.__proto__ === f2.__proto__)//true

关注