首頁

如何讀懂并寫出裝逼的函數(shù)式代碼

藍(lán)藍(lán)設(shè)計(jì)的小編

今天在微博上看到了 有人分享了下面的這段函數(shù)式代碼,我把代碼貼到下面,不過我對原來的代碼略有改動(dòng),對于函數(shù)式的版本,咋一看,的確令人非常費(fèi)解,仔細(xì)看一下,你可能就暈掉了,似乎完全就是天書,看上去非常裝逼,哈哈。不過,我感覺解析那段函數(shù)式的代碼可能會(huì)一個(gè)比較有趣過程,而且,我以前寫過一篇《函數(shù)式編程》的入門式的文章,正好可以用這個(gè)例子,再升華一下原來的那篇文章,順便可以向大家更好的介紹很多基礎(chǔ)知識,所以寫下這篇文章。

先看代碼

這個(gè)代碼平淡無奇,就是從一個(gè)數(shù)組中找到一個(gè)數(shù),O(n)的算法,找不到就返回 null。

下面是正常的 old-school 的方式。不用多說。

//正常的版本 function find (x, y) { for ( let i = 0; i < x.length; i++ ) { if ( x[i] == y ) return i;
  } return null;
} let arr = [0,1,2,3,4,5] console.log(find(arr, 2)) console.log(find(arr, 8))

其中之一和其中唯一(討論個(gè)人風(fēng)格,追求你的唯一?。?/a>

藍(lán)藍(lán)設(shè)計(jì)的小編

86ed0befte04726e9b8e9&690.jpg


通常

我們都會(huì)問或被問到以及自己問自己:“什么是好的設(shè)計(jì)”,這是一個(gè)沒有一定答案的問題,雖沒有答案但是可以一直問的問題,換個(gè)角度“好的設(shè)計(jì)或者你喜歡的設(shè)計(jì)有怎樣的特點(diǎn)”,這篇文章講的是“其中之一和其中唯一”,那么好的設(shè)計(jì)就有“其中唯一”這個(gè)特點(diǎn)。

上面是一張示意圖,簡單的比較“其中之一”和“其中唯一”,非常淺顯的含義,但我們目的并不是找到答案,而是尋找的過程,因?yàn)橥ǔ4鸢钢皇菍βL過程的一個(gè)敷衍,本身并沒有多大的價(jià)值。


HTML5手勢檢測原理和實(shí)現(xiàn)

藍(lán)藍(lán)設(shè)計(jì)的小編

前言

隨著 Hybrid 應(yīng)用的豐富,HTML5 工程師們已經(jīng)不滿足于把桌面端體驗(yàn)簡單移植到移動(dòng)端,他們覬覦移動(dòng)原生應(yīng)用人性化的操作體驗(yàn),特別是原生應(yīng)用與生俱來的豐富的手勢系統(tǒng)。HTML5 沒有提供開箱即用的手勢系統(tǒng),但是提供了更底層一些的對 touch 事件的監(jiān)聽?;诖?,我們可以做出自己的手勢庫。

手勢

常用的 HTML5 手勢可以分為兩類,單點(diǎn)手勢和兩點(diǎn)手勢。單點(diǎn)手勢有 tap(單擊),double tap(雙擊),long tap(長按),swipe(揮),move(移動(dòng))。兩點(diǎn)手勢有 pinch(縮放),rotate(旋轉(zhuǎn))。

接下來我們實(shí)現(xiàn)一個(gè)檢測這些手勢的 javaScript 庫,并利用這個(gè)手勢庫做出炫酷的交互效果。

1.jpg

設(shè)計(jì)師出身,如何管理一個(gè)設(shè)計(jì)團(tuán)隊(duì)甚至產(chǎn)品團(tuán)隊(duì)?

藍(lán)藍(lán)設(shè)計(jì)的小編

團(tuán)隊(duì)管理

不論是什么類型的團(tuán)隊(duì)管理,首先是團(tuán)隊(duì)管理。

1)為什么要有團(tuán)隊(duì)?因?yàn)橐粋€(gè)人搞不定。所以團(tuán)隊(duì)中的每一個(gè)人都必須明白,合作是一切的基礎(chǔ)。一方面,合作是一切的基礎(chǔ),如果不能成為團(tuán)隊(duì)合作的力量,能力再強(qiáng)的人也沒用,甚至反而有可能成為破壞者。另一方面,每一個(gè)進(jìn)入團(tuán)隊(duì)的成員,都需要有存在的價(jià)值,能力強(qiáng)、有特殊能力、或者具有迅速成長的潛力;理想的情況是每個(gè)人都有別人無法取代的能力(隨著團(tuán)隊(duì)規(guī)模的增大,會(huì)在每個(gè)能力上放多幾個(gè)人,作為backup),成為整個(gè)團(tuán)隊(duì)在某方面可以依靠的專家。

