RN精进笔记(一)入门篇

React-Native研究

安装教程
  1. 安装brew

          # brew 是一个Mac下快速安装插件的工具,类似Linux的yum\apt等命令行包安装工具。安装方式
    
          $ shell
          $ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
          $ 
          $
    
  2. 安装nvm

    brew install nvm
    

    nvm即node version manager,用来管理和支持Mac下多版本的node.js 。

    安装完后,根据终端提示,运行相关命令,即可配置相关环境变量,终端提示输入如下:

    You should create NVM's working directory if it doesn't exist:
    
    mkdir ~/.nvm
    
    Add the following to ~/.zshrc or your desired shell
    configuration file:
    
    export NVM_DIR=~/.nvm
    source $(brew --prefix nvm)/nvm.sh
    

    注意:source 方式可能找不到nvm.sh文件,或者在主目录先找不到shell的几个配置文件 .bashrc 或者 .zshrc 等,不能直接在终端输入这些指令,否则只能在这个进程中安装了。 最后我发现需要

    vim ~/.bashrc
    vim ~/.zshrc
    vim ~/.bashrc_profile
    

    在系统根目录下生成这三个文件,并配置好 source /nvm.h。

    $  mkdir ~/.nvm
    $  export NVM_DIR=~/.nvm
    $  source $(brew --prefix nvm)/nvm.sh , 如果提示找不到nvm.sh,而cd到brew 目录下发现有这个文件,可以直接这么导入
    $ source /usr/local/opt/nvm.sh 
    


  3. 安装最新的node

    如果用brew或者其它方式安装过node, 可以先删除node

    brew remove --force node 
    sudo rm -r /usr/local/lib/node_modules
    
    brew prune
    sudo rm -r /usr/local/include/node
    
    #检查brew是否正常
    brew doctor
    

    安装最新的node

    nvm install node 
    

    将该node设置为默认的nvm管理的node

    nvm alias default node 
    

    安装好node,其包管理工具npm, node package manager也安装好了,可以参考其包管理工具的命令。以下是npm常用指令:

    npm ls #查看当前目录下安装的包
    npm ls -g #查看全局安装的包
    npm install xxx #安装xxx包
    npm uninstall xxx
    npm info xxx 
    npm install xxx --save #安装xxx包,并将xxx依赖命令写入package.json
    npm update xxx
    
    #我的npm安装路径
    ~/.nvm/versions/node/v5.6.0/lib/node_modules/npm
    
    #nvm是用来管理node版本的工具,因此可以循该路径找到node
    #我的node执行的脚本bin
    /Users/schiller/.nvm/versions/node/v5.6.0/bin/node 
    
    #我们用react-native init myRNDemo来初始化RN项目,react-native命令的原理:
    $ cd ~/.nvm/versions/node/v5.6.0/lib/node_modules
    $ ls -a
    $ cd react-native-cli
    $ ls -a 
    .README.mdnode_modules
    ..index.jspackage.json
    
    $ vi package.json
    # package.json中有这么一段
    "bin": {  "react-native": "index.js"
    },
    $ vi index.js 
    
    if (args[0] === 'init') {
    if (args[1]) {
    init(args[1]);
    } else {
    }
    } else {
    ......
    }
    1、fs.writeFileSync(path.join(root, 'package.json'), JSON.stringify(packageJson));
    2、run('npm install --save react-native', function(e) {}
    #代码1是动态生成package.json,代码2是本地安装react-native模块。因此react native初始化项目困难,都是npm惹的祸
    

    经过上面对"react-native-cli"与“react-native”的分析,可以看出Facebook应该是推荐“react-native”模块局部化,所以不论在React Native项目初始化的过程中,还是clone已有的React Native项目,都需要在当前项目下下载和安装“react-native”模块,使得React Native 项目占用的空间越来越大。

    over

  4. 安装watchman

    brew install watchman
    

    watchman为react代码发生变化时,完成相关的重建工具,实现LiveReload功能。

  5. 安装flow

    brew install flow 
    

    flow为javasript类型检查器,实现静态类型检查

  6. 安装react-native

    $ npm install -g react-native-cli
    

    因为react-native 安装后需要在所有目录都可使用,因此需要全局安装-

  7. 安装nrm

    npm install -g nrm 
    nrm ls #查看有哪些可用的源地址
    nrm use taobao #使用淘宝源
    

    nrm为管理node包源地址的管理器,因为node包默认为从国外服务器获取,若不更换国内源,在安装时会非常慢

  8. ​搭建私有npm,提交创建项目的速度和减少缓存

起步,RN入门教程
  1. 创建项目

      $ react-native init MyReactNativeProject
      # 分析项目目录结构,node_modules为react-native依赖的相关源代码,package.json为rn依赖管理配置文件,resources为资源目录,如图片资源
      # 通过package.json文件发现其实每次创建的新项目的react-native和react都是最新的版本。     
    
  2. 启动

    jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
    
    jsCodeLocation = [NSURL URLWithString:@"http://192.168.1.116:8081/index.ios.bundle?platform=ios&dev=false"];
    
    jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
    

    原理:

    从jsCodeLocation的链接地址来看react-native是从本地端口拉取index.ios.js来执行。如果将index.ios.js的名字改为test.ios.js,然后Appdelegate.m中的index.ios.bundle改为test.ios.bundle 重新执行编译通过,验证假设。
    

    over.

  3. 项目协作与迁移

    项目协作,迁移到新的服务器必须执行nmp install重新更新项目的配置,否则会报错。

    over.

ECMASCRIPT语法
  1. Babel命令行转码工具

          > 通过npm安装,babel用于命令行转码,将es6转成es5
          >
          > ``` shell
          > $ npm install --global babel-cli
          > ```
          >
          > Babel基本语法如下
          >
          > ``` shell
          > # 转码结果输出到标准输出
          > $ babel example.js
          >
          > # 转码结果写入一个文件
          > # --out-file 或 -o 参数指定输出文件
          > $ babel example.js --out-file compiled.js
          > # 或者
          > $ babel example.js -o compiled.js
          >
          > # 整个目录转码
          > # --out-dir 或 -d 参数指定输出目录
          > $ babel src --out-dir lib
          > # 或者
          > $ babel src -d lib
          >
          > # -s 参数生成source map文件
          > $ babel src -d lib -s
          > ```
          > ​
    
  2. Styles

    用如下方式定义样式

    var styles = StyleSheet.create({
    base: {
    width: 38,
    height: 38,
    },
    background: {
    backgroundColor: '#222222'
    },
    active: {
    borderWidth: 2,
    borderColor: '#00ff00',
    },
    });
    

    Stylesheet.create构造器是可选的,使用样式

    <Text style={styles.base}>NICE</Text>
    <View sytle={[styles.base, styles.background]}></View>
    

    https://facebook.github.io/react-native/docs/style.html#content

    使用图片

    //from local
    <Image source={require('./myImage.png')}  style={width: 40, height: 40}/>
    //from network
    <Image source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} style={{width: 40, height: 40}}>
    
    
