js 引用类型 构造函数 实例 引用类型方法 对象方法 原型的概述

本文深入探讨了JavaScript中面向对象编程的概念,包括构造函数、工厂方法、原型链、hasOwnProperty等核心知识点,详细解释了如何在JavaScript中实现类、对象方法、原型方法,并通过实例演示了如何扩展类型和判断对象属性。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

当我们在使用 js 时往往要自己封装一些属性和方法到某对象中作为一个工具来优化我们的代码,同时我们也可以通过函数构造方法来工厂化某类对象,这就好比面向对象中的“类”

// 构造函数法 推荐 用着舒服 
// 你完全可以形象的认为这里的 function 声明就相当于 class,后期 new 这个 类名
function getPerson(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
    //对象方法
    this.getInfo = function(explode) {
        return this.name + explode + this.age + explode + this.sex;     
    }
}
// 还可以用原型去扩展 扩展的方法也会被对象实例继承
getPerson.property = {
    getName: function () {
        return this.name;
    },
    getAge: function () {
        return this.age;
    }
}

//==================================================================================

//工厂方法 函数式调用 返回一个对象 我不太喜欢
//毕竟其他OOP语言中取得对象实例都是 new
function getPerson(name, age, sex) {
    var obj = new Object();
    obj.name = name;
    obj.age = age;
    obj.sex = sex;
    //对象方法
    obj .getInfo = function(explode) {
        return this.name + explode + this.age + explode + this.sex;     
    }
    
    return obj;
}

上面的函数便可以作为一个函数对象构造器去生成一个对象,不过这里要注意,在我们调用时一定要 new 一下才会生成一个新的对象,如果像函数一样直接调用的话那可就差十万八千里了,因为以函数的方式调用时,函数中的 this 指向的其实是全局的顶层变量 window。

new构造函数

// new方法使用函数构造出一个新的对象 赋予对象的方法和属性
var xiaoMing = new getPerson('Xiao ming', 25, 'male');
console.log(xiaoMing);
console.log(xiaoMing.name);
console.log(xiaoMing.age);
console.log(xiaoMing.sex);
console.log(xiaoMing.getInfo('--'));

 

直接调用构造函数

直接调用时构造函数里的this则代表了当前的默认全局对象 window

var winObj = getPerson('window', '--', 'unkown');
console.log(winObj); //打印出来的肯定是window对象啦

是的,当你new构造函数(引用类型)时会产生一个新的对象实例,当你直接调用函数时里面的this默认为当前的window

 

下面在讲一讲 prototype 和 hasOwnProperty

反正我是混淆了很长时间,主要是平日里 js 的类(对象构造函数,准确的说叫做引用类型,Object Date Array String 这些并不是对象,而是类型,同面向对象中的类相似,严格称作 “引用类型”)和 对象 与 我们接触到的编程语言中的有些...我不主攻前端,所以说了什么不专业的还请各位不要见怪

这里我把 Date Array Math这些叫做引用类型(你调用时就是个构造函数 new Date()),new 出来的叫对象实例

property是针对类级的 

可以对现有的类进行方法扩展 实例化或自定义的对象是没有这一特性的

类的方法有

对象方法 : 在类的构造函数里用 this.Func = function() {} 实现的 会赋予对象

原型方法 : 在类外部使用 className.prototype.Func = function() {}实现的 会赋予对象 用于对现有类型的扩展

类方法: className.func = function() {} 实现的 不会赋予对象 只能本类访问 所以这货没办法用来做扩展,调用的话直接就是 className.func() 就可以了

//原型方法
getPerson.prototype.getName = function() {
    retrun this.name;
}

//类方法 直接调用即可
getPerson.getAge = function() {
    alert("对象无法继承,只能通过类访问")
}

var obj = new getPerson("sallency", 25, "male");
console.log(obj.getName());//sallency
console.log(obj.getAge());//error 类方法是不能被对象继承的

//判断某类有没有某原型方法 注意这里是用prototype去访问构造原型方法 切勿与类方法混淆
//判断某原型方法是否存在 即 new 时对象能获得到的方法
if (!getPerson.prototype.getSex) {
    getPerson.property.getSex= function() {
        return this.sex;
    }
}
  Prototype的具体用法:扩展类型
//扩展顶级类Object
if (!Object.prototype.getMsg) { 
    //或者 Object.prototype.getMsg == undefined
    //typeof Object.prototype.getMsg == 'undefined'
    Object.prototype.getMsg = function() {
        alert("this is my prototype method: getMsg!");
    }
}
/其他类都是从Object继承来的(原型链) 所以肯定也能访问到此原型
var arr = new Array();
arr.getMsg();

    注意区别 对象/原型方法 和 类方法

hasOwnProperty 则是对象来判断自身有无某属性或方法
var obj = new getPerson("sallency", 25, "male");

console.log(obj.hasOwnProperty('name')); //true
console.log(obj.hasOwnProperty('age')); //true
console.log(obj.hasOwnProperty('sex')); //true
console.log(obj.hasOwnProperty('getName')); //true

console.log(obj.hasOwnProperty('getAge')); //false 类方法无法被对象继承 只有对象和原型方法能被继承

好了,就说到这里吧

1、js 没有类,但是有引用类型,我们可以用引用类型来实现 OOP 一样的模式。

2、对象方法、原型方法都可以被引用类型的对象实例继承,但类方法只能用引用类型直接调用。

转载于:https://my.oschina.net/sallency/blog/552534

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值