0%

JavaScript中的this依赖于函数的调用方式,因此把this称为调用上下文很合适。

先来一个最简单的例子

1
2
3
4
5
6
7
8
9
10
11
function ask(){
console.log(this.name)
}
var li_lei = {
name: "han mei mei",
ask: ask
}

`这两个方法分别输出什么`
li_lei.ask() => "li lei"
han_mei_mei.ask() => "han mei mei"

稍微复杂一点

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var li_lei = {
name: "li lei",
ask: function (){
console.log(this.name)
}
}

var han_mei_mei = {
name: "han_mei_mei",
ask: li_lei.ask
}

`这两个方法分别输出什么`
li_lei.ask() => "li lei"
han_mei_mei.ask() => "han mei mei"
Read more »

HTTPS

​ HTTP协议是没有加密的明文传输协议,如果APP采用HTTP传输数据,则会泄露传输内容,可能被中间人劫持,修改传输的内容。劫持了HTTP通信,往APP的通信中加入了自己的推广内容,还有一些低俗的推广广告,这很影响用户体验。一些别有用心的人通过搭建公共WiFi,进行流量劫持、嗅探,可以获得通过HTTP传输的敏感信息。为了保护用户的信息安全、保护自己的商业利益,减少攻击面,需要保障通信信道的安全,采用开发方便的HTTPS无疑是最优方案。
HTTPS:在http(超文本传输协议)基础上提出的一种安全的http协议,因此可以称为安全的超文本传输协议。http协议直接放置在TCP协议之上,而https提出在http和TCP中间加上一层加密层。从发送端看,这一层负责把http的内容加密后送到下层的TCP,从接收方看,这一层负责将TCP送来的数据解密还原成http的内容。

​ 其实HTTPS从最终的数据解析的角度,与HTTP没有任何的区别,HTTPS就是将HTTP协议数据包放到SSL/TSL层加密后,在TCP/IP层组成IP数据报去传输,以此保证传输数据的安全;而对于接收端,在SSL/TSL将接收的数据包解密之后,将数据传给HTTP协议层,就是普通的HTTP数据。HTTP和SSL/TSL都处于OSI模型的应用层。

Read more »

前言

用React Native开发有一段时间了,想写一下有关的资料以便自己查阅,一下内容均来自于网络,如有侵犯联系我删除。
是Facebook发布的,可以让广大开发者使用JavaScript和React开发应用,提倡组件化开发,也就是说React Native提供了一个个封装好的组件让开发者来进行使用,甚至可以相关嵌套形成新的组件。
使用React Native开发者可以维护多种平台(Web,Android和IOS)的同一份业务逻辑核心代码来创建原生应用。
现阶段Web APP的的体验还是无法达到Native APP的体验,所以这边fackbook更加强调的是“learn once, write everywhere”,应用前端我们使用js和React来开发不同平台的UI,下层核心模块编写复用的业务逻辑代码,提供应用开发效率。

React Native的设计理念:既拥有Native的用户体验、又保留React的开发效率

React Native背景

  • React 是由Facebook推出的一个JavaScript框架,主要用于前端开发。
  • React 采用组件化方式简化Web开发
    • DOM:每个HTML界面可以看做一个DOM
    • 原生的web开发方式,HTML一个文件,javaScript一个文件,文件分开,就会导致修改起来比较麻烦。
    • 可以把一组相关的HTML标签和JavaScript单独封装到一个组件类中,便于复用,方便开发。
  • React 可以高效的绘制界面
    • 原生的Web,刷新界面(DOM),需要把整个界面刷新.
    • React只会刷新部分界面,不会整个界面刷新。
    • 因为React独创了Virtual DOM机制。Virtual DOM是一个存在于内存中的JavaScript对象,它与DOM是一一对应的关系,当界面发送变化时,React会利用DOM Diff算法,把有变化的DOM进行刷新.
  • React是采用JSX语法,一种JS语法糖,方便快速开发。
Read more »

前言

Nginx是一个高性能的 HTTP 和 反向代理 服务器,也是一个 IMAP/POP3/SMTP 代理服务器。 Nginx 是由 Igor Sysoev 为俄罗斯访问量第二的 Rambler.ru 站点开发的,它已经在该站点运行超过两年半了。 Igor 将源代码以类 BSD 许可证的形式发布。尽管还是测试版,但是,Nginx 已经因为它的稳定性、丰富的功能集、示例配置文件和低系统资源的消耗而闻名了。

代理服务器

