http://www.ruanyifeng.com/blog/2016/11/javascript.html https://github.com/ruanyf/jstraining 我现在的技术方向,前端是 React,后端是 Node,时间都投入在这两方面. 最近有一种感觉,我可以融汇贯通了,使用 JavaScript 全栈解决各种问题. 最初,我只是想整理一份技术清单,理清思路.但是内容越写越多,索性就做成一个教程,放在 Github 上面.这份教程一共四章,可以在两天内学完,适合那些已掌

阮一峰老师的github地址:React Demos React 入门实例教程 2.ReactDOM.render() // ReactDOM.render() 将模板转化为 HTML 语言 // 参数一:被渲染的标签 // 参数二:被插入的父元素 ReactDOM.render( <h1>Hello, world!</h1>, document.getElementById('example') ); 3.JSX 语法 import React, { Component } fr

在看到阮大神的-标准库-Object对象时 有个 类型判断类型 方法可能以后会用到.特此记录一下 4.3:toString()的应用:判断数据类型 Object.prototype.toString方法返回对象的类型字符串,因此可以用来判断一个值的类型. var o = {}; o.toString() // "[object Object]" 上面代码调用空对象的toString方法,结果返回一个字符串object Object,其中第二个Object表示该值的构造函数.这是一个十分

2013.05.11:如何做到 jQuery-free?(29条评论) 2013.01.23:JavaScript Source Map 详解(14条评论) 2013.01.14:Javascript 严格模式详解(26条评论) 2012.12.21:Javascript异步编程的4种方法(28条评论) 2012.11.07:Javascript模块化编程(三):require.js的用法(19条评论) 2012.10.30:Javascript模块化编程(二):AMD规范(19条评论) 201

<Javascript高级程序设计(第二版)>(Professional JavaScript for Web Developers, 2nd Edition) 它们都是非常优秀的Javascript读物,推荐阅读. 笔记分成三部分.今天的第一部分是讨论"封装"(Encapsulation),后面的第二部分和第三部分讨论"继承"(Inheritance). ============================ Javascript 面向对象编程(一)

