Object.observe上document.location

Question

我需要在页面变化的散列，我知道有很多方法可以知道什么时候喜欢使用jQuery

$(window).on('hashchange', function() { 
    // do something 
}); 

哈希值发生变化我试图执行一个js脚本使用Object.observe但它不起作用，我只是想知道为什么它没有，为什么在更新document.location对象后回调不起作用。

Object.observe(document.location, function(changes) { 
    console.log(changes); 
}); 

Answer 1

document.location与许多其他DOM对象一起陷入其中按规格没有表现得像普通本地JS对象主机对象的类别。尽管Object.observe可能适用于其中一些对象，但它不可靠并且不会为document.location工作。

又如它不工作是：

var el = document.createElement('div'); 
 
document.body.appendChild(el); 
 
Object.observe(el, function(change) { console.log('changed ', change[0].name); }) 
 

 
el.id = "hello"; 
 
el.foo = "bar";

Answer 2

我相信你无法使用Object.observe()是因为document.location返回Location Object类型的对象（这是特殊的只读接口），而不是“标准”的对象，观察document.location的原因。

从Mozilla的文档：

的Document.location只读属性返回Location对象。 Document对象的位置属性是指位置 对象。 Window.location是一个只读的Location对象。

位置接口： https://developer.mozilla.org/en-US/docs/Web/API/Location

实施例：

console.log(document.location.__proto__); // returns Location {} 
console.log(window.location.__proto__); // returns Location {} 
window.location === document.location // always true 

的Object.observe（）方法被用于观察的变化的一个对象。

例子：

var o = { name: ''}; 
Object.observe(o, function(changes){ 
    changes.forEach(function(change) { 
    console.log(change.type, change.name, change.oldValue); 
}); 
}); 
o.name = 'foo'; // name is being observed 

看，如果你测试对象是否在其原型链有一个构造函数，你可以得到的原型属性在他们的__proto__

console.log(document.location.__proto__); // returns Location {} 
console.log(window.location.__proto__); // returns Location {} 
console.log(o.__proto__);     // returns Object {} 

足够有趣的差异：代码示例：

var o = { 
 
    name: '' 
 
}; 
 
Object.observe(o, function(changes) { 
 
    changes.forEach(function(change) { 
 
    console.log(change.type, change.name, change.oldValue); 
 
    }); 
 
}); 
 

 
o.name = 'foo'; 
 

 

 
console.log(document.location.__proto__); // returns Location {} 
 
console.log(window.location.__proto__); // returns Location {} 
 
console.log(o.__proto__); // returns Object {} 
 

 

 
console.log(document.location instanceof Object); // true 
 
console.log(o instanceof Object); // true