未能正确利用原型继承(js的问题)

考虑下面代码:

html 复制代码
BaseObject = function(name) {
    if (typeof name !== "undefined") {
        this.name = name;
    } else {
        this.name = 'default'
    }
};

上面代码比较简单,就是提供了一个名字,就使用它,否则返回 default:

html 复制代码
var firstObj = new BaseObject();
var secondObj = new BaseObject('unique');

console.log(firstObj.name);  // -> 'default'
console.log(secondObj.name); // -> 'unique'

但是,如果这么做呢:

html 复制代码
delete secondObj.name;

会得到:

html 复制代码
console.log(secondObj.name); // 'undefined'

当使用 delete 删除该属性时,就会返回一个 undefined,那么如果我们也想返回 default 要怎么做呢?利用原型继承,如下所示:

html 复制代码
BaseObject = function (name) {
    if(typeof name !== "undefined") {
        this.name = name;
    }
};

BaseObject.prototype.name = 'default';

BaseObject 从它的原型对象中继承了name 属性,值为 default。因此,如果构造函数在没有 name 的情况下被调用,name 将默认为 default。同样,如果 name 属性从BaseObject的一个实例中被移除,那么会找到原型链的 name,,其值仍然是default。所以'

html 复制代码
var thirdObj = new BaseObject('unique');
console.log(thirdObj.name);  // -> Results in 'unique'

delete thirdObj.name;
console.log(thirdObj.name);  // -> Results in 'default'

作者:王大冶

链接:https://juejin.cn/post/7161959592967012366

相关推荐
艾莉丝努力练剑8 小时前
【Qt:问题解决】Qt程序入口点错误修复:MinGW ABI兼容问题
java·服务器·开发语言·qt·文件系统·动静态库
Sterting8 小时前
Element-Plus 入门与整体布局
前端·vue.js·elementui
程序员黑豆15 小时前
Java 注释详解:单行、多行与文档注释的完整指南
java·前端·ai编程
剪刀石头布啊15 小时前
antd中可编辑表格中巧用useWatch实现联动高性能效果,以及定制延伸学习
前端
油丶酸萝卜别吃16 小时前
前端转全栈学习路线
前端·学习
浮生望16 小时前
前端路由进阶:History API原理与手写HistoryRouter
前端
wuyk55516 小时前
第2章:六步换相原理全解+STM32工程实战
c语言·开发语言·stm32·单片机·嵌入式硬件
hey_sml16 小时前
JAVA每日一学---CompletableFuture中thenApply与thenCompose区别详解
java·开发语言
陆枫Larry16 小时前
JavaScript 中的竞态是什么,为啥会有竟态?
前端
萧瑟余晖18 小时前
Java深入解析篇十七之SpringCloud
java·开发语言