watchman take too long to load

这个错误facebook给出了官方的解决方法

$ brew uninstall watchman
$ brew install --HEAD watchman

over.

周末研究react总结
  1. 完成一个Demo工程
React -Demo的基本
  1. react-native各种控件的用法
ScrollView 、滑动视图
ListView、列表视图
Text 、label、自定义LabelView
TextInput 、输入框
Image 、图片、网络图片与本地图片
DataPickerIOS、日期栏
NavigatorIOS导航栏、导航页面数据传递
TouchableHighlight 按钮
ActivityIndicatorIOS 指示器
  1. react-native自定义类和使用自定义类
render 函数是用来渲染视图的函数
StylesSheet.create创建css
var object = React.createClass()创建react类
exports 输出 该类,给外部使用,
var DatePickerExample = require('./DatePickerExample');调用外部定义好的类
constructor为构造函数
componentDidMount() 生命周期函数
getInitialState() ES5生命周期
render()渲染仕途,类似 initwithframe ,addsubview
var WithLabel = React.createClass({})  创建新的类
<WithLabel label='Timezone:'>
</WithLabel> 使用自定义的类
module.exports = DatePickerExample;ES5输出该类
node.js的目录结构
  1. 细节总结

over.

下周任务
  • 如何在已有项目中集成react-native

  • 使用ES6语法来定义类、掌握ES6语法

  • 掌握css布局

  • 如何实现react和native页面的通讯

  • 掌握基本react UI控件

  • 熟悉和掌握node.js语法

  • over.

