学习随笔

1. 图片处理
1.1Android高效加载大图、多图解决方案，有效避免程序OOM
出现历史：OOM
使用技术：
1）高效加载大图片（BitmapFactory）
2）图片缓存技术（LruCache）
学习网址
1.2硬盘缓存
出现历史：LruCache只是管理了内存中图片的存储与释放，如果图片从内存中被移除的话，那么又需要从网络上重新加载一次图片，这显然非常耗时。
使用技术：硬盘缓存（DiskLruCache）
学习网址
1.3NetworkImageView
出现历史： Android ListView异步加载图片乱序问题
使用技术：Volley当中提供的控件（NetworkImageView）
学习网址
学习网址
1.4整理图片处理框架

---

2接触到的框架

1. Dubbo
   Dubbo是Alibaba开源的分布式服务框架，它最大的特点是按照分层的方式来架构，使用这种方式可以使各个层之间解耦合（或者最大限度地松耦合）。从服务模型的角度来看，Dubbo采用的是一种非常简单的模型，要么是提供方提供服务，要么是消费方消费服务，所以基于这一点可以抽象出服务提供方（Provider）和服务消费方（Consumer）两个角色。关于注册中心、协议支持、服务监控等内容，详见后面描述。
2. Redis
   Redis是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库，并提供多种语言的API。从2010年3月15日起，Redis的开发工作由VMware主持。从2013年5月开始，Redis的开发由Pivotal赞助。
3. Mongodb
   MongoDB[1] 是一个基于分布式文件存储的数据库。由C++语言编写。旨在为WEB应用提供可扩展的高性能数据存储解决方案。
   MongoDB[2] 是一个介于关系数据库和非关系数据库之间的产品，是非关系数据库当中功能最丰富，最像关系数据库的。他支持的数据结构非常松散，是类似json的bson格式，因此可以存储比较复杂的数据类型。Mongo最大的特点是他支持的查询语言非常强大，其语法有点类似于面向对象的查询语言，几乎可以实现类似关系数据库单表查询的绝大部分功能，而且还支持对数据建立索引。[3]
4. Zookeeper
   ZooKeeper是一个分布式的，开放源码的分布式应用程序协调服务，是Google的Chubby一个开源的实现，是Hadoop和Hbase的重要组件。它是一个为分布式应用提供一致性服务的软件，提供的功能包括：配置维护、域名服务、分布式同步、组服务等。
   ZooKeeper的目标就是封装好复杂易出错的关键服务，将简单易用的接口和性能高效、功能稳定的系统提供给用户。
   ZooKeeper包含一个简单的原语集，[1] 提供Java和C的接口。
   ZooKeeper代码版本中，提供了分布式独享锁、选举、队列的接口，代码在zookeeper-3.4.3\src\recipes。其中分布锁和队列有Java和C两个版本，选举只有Java版本。（概述图片来源：[2] ）
5. 淘宝TFS
   TFS是淘宝针对海量非结构化数据存储设计的分布式系统，构筑在普通的Linux机器集群上，可为外部提供高可靠和高并发的存储访问。高可扩展、高可用、高性能、面向互联网服务
6. FastDFS
   FastDFS是一个开源的轻量级分布式文件系统，它对文件进行管理，功能包括：文件存储、文件同步、文件访问（文件上传、文件下载）等，解决了大容量存储和负载均衡的问题。特别适合以文件为载体的在线服务，如相册网站、视频网站等等。
7. protobuf
   是google 的一种数据交换的格式，它独立于语言，独立于平台。google 提供了多种语言的实现：java、c#、c++、go 和 python，每一种实现都包含了相应语言的编译器以及库文件。由于它是一种二进制的格式，比使用 xml 进行数据交换快许多。可以把它用于分布式应用之间的数据通信或者异构环境下的数据交换。作为一种效率和兼容性都很优秀的二进制数据传输格式，可以用于诸如网络传输、配置文件、数据存储等诸多领域。
8. websocket
   是HTML5一种新的协议。它实现了浏览器与服务器全双工通信(full-duplex)。一开始的握手需要借助HTTP请求完成。
   WebSocket protocol 。
   现很多网站为了实现即时通讯，所用的技术都是轮询(polling)。轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发出HTTP request，然后由服务器返回最新的数据给客户端的浏览器。这种传统的HTTP request 的模式带来很明显的缺点 – 浏览器需要不断的向服务器发出请求，然而HTTP request 的header是非常长的，里面包含的有用数据可能只是一个很小的值，这样会占用很多的带宽。
   而比较新的技术去做轮询的效果是Comet – 用了AJAX。但这种技术虽然可达到全双工通信，但依然需要发出请求。
   在 WebSocket API，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。在此WebSocket 协议中，为我们实现即时服务带来了两大好处：
9. Header
   互相沟通的Header是很小的-大概只有 2 Bytes
