克隆函数实现中‘this’关键字的执行上下文
我正在研究一个创建所提供对象的副本的函数。除了涉及this关键字的那一行之外，我基本上了解正在发生的事情。我确实理解this关键字的原始设计是为了在类定义中指向一个对象的实例，如果我们回到从C++借用的this关键字的起源。但JavaScript决定使用this关键字来提供一个额外的功能，带有到执行上下文的链接。在下面的例子中，我试图理解为什么我们要使用this关键字。如果你有任何想法，我将不胜感激。
function clone(obj) {
const replace = {};
let idx = 0;
const undefCache = [];
const replacer = (key, value) => {
let result;
if (value === undefined) {
result = '__undefined__';
} else if (typeof value === 'symbol' || typeof value === 'function') {
const keyIdx = `__replaced__${idx}`;
idx += 1;
replace[keyIdx] = [this, key]; // I understand mostly what's happening except for the line
result = keyIdx;
} else {
result = value;
}
return result;
};
function reviver(key, value) {
let result;
if (value === '__undefined__') {
undefCache.push([this, key]);// I understand mostly what's happening except for the line
} else if (replace[value] !== undefined) {
result = replace[value][0][key];
} else {
result = value;
}
return result;
}
const json = JSON.stringify(obj, replacer);
console.log(json);
const newObject = JSON.parse(json, reviver);
undefCache.forEach(el => {
const [o, key] = el;
o[key] = undefined;
});
return newObject;
}
const source = {
a: 2,
b: '2',
c: false,
g: [
{ a: { j: undefined }, func: () => {} },
{ a: 2, b: '2', c: false, g: [{ a: { j: undefined }, func: () => {} }] }
]
};
const targetOne = clone(source);
console.log(targetOne);回答 1
Stack Overflow用户
发布于 2019-06-18 09:10:16
它用于在对特殊值进行JSON.parse/stringify的序列化/反序列化时处理嵌套对象。
在替换器/复活器函数中，this上下文是序列化器(stringify)或反序列化器(parse)正在处理的当前对象。
例如，对于下面的对象：
myObject = {
"foo": {
"bar": function () {}
},
"bar": "Different bar"
}当它处理项myObject["foo"]["bar"]时，替换器中的this将是对带有key = "bar"和value = function () {}"的myObject["foo"]的引用。这很有用，因为如果没有引用，我们就不知道是在处理myObject["bar"]还是myObject["foo"]["bar"]。
因此，当它被保存到数组中时，它实际上只是保存了pair = [myObject["foo"], "bar"]。稍后，当它恢复时，对于这些对中的每一个，它只需执行pair[0][pair[1]]即可恢复myObject["foo"]["bar"]。
这与reviver和undefined的工作原理类似。这里的问题是reviver不能返回undefined并将值设置为undefined，所以代码片段记住哪些键是这样的，并对对象的副本进行后处理以正确设置它们。
https://stackoverflow.com/questions/56640387
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号