ES6语法之类
  1. 定义类
//定义类
class Point {
constructor(x, y) { //构造函数
this.x = x;
this.y = y;
}
toString() { //内部自定义函数
return '('+this.x+', '+this.y+')';
}
}
var point = new Point(2, 3); //定义类实例
point.toString() // (2, 3)
point.hasOwnProperty('x') // true
point.hasOwnProperty('y') // true
point.hasOwnProperty('toString') // false
point.__proto__.hasOwnProperty('toString') // true
  1. over
组件的生命周期

所有组件名首字母必须大写,如HelloReact,不能写成 helloReact

this.props对象的属性与组件的属性一一对应,但有一个例外,就是this.props.children,它表示组件的所有子节点。如果当前组件没有子节点,它就是undefined,如果有一个节点,它的类型是object,如果有多个节点,数据类型就是array。可以通过React.children来处理this.props.children

组件的属性可以接受任意值,字符串、对象、函数都可以。组件类的PropTypes属性,就是用来验证组件实例的属性是否符合要求。如下Demo:

var MyTitle = React.createClass({
propTypes: {
title: React.PropTypes.string.isRequired,
},
render: function() {
return <h1> {this.props.title} </h1>;
}
}); 
//该组件的title属性设置为string类型,而且是必须的。外部使用这个组件时对title赋值时必须是字符串。
//可以用getDefaultProps方法用来设置组件属性的默认值。

组件的生命周期分为三个状态:

Mouting: 已经插入真实的DOM
Updating: 正在被重新渲染
Unmounting: 已经移出真实DOM

React为每个状态都提供两种处理函数,will函数处理进入状态之前调用,did函数在进入状态之后调用,三种状态共计五种处理函数:

componentWillMount()
componentDidMount()
componentWillUpdate(Object nextProps, object nextState)
componetDidUpdate(Object prevProps, object prevState)
componetWillUnmount()

此外,React还提供两种特殊状态的处理函数:

componentWillReceiveProps(object nextProps): 已加载组件收到信的参数时调用
shouldComponentUpdate(object nextProps, object nextState):组件判断是否重新渲染时调用

对于组件获取真实的DOM节点。

组件并不是真实的DOM节点,而是存在于内存中国年的一种数据结构,叫做虚拟DOM(virtual DOM),只有当它插入文档以后,才会变成真实的DOM。根据React的设计,所有的DOM变动,都先在虚拟DOM上发生,然后再将实际发生的变动部分,反映在真实的DOM上,这种算法叫做 DOM diff,可以极大的提高网页的性能表现。、

this.state属性:

组件和用户互动,是React 一大创新,将组件看成一个状态机,一开始有一个初始状态,然后用户互动,导致状态发生变化,从而触发重新渲染UI:

class Index extends Component {
constructor(props) {
super(props);
this.state = { liked: false}
}
render() {
const aTexts = this.state.liked ? 'shit' : 'noshit'
return (
<View style={styles.container}>
<TouchableOpacity onPress={() => this.setState({liked: !this.state.liked})}>
<Text style={styles.titletext}>React Native: {aTexts}</Text>
</TouchableOpacity>
</View>
);
}
}
//上述代码中是一个组件,在constructor方法中定义好state对象,这个对象可以通过 this.state来属性读取。当用户点击组件时,导致状态发生变化,this.setState方法就修改状态值,每次修改以后,自动调用this.render方法再次渲染组件。
//this.props和this.state都用于描述组件的特性,可能会产生混淆。一个简单的区分方法是,this.props用来表示一旦定义,就不再发生变化的特性,而this.state是会随着用户互动而产生变化的特性。
//用一个函数_onPress()来定义点击事件发生错误。错误原因不明。