2)團(tuán)隊(duì)要做什么?團(tuán)隊(duì)是為達(dá)成目標(biāo)而存在的。沒有目標(biāo)的團(tuán)隊(duì),在商業(yè)上不可能長久存在,在文化上不可能形成凝聚力。長遠(yuǎn)目標(biāo)(幾年甚至更長時(shí)間的)是團(tuán)隊(duì)存在的意義,是吸引人加入、讓人留下、遇到困難時(shí)能執(zhí)著、遇到好情況不迷失的核心。中期目標(biāo)(半年一年的)是團(tuán)隊(duì)實(shí)際努力的方向,只有長遠(yuǎn)目標(biāo),大家還是不知道怎么做,而中期目標(biāo)是把大家的力量集中起來做出成績的重要途徑。短期目標(biāo)(每月、每周、每天)是讓團(tuán)隊(duì)運(yùn)轉(zhuǎn)的切實(shí)保障,是團(tuán)隊(duì)的精細(xì)運(yùn)營。

3)團(tuán)隊(duì)?wèi)?zhàn)斗力靠什么保障?文化和制度??款I(lǐng)導(dǎo)人的人治的團(tuán)隊(duì)是非常脆弱的(參見幾千年王朝的一次次變更)。但是靠文化多一些還是制度多一些,得因團(tuán)隊(duì)而異。靠文化,對人要求高,需要每個(gè)團(tuán)隊(duì)成員能被充分激勵(lì),發(fā)揮主觀能動(dòng)性;靠制度,對人的要求低,員工只要做好執(zhí)行就好,很難產(chǎn)生創(chuàng)新和進(jìn)化。通常,初創(chuàng)團(tuán)隊(duì)靠文化多一些的效果更好,成熟團(tuán)隊(duì)靠制度多一些的效果更好;而不論怎樣的團(tuán)隊(duì),擁有好的文化都會(huì)讓團(tuán)隊(duì)更優(yōu)秀。好的團(tuán)隊(duì)文化,需要從一開始、從點(diǎn)滴中培養(yǎng),往往,創(chuàng)始人決定初創(chuàng)團(tuán)隊(duì)的文化,初創(chuàng)團(tuán)隊(duì)決定整個(gè)公司的文化。在制度層面,則要特別需要注意對工作協(xié)作有重要影響的工作流程的建立,往往公司內(nèi)很多混亂的根源,就在于沒有一套清晰可執(zhí)行、保障效率、對結(jié)果負(fù)責(zé)的工作流程;好的工作流程的建立能夠讓大家的努力事半功倍,也能有效防止損耗和錯(cuò)誤的發(fā)生。

4)團(tuán)隊(duì)不夠好怎么辦?主動(dòng)成長。雖說既要持續(xù)引入更優(yōu)秀的人才,也要持續(xù)提升團(tuán)隊(duì)自身的能力。但是千萬別把團(tuán)隊(duì)提升的希望都放在引入更優(yōu)秀的人才上——如果你的團(tuán)隊(duì)本身不夠優(yōu)秀,怎么吸引來更優(yōu)秀的人才?外來的優(yōu)秀人才,就一定能成為你團(tuán)隊(duì)中的優(yōu)秀合作者么?所以無論如何,都要持續(xù)花時(shí)間和精力在培養(yǎng)提升團(tuán)隊(duì)自身的能力上。正因?yàn)殡y,需要很長時(shí)間,才需要從一開始就有意識的去做,并且堅(jiān)持。另外,團(tuán)隊(duì)是不斷成長的,曾經(jīng)的優(yōu)秀人才不見得一直是團(tuán)隊(duì)需要的優(yōu)秀人才,不能跟上團(tuán)隊(duì)腳步的人只能被淘汰。與其到時(shí)再兒女情長,不如平時(shí)就重視主動(dòng)成長。

5)怎么從小團(tuán)隊(duì)到大團(tuán)隊(duì)?除非是堅(jiān)持做細(xì)分專業(yè),否則你躲不過這道關(guān)。從在一個(gè)小團(tuán)隊(duì)里合作,到在整合了很多小團(tuán)隊(duì)的大團(tuán)隊(duì)里合作;從領(lǐng)導(dǎo)一個(gè)小團(tuán)隊(duì),到領(lǐng)導(dǎo)一個(gè)大團(tuán)隊(duì)。不用擔(dān)心,如果你真正學(xué)習(xí)實(shí)踐好前面幾點(diǎn),這一關(guān)只是更大、更復(fù)雜的版本而已:)

震撼人心的人性實(shí)驗(yàn):誰的人生不委屈?

藍(lán)藍(lán)設(shè)計(jì)的小編

你覺得委屈嗎?為什么委屈?哪些事情讓你覺得委屈?


認(rèn)真的想一想,把思緒整理在紙上和日記上,當(dāng)你寫下來的時(shí)候,你就會(huì)看見自己內(nèi)心真實(shí)的想法——事實(shí)上,我們是為了自己的某些訴求,才做了這些事情,對嗎?然后當(dāng)我們期待沒有得到滿足的時(shí)候,我們就壓抑了很多委屈和憤怒。


