填坑-十万个为什么?(8)

290 阅读3分钟

简介:很多概念不清或忘记,重新构建自己的知识体系。每天问自己1~多个问题。我是菜鸟 成为大神之路!

继续第7天的内容

1. 浏览器IndexedDB是什么? 🍬link

  • 可以使用 cookies 或 LocalStorage,但它们都是比较简单的技术,而 IndexedDB 提供了类似数据库风格的数据存储和使用方式。
  • IndexedDB 很适合存储大量数据,它的 API 是异步调用的。IndexedDB 使用索引存储数据,各种数据库操作放在事务中执行。IndexedDB 甚至还支持简单的数据类型。IndexedDB 比 localstorage 强大得多,但它的 API 也相对复杂。对于简单的数据,你应该继续使用 localstorage,但当你希望存储大量数据时,IndexedDB 会明显的更适合,IndexedDB 能提供你更为复杂的查询数据的方式。 更多的内容之后在做学习

2. CacheStorage 和 Service Worker(浏览器缓存)的认识? 🏀link

var wsCache = new WebStorageCache();

// 缓存字符串'wqteam' 到 'username' 中, 超时时间100秒
wsCache.set('username', 'wqteam', {exp : 100});

// 超时截止日期,可用使用Date类型
var nextYear = new Date();
nextYear.setFullYear(nextYear.getFullYear() + 1);
wsCache.set('username', 'wqteam', {exp : nextYear});

// 获取缓存中 'username' 的值
wsCache.get('username');

// 缓存简单js对象,默认使用序列化方法为JSON.stringify。可以通过初始化wsCache的时候配置serializer.serialize
wsCache.set('user', { name: 'Wu', organization: 'wqteam'});

// 读取缓存中的简单js对象 - 默认使用反序列化方法为JSON.parse。可以通过初始化wsCache的时候配置serializer.deserialize
var user = wsCache.get('user');
alert(user.name + ' belongs to ' + user.organization);

// 删除缓存中 'username'
wsCache.delete('username');

// 手工删除所有超时CacheItem,
wsCache.deleteAllExpires();

// 清除客户端中所有缓存
wsCache.clear();

// 为已存在的(未超时的)缓存值设置新的超时时间。
wsCache.touch('username', 1);

// 如果缓存中没有key为username2的缓存,则添加username2。反之什么都不做
wsCache.add('username2', 'wqteam', {exp : 1});

// 如果缓存中有key为username的缓存,则替换为新值。反之什么都不做
wsCache.replace('username', 'new wqteam', {exp : 1});

// 检查当前选择作为缓存的storage是否被用户浏览器支持。
//如果不支持调用WebStorageCache API提供的方法将什么都不做。
wsCache.isSupported();

3. Javascript的引用赋值与传值赋值?

①传值赋值

基本的数据类型有:undefined,boolean,number,string,null。 基本类型存放在栈区,访问是按值访问的,就是说你可以操作保存在变量中的实际的值。

var str = "12";
var str1 = "13";
str1 = str;
str1 = "24";

console.log(str + "++" + str1);//12++24
②引用赋值

引用类型指的是对象。可以拥有属性和方法,并且我们可以修改其属性和方法。引用对象存放的方式是:在栈中存放对象变量标示名称和该对象在堆中的存放地址,在堆中存放数据。
对象使用的是引用赋值。当我们把一个对象赋值给一个新的变量时,赋的其实是该对象的在堆中的地址,而不是堆中的数据。也就是两个对象指向的是同一个存储空间,无论哪个对象发生改变,其实都是改变的存储空间的内容,因此,两个对象是联动的。

var arr = [1,2,3];
var arr1 = arr;
console.log(arr);//[1, 2, 3]
console.log(arr1);//[1, 2, 3]
arr.pop();
console.log(arr);//[1, 2]
console.log(arr1);//[1, 2]
③参数传递

JavaScript的函数参数传递为值传递

'当传入的是 基本类型的参数时:就是复制了份内容给i而已,i与age之间没有关系。'
function setAge(i)
{
    console.log(i);//24
    i = 18;
    console.log(i);//18,i的改变不会影响外面的age
};

var age = 24;
setAge(age);
console.log(age);//24
'当传入的参数为引用类型时:'
function setName(obj)
{
    obj.name = 'haha';
};
 
var obj2 = new Object();
setName(obj2);
console.log(obj2.name);    //  haha

'这看起来很像是传递的是引用,因为obj.name受到改变了,但其实不是,其实还是值,因为obj2本身的值就是新对象的地址,所以传进去的就是这个地址。'
'阿里2014年的笔试题'
var a = 1;
var obj = {
    b: 2
};
var fn = function () {};
fn.c = 3;
function test(x, y, z) {
    x = 4;
    y.b = 5;
    z.c = 6;
    return z;
}
test(a, obj, fn);
console.log(a + obj.b + fn.c);

参考文章:
www.cnblogs.com/vincentvoid…
github.com/WQTeam/web-…
www.cnblogs.com/cench/p/601…