over.

react-native报错
  1. OnlyChild报错
报错:React Native: Fix for "Invariant Violation: onlyChild Must Be Passed a Children With Exactly One Child"
原因:某些组件必须有且仅有一个子组件,否则报错
return (
<TouchableHighlight>
</TouchableHighlight>
); // Error: onlyChild must be passed a children with exactly one child
return (
<TouchableHighlight>
<Text>foo</Text>
</TouchableHighlight>
); // OK
return (
<TouchableHighlight>
<Text>foo</Text>
<Text>bar</Text>
</TouchableHighlight>
); // Error: onlyChild must be passed a children with exactly one child
  1. over
node.js学习笔记
  1. node常用命令
$ node /user/helloworld.js
  1. node REPL(Read-eval-print loop)模式

  2. 创建HTTP服务器(前提是你已经安装好node)

var http = require('http');

http.createServer(function(request, response) {
response.writeHead(200, {'Content-Type': 'text/html'});
response.write('<h1>Node.js</h1>');
response.end('<p>Hello world</p>');
}).listen(3000);
console.log("HTPP server is listening at port 3000");
#运行这段代码,然后在浏览器中访问:http://127.0.0.1:3000
  1. supervisor解决调试问题
$ npm info supervisor
$ npm install supervisor
$ supervisor helloworld.js
  1. 异步 I/O事件式编程
1.阻塞与线程
2.同步I/O或阻塞式I/O
3.异步I/O或非阻塞式I/O
4.事件循环
#异步读取文件,异步I/O通过回调函数实现
var fs = require('fs');
fs.readFile('/Users/schiller/Desktop/file.txt', 'utf-8', function(error, data) {
  if(error) {
    console.log(error);
}else { 
console.log(data);
}
});
console.log('end');
#我们会发现先打印end 再打印file.txt的content
#同步读取文件,阻塞之后再读取
var fs = require('fs');
var data = fs.readFileSync('file.txt', 'utf-8'); 
console.log(data);
console.log('end.');
  1. express框架研究
$ npm install -g express 
$ /Users/gaolong/.nvm/versions/node/v5.7.0/lib
$ 仔细阅读Readme.md文档
$ npm install -g express-generator@4
$ express fisrtExpressDemo
$ cd firstExpressDemo && npm install  //install
dependencies
$ npm start //启动应用
$ 浏览器输入 'http://localhost:3000'
$ DEBUG=firstExpressDemo:* npm start //run the app 
#examples
$ git clone git://github.com/expressjs/express.git --depth 1
$ cd express
$ npm install
$ node examples/content-negotiation
  1. react-native学习计划
1.持续学习ES6,了解ES5
2.RN官方文档
3.node.js了解js服务器编程,了解RN调试
  1. JavaScript高级特性
1.作用域
var v1 = 'v1';
var f1 = function() {
console.log(v1); //v1
}

var v2 = "global";
var f2 =function() {
console.log(v2);//undefined,javascript会先搜索f2作用域
v2 = "scope";
}

var f = function() {
var scope = 'f0';
(function() {
var scope = 'f1';
(function() {
console.log(scope); //f1 ,这里取得的是其父作用域的值
})();             //函数作用域的嵌套关系是定义时决定的,不是调用时决定的
})();
};
f();

#全局作用域与全局对象
global对象、window对象、DOM对象 
2.闭包
var generateClosure = function() {
var count = 0;
var get = function() {
count++;
return count;
};
return get;
};

