《浏览器兼容》1. vue 项目中为 Object 对象添加原型方法

最新推荐文章于 2022-12-06 09:49:12 发布

不倒翁丶

最新推荐文章于 2022-12-06 09:49:12 发布

阅读量594

点赞数

分类专栏：前端文章标签： js javascript

本文链接：https://blog.csdn.net/weixin_46059971/article/details/124410281

版权

前端专栏收录该内容

14 篇文章 0 订阅

订阅专栏

浏览器兼容

疑问：在低版本浏览器中，如何实现 Object 属性方法的添加；

第一章 Vue 项目中为 Object 添加 values()、keys() 原型方法

前言

本章用于实现，在低版本浏览器中，如何实现新版浏览器的 Object.values()、Object.keys() 方法。

一、prototpye.js

1. coding

代码如下（示例）：

// Object setPrototypeOf extends;
;!(function () {
	
	Object.prototype.values = Object.prototype.values || function(obj){
		var l =[];
		for(var k in obj){
			l.push(obj[k])
		};
		return l;
	};

	Object.prototype.keys = Object.prototype.keys || function(obj){
		var l =[];
		for(var k in obj){
			l.push(k)
		};
		return l;
	};
	// 防止 vue-router 中使用 asign 对 Object.prototype 操作时，导致导航栏错误;
	Object.defineProperty(Object.prototype, 'values', { "enumerable": false });
	Object.defineProperty(Object.prototype, 'keys', { "enumerable": false });
})();

二、使用步骤

1. 引入 prototype.js

代码如下（示例）：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  <title>为 Object.prototype 添加属性 Demo </title>
  
  <script src="./prototype.js"></script>
</head>

<body>
<script>
	// 建议在 chrome50 版本下测试，最新浏览器版本已兼容;
  	console.log(Object.values);
</script>
</body>
</html>