Nginx提供邮件代理服务,主要包含以下功能:

  • 支持使用外部HTTP认证服务器重定向用户到IMAP/POP3后端,并支持IMAP认证方式和POP3认证方式。
  • 支持使用HTTP认证服务器认证用户后重定向连接到内部SMTP后端,并支持SMTP认证方式。
  • 支持邮件代理服务下的安全套接层安全协议SSL。
  • 支持纯文本通信协议的扩展协议STARTTLS。

HTTP代理和反向代理

​ 代理服务和反向代理服务是Nginx服务器作为Web服务器的主要功能之一,尤其是反向代理服务,是应用十分广泛的功能。

​ 在提供反向代理服务方面,Nginx服务器转发前端请求性能稳定,并且后端转发与业务配置相互分离,配置相当灵活。在进行Nginx服务器配置的时候,配置后端转发请求完全不用关心网络环境如何,可以指定任意IP地址和端口号,或者其他类型的链接、请求等。

Read more »

前言

由于之前写了几个dva的项目,近期没怎么用有些遗忘了,写个小结记录一下。

dva是基于react、react-router、redux封装的一个轻框架。详细的介绍在 dva官网,这里仅仅摘录部分。项目托管在GitHub上,点击这里

特性

  • 易学易用:仅有 6 个 api,对 redux 用户尤其友好
  • elm 概念:通过 reducers, effectssubscriptions 组织 model
  • 支持 mobile 和 react-native:跨平台 (react-native 例子)
  • 支持 HMR:目前基于 babel-plugin-dva-hmr 支持 components、routes 和 models 的 HMR
  • 动态加载 Model 和路由:按需加载加快访问速度 (例子)
  • 插件机制:比如 dva-loading 可以自动处理 loading 状态,不用一遍遍地写 showLoading 和 hideLoading
  • 完善的语法分析库 dva-astdva-cli 基于此实现了智能创建 model, router 等
  • 支持 TypeScript:通过 d.ts (例子)
Read more »

对于手机app来说,近几年有以下几种开发模式

Native App Web App Cordova Weex React Native
优点 性能高 无需安装 界面复用性强 跨平台执行 跨平台执行
缺点 开发维护成本高 用户体验不好 性能差 开源较晚 学习曲线高
技术 oc、swift、java html、js html、js vue.js react.js

Native App

原生开发是系统自带的app开发方式,也是大部分人最熟悉app开发的技术,如android、ios、wp。是开发者采用最广泛的开发方式,优点十分显著。相比其他开发方式而言,原生开发可以访问设备中的所有功能,运行速度更快,性能更高,而且可以启用优秀的离线处理和存储能力等等,提供最佳的用户体验,最优质的用户界面,最华丽的交互。原生开发人员众多,开发环境成熟,有许多的开源库提供开发人员调用,可是方便实现各种设计效果。

Read more »

Dva项目兼容性

之前上线的Dva项目,在Chrome和Safari中表现良好,但是在有些浏览器打不开,比如IE、某些版本的FireFox。这是由于在项目中,网络请求模块用到了fetch请求,由于fetch的局限性,导致部分浏览器不兼容。现记录下适配到IE的过程,以供自己学习。

Fetch

之前发现IE浏览器打不开,通过查询得知是fetch的原因。由于一开始没有关注过fetch请求,以为是dva框架自带的请求框架,就没有深入的学习。查询一系列资料之后,将fetch的知识学习了一遍。
Fetch API 是基于 Promise 设计,在你理解了Promise之后,Fetch对于你来说并不困难,通过阅读文档很快就能学会。推荐推荐 MDN Fetch 教程 和 万能的WHATWG Fetch 规范。由于旧的浏览器并不支持Promise,所以导致了Fetch的局限性。

Read more »

前言

dva是在现有的应用架构进行了轻量级封装,相比于redux更易上手。如需了解更多请参考这里
项目中运用的技术架构是react+dva+antd,完成之后需要将应用部署到服务器上,需要一台服务器,仅以Nginx为例,记录整个的部署流程。

部署前准备

在完成你的dva项目之后,从coding或者你的git服务器上克隆项目到本地

1
2
3
$ git clone 你的dva项目
$ cd project
$ npm install

成功下载完所有配置文件之后执行,再次确认你的项目可以正确访问

1
$ npm start

即可自动打开浏览器的8000端口,成功运行该项目,如果没有自动弹出则访问localhost:8000/

Read more »

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

Quick Start

Create a new post

1
$ hexo new "My New Post"
Read more »