var counter = generateClosure();
console.log(counter()); //1
console.log(counter()); //2
console.log(counter()); //3
#当一个函数返回它内部定义的一个函数时,就产生一个闭包,闭包不但包括被返回的函数,还包括这个函数的定义环境。上例中couter和generateClosure()的局部变量就是一个闭包。
#闭包用作:嵌套的回调函数、实现私有成员
3.对象
var foo = {};
foo.pro_1 = 'bar';
foo.prop_2 = false;
foo.prop_3 = function() {
return 'Hello world';
};
foo['pro_4'] = '关联数组';
console.log(foo.prop_3);
console.log(foo.pro_4);
console.log(foo['pro_4']);
#使用关联数组创建、访问对象成员、使用对象初始化器创建对象
#构造函数创建对象
function User(name, uri) {
this.name = name;
this.uri = uri;
this.display = function() {
console.log(this.name);
console.log(this);
}
}
var someUser = new User('gaolong', 'http://gaolong.com');
console.log(someUser.name);
someUser.display();
#this指针是引用所属的对象
#call、aplly的功能是允许一个对象去调用另一个对象的成员函数!!!
#call 和apply的功能是一致的,区别在于call以参数表来接收被调用函数的参数,而apply以数组来接收被调用函数的参数。
#bind
var someGirl = {
name: 'beauty',
func: function() {
console.log(this.name);
}
};
var foo = {
name: 'ugly',
};
foo.func = someGirl.func;
foo.func(); //ugly

foo.func1 = someGirl.func.bind(someGirl);
foo.func1(); //beauty

func = someGirl.func.bind(foo);
func();//ugly
func2 = func;
func2(); //ugly
#原型
1.构造函数内定义的属性继承方式与原型不同,子对象需要显式调用父对象才能继承构 造函数内定义的属性。
2.构造函数内定义的任何属性,包括函数在内都会被重复创建,同一个构造函数产生的 两个对象不共享实例。
3.构造函数内定义的函数有运行时闭包的开销,因为构造函数内的局部变量对其中定义 的函数来说也是可见的。
function FooMe() {
var innerVar = 'hello tomorrow';
this.prop1 = 'gaolongxiaoxiao';
this.func1 = function () {
innerVar = '';
}
}
FooMe.prototype.prop2 = 'Carbo';
FooMe.prototype.func2 = function () {
console.log(this.prop2);
}
var foo1 = new FooMe();
var foo2 = new FooMe();
console.log(foo1.func1 == foo2.func1); //false
console.log(foo1.func2 == foo2.func2); //true
//除非必须用构造函数闭包,否则尽量用原型定义成员函数,因为这样可以减少开销
//尽量在构造函数内定义一般成员,尤其是对象数组,因为用原型定义的成员是多个实例共享的。
#原型链
特殊对象:Object 、 Function
Object.prototype是所有对象的祖先,Function.prototype是所有函数的原型,包括构造函数。
用户创建的对象:new 显式构造的对象
构造函数对象:普通的构造函数,即通过 new 调用生成普通对象的函数。
原型对象:特指构造函数 prototype 属性指向的对象
这三类对象中每一类都有一个 __proto__ 属 性,它指向该对象的原型,从任何对象沿着它开始遍历都可以追溯到 Object.prototype。
function FooYou() {

}
Object.prototype.name = 'My Object';
FooYou.prototype.name = 'Bar';
var obj = new Object();
var foo = new FooYou();
console.log(obj.name); //'My Object'
console.log(foo.name); // 'Bar'
console.log(foo.__proto__.name); // 'Bar'
console.log(foo.__proto__.__proto__.name); // 'My Object'
console.log(foo.__proto__.constructor.prototype.name); // 'Bar'

foo: __proto__ 
FooYou:__proto__.prototype
Foo.prototype:__proto__.constructor
Function: __proto__ & prototype
Function.prototype: __proto__ & constructor
obj: __proto__
Object: __proto__.protype 
Object.prototype: __proto__ & constructor

__proto__是实例为获取其类的原型而设置的一个属性!!!