不要期待任何人對我們的感受負(fù)責(zé),能滿足我們自己的,能為我們自己感受負(fù)責(zé)的,只有我們自己。


你希望成為哪種類型的人,就需要獲得哪種類型的思維方式。注意你的思想,它會(huì)成為你的行動(dòng)。注意你的行動(dòng),它將構(gòu)成你的思想。當(dāng)你意識到思維需要改善,就意味著全新的機(jī)會(huì)。

2016年7個(gè)JavaScript框架

藍(lán)藍(lán)設(shè)計(jì)的小編

當(dāng)涉及到Web開發(fā)時(shí),JavaScript框架往往是一些開發(fā)人員和企業(yè)的平臺??赡?,你有機(jī)會(huì)嘗試過一兩個(gè)的JavaScript框架,但你仍然有點(diǎn)不確定哪個(gè)才是最佳的最值得掌握的,或者哪個(gè)值得你建議你的開發(fā)人員選擇用于下一個(gè)web開發(fā)項(xiàng)目。

JavaScript正在以驚人的速度前進(jìn),并且添加新的技能到你的存儲庫變得有不斷的壓力。為了做到這一點(diǎn),知道和了解更多的JavaScript框架在現(xiàn)在看來是必要的。在ValueCoders進(jìn)行了徹底的研究后,我們?nèi)雵似渲衅邆€(gè)框架,它們是:

1.AngularJS 2.0&1.x

在最受期待的AngularJS 2.0正式發(fā)布之后,框架的普及已經(jīng)達(dá)到了一個(gè)新的水平。然而,如果你不確定的話,跳到新版本仍然是一個(gè)冒險(xiǎn)的決定。讓我們通過這個(gè)流程圖來幫助你做出決定:

1.png

怎樣做用研?—— 用戶研究的五步法

藍(lán)藍(lán)設(shè)計(jì)的小編

研究計(jì)劃已經(jīng)確定了,你可以在表格里陳列出你的最初設(shè)想?,F(xiàn)在你要開始實(shí)施合適的研究方法了。你的團(tuán)隊(duì)將招募8個(gè)用戶,分三個(gè)晚上進(jìn)行訪談,每人一小時(shí)。這給了你機(jī)會(huì)詢問用戶他們什么時(shí)候最想看電視。準(zhǔn)備一些訪談指引和激勵(lì)物品,并且在同事身上先測試一下活動(dòng)的草稿版。然后再開始實(shí)施你的調(diào)研吧!

當(dāng)你做以下這些事情的時(shí)候,你會(huì)使調(diào)研環(huán)節(jié)變得更為容易:獲取和分析筆記、照片、視頻和其他你在調(diào)研中收集的材料。

JavaScript 數(shù)組中的 indexOf 方法詳解

藍(lán)藍(lán)設(shè)計(jì)的小編

最近項(xiàng)目遇到一個(gè)小問題代碼我會(huì)簡化成小例子展示給大家。

用心看到最后會(huì)有收獲哈,基礎(chǔ)扎實(shí)的童鞋可以直接跳到數(shù)組類型使用。

說到 indexOf 大家并不陌生,判斷字符串是否包涵子字符串時(shí)特別常用(正則不熟練同學(xué)的利器)。

String 類型的使用

溫習(xí)一下大家熟知的字符串用法,舉個(gè)例子

let str = 'orange';

str.indexOf('o'); //0 str.indexOf('n'); //3 str.indexOf('c'); //-1

這里 0 和 3 分別是 o 和 n 在字符串中出現(xiàn)的位置。起始下標(biāo)是 0。而 -1 代表未匹配。

用戶研究的14種經(jīng)典方法

藍(lán)藍(lán)設(shè)計(jì)的小編

歷時(shí)2個(gè)多月的編撰和設(shè)計(jì),#用研方法傳遍中國#在今天將告一段落;經(jīng)過仔細(xì)的梳理與總結(jié),的用戶研究工程師們將用戶研究工作中的經(jīng)典方法一一總結(jié)出來,與大家分享討論,也歡迎更多對用戶體驗(yàn)感興趣的同學(xué)加入討論,大家共同努力、共同進(jìn)步!

1 、【眼動(dòng)&腦電研究】 將眼動(dòng)儀和腦電設(shè)備聯(lián)機(jī)同步,可以知道用戶是如何看的,以及當(dāng)時(shí)的心理活動(dòng)。


2 、【可用性測試】 想知道可用測試是什么?可用性測試的目的&作用?適用的場景?測試

JavaScript arguments 對象詳解

藍(lán)藍(lán)設(shè)計(jì)的小編

1. 什么是 arguments

MDN 上解釋:

arguments 是一個(gè)類數(shù)組對象。代表傳給一個(gè)function的參數(shù)列表。

我們先用一個(gè)例子直觀了解下 JavaScript 中的 arguments 長什么樣子。

function printArgs() { console.log(arguments);
}

printArgs("A", "a", 0, { foo: "Hello, arguments" });

執(zhí)行結(jié)果是:

日歷

鏈接

個(gè)人資料

存檔