Reducer

Where there is a will, there is a way.


  • 首页

  • 分类

  • 归档

  • 标签

JavaScript中的面向对象

发表于 2016-03-10 | 分类于 前端基本功

对象的定义

无序属性的集合,其属性可以包含基本值、对象或函数。可以将对象想象成散列表,即一组名值对,值可以是数据或是函数

属性设置

采用Object.defineProperty() 方法直接在一个对象上定义一个新属性,或者修改一个已经存在的属性,并返回这个对象。

Object.defineProperty(obj, prop, descriptor)

  • obj 需要定义属性的对象。
  • prop 需被定义或修改的属性名。
  • descriptor 需被定义或修改的属性的描述符。

属性主要分为两种: 数据属性和访问器属性

configurable: 当且仅当该属性的configurable为true时,该属性才能够被改变,也能够被删除,默认为false。

enumerable: 当且仅当该属性的enumerable为true时,该属性才能够出现在对象的枚举属性中,默认为false。

value: 该属性对应的值。可以是任何有效的JavaScript值(数值,对象,函数等),默认为undefined。

writable: 当且仅当该属性的writable为true时,该属性才能被赋值运算符改变,默认为false。

阅读全文 »

this到底指向啥

发表于 2016-03-03 | 分类于 前端基本功

this总是让人感到有些费解,在阅读一些代码时时不时就冒出来让人丈二和尚摸不着头脑。由于受到一些其他语言的影响,比如Java类中的this是引用自身的指针,曾让我一度认为一切皆对象的JavaScript中函数的this也指向函数本身,这是完全错误的!一个很简单的测试:

1
2
3
4
5
6
function test() {
console.log(this); // 输出 window 对象, 'use strict'模式下是undefined
this.x = 2;
}
test();
console.log(window.x); // 2, 'use strict'模式下TypeError

我们可以很明显地看到this指向的是全局window对象,而不是函数自己。实际上,this是在运行时进行绑定的,并不是在编写时绑定的,它的上下文取决于函数调用时的各种条件。this的绑定与函数声明的位置没有任何关系,只取决于函数的调用方式。

阅读全文 »

[译]构建基于Flux的TodoList

发表于 2016-03-02 | 分类于 React全家桶

原文地址: https://facebook.github.io/flux/docs/todo-list.html

让我们用一个经典的TodoMVC的应用的简单代码来展示一下Flux的结构体系。虽然完整的项目案例你可以在Github中下载得到,但是还是让我们一步步来完成开发。

阅读全文 »

The Event Of JavaScript

发表于 2016-02-26 | 分类于 前端基本功

当我们打开网页时,我们会触发各种各样的事件,比如加载页面完成就会触发onload事件,点击某个元素就会触发其click事件。那么我们应该如何为我们的DOM元素绑定事件?一般操作事件会有三种方式:

HTML事件处理程序 - 直接HTML内联属性(不建议这么做)

1
2
3
4
<!--
这种方式使代码耦合,将javascript代码直接嵌入到了html中,不利于后期的代码维护,也不利于书写较长代码。
-->
<button onclick="alert('你点击了按钮');">点击按钮</button>
阅读全文 »

唠一唠React的组件测试

发表于 2016-02-14 | 分类于 React全家桶

刚做完前学僧的401-react-clickable-grid,项目本身并不难,但全部实现后的测试却让我有些犯难,newraina做的也并没有携带测试。好不容易参照网上的一篇博文与相应测试工具的文档完成简单的单元测试后,我无意中发现阮一峰老师在他的github上发布的react-testing-demo,刚好可以参照一下大牛的demo,阮老师写的React TodoList也是不错的学习样例哟。我同时结合网上的一些资料,对react的组件测试做一个小小的总结,当然极大部分参照了阮老师的英文README.md哒。

首先,React最重要的测试工具就是official Test Utilities,官方测试工具集,不过它只提供了较为低级的API。因此,出现了很多第三方的测试类库,不过他们大多基于官方测试集开发。测试库Enzyme是众多同类测试库中较为容易掌握的。

阅读全文 »

[译]React on ES6+

发表于 2016-02-09 | 分类于 React全家桶

原文地址: http://babeljs.io/blog/2015/06/07/react-on-es6-plus

这是一篇来自Steven Luscher的特邀文章,Steven在Facebook从事于Relay的开发,一个javascript框架使用React与GraphQL用来构建应用。在Instagram,GitHub和Twitter关注Steven。

当我们今年重构Instagram Web时,更加热衷于使用一些ES6+的新特性来构建React组件。请允许我强调一些新特性来改变你构建React应用的方法,让它变得更加简单与有趣。

阅读全文 »
1…345
淡苍

淡苍

在寻找大神的路上让自己成为大神

29 日志
10 分类
19 标签
RSS
GitHub 微博 知乎
© 2015 - 2017 淡苍
由 Hexo 强力驱动
主题 - NexT.Pisces