在 JavaScript 中,继承是依靠一套叫做原型链(prototype chain)的机制实现的。属性 继承的本质就是一个对象可以访问到它的原型链上任何一个原型对象的属性。例如上例的foo 对象,它拥有 foo. __proto__ 和 foo. __proto__.__proto__ 所有属性的浅拷 贝(只复制基本数据类型,不复制对象)。所以可以直接访问foo.constructor(来自foo. __proto__,即Foo.prototype),foo.toString(来自foo. __proto__.__proto__, 即Object.prototype)。 

console.log(foo.__proto__); //FooYou { name: 'Bar'}
console.log(FooYou.prototype); //FooYou{ name: 'Bar'}
console.log(FooYou.prototype.__proto__); //{name: 'My Object'}
console.log(FooYou.prototype.__proto__.constructor); //[Function : Ojbect]
console.log(FooYou.prototype.__proto__.prototype); // null
console.log(FooYou.prototype.__proto__.__proto__); // undefined
console.log(foo.prototype); //undefined

#对象的复制
浅拷贝VS深拷贝
浅拷贝:共享对象属性
Object.prototype.clone = function() {
var newObj = {};
for (var i in this) {
newObj[i] = this[i];
}
return newObj;
}

var obj = {
name: 'gaolongxiaohua',
likes: ['node', 'OC']
};

var newObj = obj.clone();
obj.likes.push('python');
console.log(obj.likes); //[ 'node', 'OC', 'python' ]
console.log(newObj.likes); //[ 'node', 'OC', 'python' ]
深拷贝:递归实现、对象中可能有对象
Object.prototype.deepClone = function() {
var newOjb = {};
for (var i in this) {
if (typeof(this[i]) == 'object' || typeof(this[i]) == 'function') {
newObj[i] = this[i].deepClone();
}else {
newObj[i] = this[i];
}
}
return newObj;
}

Array.prototype.deepClone = function() {
var newArray = [];
for (var i=0; i < this.length; i++) {
if (typeof(this[i]) == 'object' || typeof(this[i]) == 'function') {
newArray[i] = this[i].deepClone();
}else {
newArray[i] = this[i];
}
}
return newArray;
}

Function.prototype.deepClone = function() {
var that = this;
var newFunc = function() {
return that.apply(this, arguments);
};
for (var i in this) {
newFunc[i] = this[i];
}
return newFunc;
};

var obj33 = {
name: 'xiaohua',
likes: ['hua', 'shit'],
display: function() {
console.log('chishi');
}
};

var newObj33 = obj.deepClone();
newObj33.likes.push('shishishihis');
console.log(obj33.likes); //['hua', 'shit']
console.log(newObj33.likes);// ['hua', 'shit','shishishihis']
#注意:这种实现方式对于循环引用无法生效,甚至出现循环递归
  1. 原型链

[图片上传失败...(image-39b111-1527822985817)]

  1. over
  2. over

RN组件、API

  1. PixelRatio

    static get() //返回设备的像素密度
    static getFontScale() //返回字体大小缩放比例
    static getPixelSizeForLayoutSize(layoutSize:number)//将一个布局尺寸转换成像素尺寸
    
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,458评论 4 363
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,454评论 1 294
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,171评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,062评论 0 207
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,440评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,661评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,906评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,609评论 0 200
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,379评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,600评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,085评论 1 261
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,409评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,072评论 3 237
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,088评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,860评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,704评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,608评论 2 270

推荐阅读更多精彩内容

  • JS中原型链,说简单也简单。 首先明确: 函数(Function)才有prototype属性,对象(除Object...
    前小白阅读 3,850评论 0 9
  • 相关知识点 数据类型、运算、对象、function、继承、闭包、作用域、原型链、事件、RegExp、JSON、Aj...
    sandisen阅读 11,336评论 7 175
  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 7,622评论 2 17
  • 原文:http://dmitrysoshnikov.com/ecmascript/javascript-the-c...
    jaysoul阅读 447评论 0 0
  • 凤庭春柳黄莺待,鹿韭琴轩枕月开。 日影横斜花更艳,瑶塘抱絮水如皑。 轻烟拢却江南梦,细雨催生井屋苔。 雀鸟幽窗啼别...
    幽小窗阅读 1,201评论 20 66