10. Server Push
    服务器的推送，服务器不再被动的接收到浏览器的request之后才返回数据，而是在有新数据时就主动推送给浏览器。
11. Netty
    Netty是由JBOSS提供的一个java开源框架。Netty提供异步的、事件驱动的网络应用程序框架和工具，用以快速开发高性能、高可靠性的网络服务器和客户端程序。
    也就是说，Netty 是一个基于NIO的客户、服务器端编程框架，使用Netty 可以确保你快速和简单的开发出一个网络应用，例如实现了某种协议的客户，服务端应用。Netty相当简化和流线化了网络应用的编程开发过程，例如，TCP和UDP的socket服务开发。
    “快速”和“简单”并不用产生维护性或性能上的问题。Netty 是一个吸收了多种协议的实现经验，这些协议包括FTP,SMTP,HTTP，各种二进制，文本协议，并经过相当精心设计的项目，最终，Netty 成功的找到了一种方式，在保证易于开发的同时还保证了其应用的性能，稳定性和伸缩性。

---

3. EventBus3.0使用
3.1 event
注册一个事件（根据自己需求而定），可视为一个普通类例如：

public class RecyclerEvent {
    private int type;

    public RecyclerEvent(int type){
        this.type = type;
    }

    public int getType(){
        return type;
    }
}

3.2 发布者
由发布者开始发布定义好的事件，例如：

EventBus.getDefault().post(new RecyclerEvent(0));

3.3 订阅者
1）订阅

EventBus.getDefault().register(this);

为防止重复订阅可加入判断

if(!EventBus.getDefault().isRegistered(this)){
	EventBus.getDefault().register(this);//注册EventBus
}

2）获得订阅信息（即回调）
3.0以前

public void onEvent(MessageEvent event) {
	log(event.message);
}

public void onEventMainThread(MessageEvent event) {
	textField.setText(event.message);
}

public void onEventBackgroundThread(MessageEvent event){
	saveToDisk(event.message);
}

3.0以后
函数名称不在固定，可以随便取。

@Subscribe(threadMode = ThreadMode.MainThread) //在ui线程执行
public void onUserEvent(UserEvent event) {
}

@Subscribe(threadMode = ThreadMode.BackgroundThread) //在后台线程执行
public void onUserEvent(UserEvent event) {
}

@Subscribe(threadMode = ThreadMode.Async) //强制在后台执行
public void onUserEvent(UserEvent event) {
}

@Subscribe(threadMode = ThreadMode.PostThread) //默认方式, 在发送线程执行
public void onUserEvent(UserEvent event) {
}

3）取消订阅

 EventBus.getDefault().unregister(this);//反注册

4. VUE + Element学习注意点
4.1 编写起步架构
快捷键：sc回车

<template>

</template>

<script>
export default {
  /**数据绑定 */
  data() {
    return {};
  },
  mounted() {},
  components: {},
  /**计算属性*/
  computed: {},
  /**方法 */
  methods: {},
  /**观察者 */
  watch: {}
};
</script>

<style>
</style>

Vue实例初始化的选项配置对象详解

1. Vue实例的的data对象

   介绍

Vue的实例的数据对象data 我们已经用了很多了，数据绑定离不开data里面的数据。也是Vue的核心属性。 它是Vue绑定数据到HTML标签的数据源泉，另外Vue框架会自动监视data里面的数据变化，自动更新数据到HTML标签上去。本质原理是：Vue会自动将data里面的数据进行递归抓换成getter和setter，然后就可以自动更新HTML标签了，当然用getter和setter所以老的浏览器Vue支持的不够好。

data对象的类型：
    类型是Object或者Function。
    如果是组件对象中，data必须是Function类型。【后面学了组件后就明白了，暂时对组件先放放。】

实例：

// 创建普通的Vue实例

var vm = new Vue({
  data: data
})

// 组件定义
// Vue.extend() 中 data 必须是函数

var Component = Vue.extend({
　　data: function () {
　　//这里必须是函数！！！
　　　　return { a: 1 }
　　}
})

2.Vue实例的computed

介绍

Vue的计算属性（computed)的属性会自动混入Vue的实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。这就很强大了，再计算属性中定义的函数里面可以直接使用指向了vue实例的this，异常方便的啊。

类型

{ 键：函数} { [key: string]: Function | { get: Function, set: Function } } 当然，可以省略setter,如果省略了setter，那么值就可以是普通函数，但是必须有返回值。

官方的实例

    var vm = new Vue({
    data: { a: 1 },
    computed: {
      // 仅读取，值只须为函数
      aDouble: function () {
        return this.a * 2
      },
      // 读取和设置
      aPlus: {
        get: function () {
          return this.a + 1
        },
        set: function (v) {
          this.a = v - 1
        }
      }
    }
    })
    vm.aPlus   // -> 2
    vm.aPlus = 3
    vm.a       // -> 2
    vm.aDouble // -> 4

