程序员小周-优快云博客

原创基于NodeJs的在线聊天室

基于NodeJs的在线聊天室一、技术选型：前端需要的后端相关技能 NodeJs(express框架)、MongoDb(NoSql的使用学习)前端需要的前后端通讯知识实时通讯使用WebSocket(比如Socket.IO)前端需要的框架可以选型angularjs、react，如果需要移动端，可以考虑react native，当然也可以响应式开发二、功能总结基础功能访问网站主页，一个

2017-03-17 16:14:51 5073 5

原创 set、map、for-of和迭代器

set： https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Setmap: https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Mapfor-of和迭代器: http://w

2017-02-08 18:20:48 573

原创 default, rest

default很简单，意思就是默认值。大家可以看下面的例子，调用animal()方法时忘了传参数，传统的做法就是加上这一句type = type || ‘cat’来指定默认值。function animal(type){ type = type || 'cat' console.log(type)}animal()如果用ES6我们而已直接这么写：function animal

2017-02-08 16:58:42 485

原创 template string

这个东西也是非常有用，当我们要插入大段的html内容到文档中时，传统的写法非常麻烦，所以之前我们通常会引用一些模板工具库，比如mustache等等。大家可以先看下面一段代码：’$("#result").append( "There are <b>" + basket.count + "</b> " + "items in your basket, " + "<em>" + basket.

2017-02-08 16:48:52 345

原创 arrow function

这个恐怕是ES6最最常用的一个新特性了，用它来写function比原来的写法要简洁清晰很多:function(i){ return i + 1; } //ES5(i) => i + 1 //ES6简直是简单的不像话对吧… 如果方程比较复杂，则需要用{}把代码包起来：function(x, y) { x++; y--; return x + y;}(x, y) =>

2017-02-08 16:32:37 1455

原创 class、extends、super

这三个属性解决了es5中原型链、构造函数、继承的问题ES6提供了更接近传统语言的写法，引入了Class（类）这个概念。新的class写法让对象原型的写法更加清晰、更像面向对象编程的语法，也更加通俗易懂。class Animal { constructor(){ this.type = 'animal' } says(say){ console.l

2017-02-08 16:15:00 659

原创 var、let、const小解

var声明的是全局变量，let只作用在块级作用域内，const和let作用域相同但是一般只允许赋值一次。let 对比 varlet的作用域是块，而var的作用域是函数var a = 5;var b = 10;if (a === 5) { let a = 4; // The scope is inside the if-block var b = 1; // The scope is in

2017-02-08 15:18:19 411

原创 angular学习相关教程

来自焦广鑫学长： https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.mdhttp://teropa.info/blog/2015/10/18/refactoring-angular-apps-to-components.htmlhttps://angularcodereview.com/angularjs/

2017-01-23 15:42:41 402

原创前端学习系统化流程

主要就是mdn , jsweekly , sitepoint 这些，还有javascript高级程序设计，动物出版社（js从入门到放弃）的很多书

2017-01-22 16:21:09 382

原创一些经典算法的js实现方案

题目描述在一个二维数组中，每一行都按照从左到右递增的顺序排序，每一列都按照从上到下递增的顺序排序。请完成一个函数，输入这样的一个二维数组和一个整数，判断数组中是否含有该整数。function Find(target,array){ //代码实现 for(var i=0;i<array.length;i++){ for(var j=0;j<array[i].leng

2017-01-18 14:28:53 2481

原创整理的一些好的前端/全栈学习资源

7，了解node，npm基础知识。(服务器端的js) http://www.runoob.com/nodejs/nodejs-tutorial.html http://www.runoob.com/nodejs/nodejs-npm.html 8，学习react框架。(前端的框架有很多) https://github.com/kdchang/reactjs101react中可以使用的富文本编

2017-01-11 10:15:25 2602

column里面有data index和key，data index是为了和后端交互，必须要有的，key可以没有，可以用render : record{} 来代替 cms/ordermanage/orderlist里面可以看一下也就是说，我前端给columns里面的一个设置了dataindex:’test1’，后端API里面可能有提供的对应也有一个test1,那么这个值就可以对应起来了还有rend

2017-01-10 20:47:56 3111

原创 div里面的inline-block/inline内容两端对齐：

<div styleName=“div"> <div></div> <div></div> <div></div></div>.div{ text-align:justify div{ display:inline-block }}&nbsp是占位符，是必须的

2017-01-10 20:46:46 2214 1

原创 react中styleName和className的相关用法

简单来考虑，如果有个组件在component/Button/Button.js，然后Button.js里面引入 import styles from ‘./button.scss’ 如果Button.js里面构造component，如果没有case（也就是只有一种类型），那么给相关组件定义样式的时候可以用styleName=“x”，但是如果有case，比如上面定义几个 const btn1

2017-01-10 20:45:45 12940

原创查看网站所用的技术

查看网站使用的技术框架前端js框架、后端框架、服务器框架等：builtwith technology profiler （谷歌浏览器插件）

2017-01-10 20:42:07 2527

原创 css清除浮动

<div class="div"> <div class="div1"></div> <div class="div2"></div></div>如果.div1,.div2{ float:left}想清除浮动的话可以：.div{ @include clearfix()} 其中clearfix()是之前定义好的，可以清除浮动

2017-01-10 20:39:52 394

原创 select2插件实现列表的模糊搜索

select2插件基于bootstrap，可以实现列表的模糊搜索相关链接：http://www.cnblogs.com/wuhuacong/p/4761637.html

2017-01-10 20:35:48 5289

原创 js知识点整理

1、变量提升console.log(a);var a = 1;相当于var a;console.log(a)a=1;2、标识符第一个字符可以是任意 Unicode字母或者是美元符号($)或者是下划线(_)以后的字符还可以加上0-9的数字 3、Number和parseInt函数parseInt(’42 cats’) //42Number

2017-01-10 20:34:12 290

原创 git操作小解

1、git解决server占用问题：//获取占用server的idcat /usr/.../x.pid//杀掉这个进程，比如上面的id是1110kill -9 11102、git分支操作git branch - gb 查看本地分支git branch -r - gb -r 查看远程分支//创建一个分支，并切换到它且同步远程的分支:git checkout -b production -

2017-01-08 16:25:21 345

原创 slim学习小解

slim语法简单来说就是一种html模板，新的写法格式，可以配合后端ruby语言，一般适用于前后端交叉开发的环境下：doctype htmlhtml head title Slim Examples meta name="keywords" content="template language" meta name="author" content=author

2017-01-08 15:24:23 1609

原创正则表达式小结

1 . 校验密码强度密码的强度必须是包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间。^(?=.*\\d)(?=.*[a-z])(?=.*[A-Z]).{8,10})$2. 校验中文字符串仅能是中文。^[\\u4e00-\\u9fa5]{0,}$ 传送门：http://www.jianshu.com/p/e7bb9721894

2016-11-23 10:47:29 232

原创一个很好的浏览器兼容性测试网站

http://browsershots.org/不用在本地再下载N多浏览器，可以直接在线测试浏览器兼容性，强力推荐！

2016-11-22 20:55:34 2679

原创 JS基础知识整理

对代码行进行折行您可以在文本字符串中使用反斜杠对代码行进行换行。下面的例子会正确地显示：document.write("Hello \World!");不过，您不能像这样折行：document.write \("Hello World!");向未声明的 JavaScript 变量来分配值如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。这条语句：carname="Volvo";将

2016-08-27 20:16:50 542

原创 CSS基础知识整理

派生选择器派生选择器允许你根据文档的上下文关系来确定某个标签的样式。通过合理地使用派生选择器，我们可以使 HTML 代码变得更加整洁。比方说，你希望列表中的 strong 元素变为斜体字，而不是通常的粗体字，可以这样定义一个派生选择器：li strong { font-style: italic; font-weight: normal; }<p><strong>我是粗体字，不

2016-08-24 20:36:30 512

原创 HTML基础知识整理

空HTML元素的关闭：从< br >到< /br > HTML对标签大小写不敏感，但是一般推荐小写HTML属性：属性例子 1: < h1 align=”center”> 拥有关于对齐方式的附加信息。属性例子 2: < body bgcolor=”yellow”> 拥有关于背景颜色的附加信息。属性例子 3: < table border=”1”> 拥有关于表格边框的附加信息。始终为属性值加引

2016-08-24 13:34:25 933

原创行内（又称为内联）元素的margin、padding属性值问题

内联元素可以直接设置margin.padding么？可以设置，不过margin、padding对内联元素不起作用而已。也就是说，设了等于白设。这类元素一般是：a、span元素等。不过，内联元素有几个比较特别的：（特别之处是：有块状元素的特性，但是又不换行）像img、object这一类的内联元素（行内替换元素），是可以设置margin、padding的，不过这两个元素要显示的内容是外部引用的资

2016-08-23 14:44:01 3627

原创 JS判断一个对象是不是Array

typeof 操作符对于Function， String， Number ，Undefined 等几种类型的对象来说，他完全可以胜任，但是为Array时var arr=new Array("1","2","3","4","5");alert(typeof(arr));你会收到一个object 的答案，有点让人失望。instanceof 操作符JavaScript中instanceof运算符会返回

2016-08-22 19:28:21 386

原创 DOM操作节点

创建DOM元素 •createElement(标签名) 创建一个节点 •appendChild(节点) 追加一个节点例子：为ul插入li<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html

2016-08-22 14:53:32 301

转载 document的createDocumentFragment()方法

转载自： http://www.cnblogs.com/yunfour/archive/2011/06/21/2085911.html在《javascript高级程序设计》一书的6.3.5:创建和操作节点一节中，介绍了几种动态创建html节点的方法，其中有以下几种常见方法：· crateAttribute(name)：　　　　　　　用指定名称name创建特性节点· createComment(t

2016-08-22 10:42:32 256

原创有一个大数组,var a = ['1', '2', '3', ...];a的长度是100,内容填充随机整数的字符串.请先构造此数组a,然后设计一个算法将其内容去重

/** * 数组去重 **/ function normalize(arr) { if (arr && Array.isArray(arr)) { var i, len, map = {}; for (i = arr.length; i >= 0; --i) { if (arr[i

2016-08-21 17:36:25 2540

原创网页中实现一个计算当年还剩多少时间的倒数计时程序,要求网页上实时动态显示"××年还剩××天××时××分××秒"

<!doctype html><html><head> <meta charset="utf-8"> <title>TEst</title></head><body> <span id="target"></span><script type="text/javascript"> // 为了简化。每月默认30天 function getTimeStri

2016-08-21 16:40:33 3798

原创 JS正则表达式

修饰符： i 执行对大小写不敏感的匹配。 g 执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。 m 执行多行匹配。方括号方括号用于查找某个范围内的字符： [abc] 查找方括号之间的任何字符。 [^abc] 查找任何不在方括号之间的字符。 [0-9] 查找任何从 0 至 9 的数字。 [a-z] 查找任何从小写 a 到小写 z 的字

2016-08-21 15:40:30 345

原创 JS数组去重

三种方法： Array.prototype.unique1 = function(){ var arr = [];//临时数组 for(var i = 0;i < this.length;i++){ //如果当前数组的第i已经保存进了临时数组，那么跳过，

2016-08-21 10:44:17 330

原创一个好用的让DIV水平垂直居中的方法

div{ width : 300px; height : 300px; border : 1px solid red; position : absolute; top : 50%; left : 50%; margin-top : -150px; margin-left : -150px; }小解：将DIV的定位设置为abso

2016-08-20 17:43:42 371

原创 js对ul列表中的项进行删除

题目要求：有一个包含数据列表的页面，数据行数不确定。每一行数据都有一个删除按钮，单击删除按钮删除该列数据，请用JavaScript实现该功能。代码：<script type="text/javascript">window.onload = function(){ var oUl = document.getElementsByTagName('ul')[0]; oUl.oncl

2016-08-20 17:20:11 7689

原创 js的原型链

友情链接：http://www.cnblogs.com/TomXu/archive/2012/01/05/2305453.html

2016-08-09 16:27:58 211

原创数组中堆栈和引用类型的问题

1、栈（stack）和堆（heap）stack为自动分配的内存空间，它由系统自动释放；而heap则是动态分配的内存，大小不定也不会自动释放。2、基本类型和引用类型（1）基本类型：存放在栈内存中的简单数据段，数据大小确定，内存空间大小可以分配。5种基本数据类型有Undefined、Null、Boolean、Number 和 String，它们是直接按值存放的，所以可以直接访问。（2）引用类型：

2016-08-09 11:43:25 923

原创 js的预解析

（1）如果JavaScript仅是运行时自上往下逐句解析的，下面的代码能正确运行是可以理解的，因为我们先定义函数，然后才调用它。 function showMsg() { alert('This is message'); } showMsg(); // This is message （2）我们也知道函数可以定义在调用代码之后，如下代码也是能正常工作的。看起来调用showMsg()的时候s

2016-08-08 19:27:41 264

原创请用代码写出(今天是星期x)其中x表示当天是星期几,如果当天是星期一,输出应该是"今天是星期一"

var days = ['日','一','二','三','四','五','六'];var date = new Date();console.log('今天是星期' + days[date.getDay()]);

2016-08-08 17:35:26 3848

原创 JS实现继承

1.使用对象冒充实现继承(该种实现方式可以实现多继承) 实现原理:让父类的构造函数成为子类的方法,然后调用该子类的方法,通过this关键字给所有的属性和方法赋值function Parent(firstname) { this.fname=firstname; this.age=40; this.sayAge=function() {

2016-08-08 17:31:12 201

空空如也

空空如也