声明:转载自阮一峰的网络日志 随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂. 网页越来越像桌面程序,需要一个团队分工协作.进度管理.单元测试等等......开发者不得不使用软件工程的方法,管理网页的业务逻辑. Javascript模块化编程,已经成为一个迫切的需求.理想情况下,开发者只需要实现核心的业务逻辑,其他都可以加载别人已经写好的模块. 但是,Javascript不是一种模块化编程语言,它不支持"类"(class

-  转自阮一峰老师博客 React 入门实例教程   作者: 阮一峰 日期: 2015年3月31日 现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站.做出来以后,发现这套东西很好用,就在2013年5月

jQuery是目前使用最广泛的javascript函数库. 据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库.微软公司甚至把jQuery作为他们的官方库. 对于网页开发者来说,学会jQuery是必要的.因为它让你了解业界最通用的技术,为将来学习更高级的库打下基础,并且确实可以很轻松地做出许多复杂的效果. 虽然jQuery上手简单,比其他库容易学会,但是要全面掌握,却不轻松.因为它涉及到网页开发的方方面面,提供的各种方法和内部变化有上千种之多.初学者常常感到,入门很方便

测试框架 Mocha 实例教程   作者: 阮一峰 日期: 2015年12月 3日 Mocha(发音"摩卡")诞生于2011年,是现在最流行的JavaScript测试框架之一,在浏览器和Node环境都可以使用. 所谓"测试框架",就是运行测试的工具.通过它,可以为JavaScript应用添加测试,从而保证代码的质量. 本文全面介绍如何使用Mocha,让你轻松上手.如果你以前对测试一无所知,本文也可以当作JavaScript单元测试入门.值得说明的是,除了Mocha以

作者: 阮一峰 日期: 2010年2月11日 一.问题的由来 URL就是网址,只要上网,就一定会用到. 一般来说,URL只能使用英文字母.阿拉伯数字和某些标点符号,不能使用其他文字和符号.比如,世界上有英文字母的网址 “http://www.abc.com”,但是没有希腊字母的网址“http://www.aβγ.com”(读作阿尔法-贝塔-伽玛.com).这是 因为网络标准RFC 1738做了硬性规定: "...Only alphanumerics [0-9a-zA-Z], the specia

声明:转载自阮一峰的网络日志 这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战. 我采用的是一个非常流行的库require.js. 一.为什么要用require.js? 最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了.后来,代码越来越多,一个文件不够了,必须分成多个文件,依次加载.下面的网页代码,相信很多人都见过. <script src="1.js"></script>

声明:转载自阮一峰的网络日志 这个系列的第一部分介绍了Javascript模块的基本写法,今天介绍如何规范地使用模块. (接上文) 七.模块的规范 先想一想,为什么模块很重要? 因为有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块. 但是,这样做有一个前提,那就是大家必须以同样的方式编写模块,否则你有你的写法,我有我的写法,岂不是乱了套!考虑到Javascript模块现在还没有官方规范,这一点就更重要了. 目前,通行的Javascript模块规范共有两种:CommonJS

摘自http://www.ruanyifeng.com/blog/2015/02/make.html Make 命令教程 作者: 阮一峰 日期: 2015年2月20日 代码变成可执行文件,叫做编译(compile):先编译这个,还是先编译那个(即编译的安排),叫做构建(build). Make是最常用的构建工具,诞生于1977年,主要用于C语言的项目.但是实际上 ,任何只要某个文件有变化,就要重新构建的项目,都可以用Make构建. 本文介绍Make命令的用法,从简单的讲起,不需要任何基础,只要会

<javascript语言精粹>是一本很棒的书籍,其中作者在附录列出了12种他所认为的javascript语言中的糟粕. 我最近开始跟读前端前辈的博客,其中读到了阮一峰的<12种不宜使用的Javascript语法>,有一个疑问: 文如下: 9. function语句 在Javascript中定义一个函数,有两种写法: function foo() { } 和 var foo = function () { } 两种写法完全等价.但是在解析的时候,前一种写法会被解析器自动提升到代码的

Javascript的this用法   作者: 阮一峰 日期: 2010年4月30日 this是Javascript语言的一个关键字. 它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用.比如, function test(){ this.x = 1; } 随着函数使用场合的不同,this的值会发生变化.但是有一个总的原则,那就是this指的是,调用函数的那个对象. 下面分四种情况,详细讨论this的用法. 情况一:纯粹的函数调用 这是函数的最通常用法,属于全局性调用,因此this就代

看完阮一峰的React教程后,就自己做了这个TodoList,自己慢慢琢磨效率差了点但是作为入门小练习还是不错的. 以下是效果图:我的源码:todolistUI:bootstrap 4 一.组件化 我在这里主要分了上下两部分,上部分是列表展示,下部分是添加待办,先在src目录下创建一个component文件夹用来存放组件,文件夹中可以先创建两个组件文件list.js和addItem.js. 二.初始数据 先假设目前已经添加了部分了部分待办事项,所以我在根组件的state中模拟了一些数据: lis

原文链接-阮一峰博客 1. == Javascript有两组相等运算符,一组是==和!=,另一组是===和!==.前者只比较值的相等,后者除了值以外,还比较类型是否相同. 请尽量不要使用前一组,永远只使用===和!==.因为==默认会进行类型转换,规则十分难记. 如果你不相信的话,请回答下面五个判断式的值是true还是false: false == 'false' false == undefined false == null null == undefined 0 == '' 前三个是fal

SSH 教程 --阮一峰 文章出处 SSH 基本知识 SSH(Secure Shell 的缩写)是一种网络协议,用于加密两台计算机之间的通信,并且支持各种身份验证机制.实务中,它主要用于保证远程登录和远程通信的安全,任何网络服务都可以用这个协议来加密. SSH 是什么 历史上,网络主机之间的通信是不加密的,属于明文通信.这使得通信很不安全,一个典型的例子就是服务器登录.登录远程服务器的时候,需要将用户输入的密码传给服务器,如果这个过程是明文通信,就意味着传递过程中,线路经过的中间计算机都能看到密

作者: 阮一峰 https://github.com/ruanyf/react-demos 转自:http://www.ruanyifeng.com/blog/2015/03/react.html 对着文章的说明,看明白了,再跑下demo ....

作者:阮一峰(转自阮一峰的网络日志,如有侵权,立即删除) 网页布局(layout)是 CSS 的一个重点应用. 布局的传统解决方案,基于盒状模型,依赖 display 属性 + position属性 + float属性.它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现. 2009年,W3C 提出了一种新的方案----Flex 布局,可以简便.完整.响应式地实现各种页面布局.目前,它已经得到了所有浏览器的支持,这意味着,现在就能很安全地使用这项功能. Flex 布局将成为未来布局的首选方案

首先上交阮一峰老师的github地址,一共有15个demo,我们一个一个的进行分析,结合上文所学的知识! 其中有一些内容,我做了修改,我是先看一遍然后从新敲了一遍. https://github.com/ruanyf/webpack-demos 准备工作 首先还是安装,不过这一次,我们进行全局安装. $ npm i -g webpack webpack-dev-server webpack-cli 克隆仓库地址 git clone https://github.com/ruanyf/webpac