3.methods

类型: { [key: string]: Function }

详细:

methods 将被混入到 Vue 实例中。可以直接通过 VM 实例访问这些方法，或者在指令表达式中使用。方法中的 this 自动绑定为 Vue 实例。

注意，不应该使用箭头函数来定义 method 函数 (例如 plus: () => this.a++)。理由是箭头函数绑定了父级作用域的上下文，所以 this 将不会按照期望指向 Vue 实例，this.a 将是 undefined。

示例:	

var vm = new Vue({
  data: { a: 1 },
  methods: {
    plus: function () {
      this.a++
    }
  }
})
vm.plus()
vm.a // 2

5.watch

类型

{ [key: string]: string | Function | Object }

详细:

一个对象，键是需要观察的表达式，值是对应回调函数。值也可以是方法名，或者包含选项的对象。Vue 实例将会在实例化时调用 $watch()，遍历 watch 对象的每一个属性。

示例:

var vm = new Vue({
  data: {
    a: 1,
    b: 2,
    c: 3
  },
  watch: {
    // 监控a变量变化的时候，自动执行此函数
    a: function (val, oldVal) {
      console.log('new: %s, old: %s', val, oldVal)
    },
    // 深度 watcher
    c: {
      handler: function (val, oldVal) { /* ... */ },
      deep: true
    }
  }
})
vm.a = 2 // -> new: 2, old: 1

//注意，不应该使用箭头函数来定义 watcher 函数 (例如 searchQuery: newValue => this.updateAutocomplete(newValue))。理由是箭头函数绑定了父级作用域的上下文，所以 this 将不会按照期望指向 Vue 实例，this.updateAutocomplete 将是 undefined。

参考综合案例：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Vue入门之数据监控</title>
  <script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<body>
  <div id="app">
    <p>{{ number }}</p>
    <input type="button" name="btnGetNumber" value="增加" v-on:click="getNumber()">
  </div>
  <script>
    var app = new Vue({        
      el: '#app',              
      data: {                  
        number: 1
      },
      methods: {
        // 事件响应方法的逻辑代码
        getNumber: function (e) {
          this.number += 1;   // 不管是内联方法调用，还是绑定事件处理器两种方式执行事件响应方法的时候 this都是指向 app
        }
      },
      watch: {
        // 监控number的变化，并自动执行下面的函数
        number: function (val, oldVal) {
          console.log('val:' + val + ' - oldVal: ' + oldVal);
        }
      }
    });
  </script>
</body>
</html>

6.设置el的详解

类型

string | HTMLElement

限制： 只在由 new 创建的实例中遵守。

详细：

提供一个在页面上已存在的 DOM 元素作为 Vue 实例的挂载目标,也就是说Vue绑定数据到哪里去找。可以是CSS 选择器，也可以是一个 HTMLElement实例。

在实例挂载之后(生命周期的内容后面会详细讲的奥)， 元素可以用 vm.$el 访问。

如果这个选项在实例化时有作用，实例将立即进入编译过程，否则，需要显式调用 vm.$mount() 手动开启编译。

// 几乎所有例子都用到这个，所以就不再赘述

var app = new Vue({        
  el: '#app',
  ...
});

4.2、转换例子
1）日期转换：this.$moment(/**将要转化的值*/).format("YYYY-MM-DD");
2）数组赋值：var myData = [...this.$refs.list.data];
3）对象复制：

var a = {name:'aaa'};
var b = {...a};`

4）精准复制：

var a = {name:'aaa'};
var b = Object.assign({} , a);

4.3、同步请求
需求：向后台发送多条请求返回结果处理后，在执行其它请求操作。

/* 设置联办件值  */
var that = this;
	this.setJOfficeAttr().then(function(){
		that.$post('infos-project', that.info, function (data) {
			var ids = data.map(function(d) {return d.id;}).join();
			location.replace('#userwork/apply33?infoIds=' + ids + '&projectId=' + that.projectId);
		}); 
	});
/* 设置联办件值 */
setJOfficeAttr : function(){
	this.promises = [];
	
	var attrs = this.info.infoAttrs;
	for(var i in attrs){
		var attr = attrs[i];
		if(attr.status == '10'){
			for(var j in attrs){
				var a = attrs[j];
				if(attr != a && attr.code == a.code){
					//设置纸质提交
					attr.saveStatus = a.saveStatus;
					//设置附件
					//attr.files = this.copeFiles(a.files);
					var that = this;
					if(a.files){
						var promise = new Promise(function (resolve, reject){
							var myAttr = attr;
							that.$post('files/copys' , a.files , function(data) {
								myAttr.files = data;
								resolve();
							});
						});
						
						this.promises.push(promise);
					}
				}
			}
		}
	}
	
	return Promise.all(this.promises);
},

注意then和promise的使用