mixed对象转字符串（web前端）

关于这个问题，我最先是从cache开始的。在阅读echart以及react以及vue框架源码的时候，都发现它们使用相同的cache算法-lru。那么为什么要使用缓存呢？缓存给组件化开发带来哪些性能上的提升呢？

我相信学习前端的同学都对目前mvvm模式的前端框架甚是了解，其中的vdom以及组件化更是深入人心，它不仅可以大大提升开发人员开发速度、架构复杂的应用系统还能将视图渲染与数据操作解耦，从而

让开发人员专注业务逻辑处理。但也正是vdom以及组件化开发的引入，我们不得不利用缓存来做一些性能优化。

比如，vue中的computed就是利用缓存提高性能的一个例子，当然还有组件的缓存，提升加载速度。再者就是js与css混搭的情况下，如果处理不当，就会造成浏览器回流渲染的不利后果，比如交叉式读写dom

属性，获取offsetHeight等值以及新增或移除节点等。这些通常来说都是极少去改变的量，为此我们先将一组css缓存起来，再统一利用cssText改变，这样将成倍提高渲染速度。

这也是为何各大框架和mvvm库中都引入cache的原因。

那么为何要利用lru-cache呢？

我认为高效、简洁、易用是各大框架选择使用lru-cache的重要原因之一。

lru-cache通常由两部分数据结构所组成，其一是一个hashmap结构的索引，其二则是环形双链表。

操作思路也简单，就是将最近使用的cache节点尽量放在整个链表的最前面而将那些最近没怎么访问的cache节点放在链表后面，从而当达到缓存大小时，直接删除链表尾部的数据即可。

那么在此过程，我们需要计算所要缓存的hash值，根据hash值，利用hashMap可以快速实现节点的访问。

也正是在这个时候，我们需要将js中常用的对象转化为字符串，然后再计算相应懂的index值。至于lru整体算法不难，具体的大家可以自己去实现。

在此，我只将一般对象转化为字符串的函数贴上，如下：

const objectToString = function( obj ) {
	
	if( isString( obj ) ) {
		return obj;
	}
	
	if( isNumber( obj ) ) {
		return obj;
	}
	
	if( isFunction( obj ) ) {
		return obj.toString();
	}
	
	let t = null;
	
	if( isArray(obj) ) {
		t = [];
		for(let i = 0; i < obj.length; i++) {
			t[i] = objectToString( obj[i] );
		}
	}
	
	if( isPlainObject( obj ) ) {
		t = Object.create({});
		let keys = Object.keys( obj );
		for(let j = 0; j < keys.length; j++) {
			t[keys[j]] = objectToString(obj[keys[j]]);
		}
	}
	
	return JSON.stringify( t );
}