读 javascript 忍者秘籍
本文是作者阅读 javascript 忍者秘籍这本书过程中所记录零散知识和学习的一部分,也相当于收录一下个人认为简洁有趣的代码吧。
我很喜欢这本书,客观地说,它能够将文字和代码完美结合,表现出一种紧凑、凝练很简洁,知识多、用法巧且易懂的效果,为我在前端行走地道路上扫掉了很多盲点,同时也开拓了解决问题的思路。
一、性能分析
将我们编写出来的代码进行时间性能测试,计算出执行该业务函数所需的时间成本。另外还有 console.profile
测试,该 api 提供的信息和分析入手点更多。下面是一个简单测试参数 fn
函数的执行时间,执行完后输出执行所消耗的时间。
Console 相关API
function timer(fn, arg) {
console.time(fn.name + ' PT')
fn(arg)
console.timeEnd(fn.name + ' PT')
}
二、递归遍历 DOM 节点树
参数一 ele
是根节点,以该节点为起始点向下遍历所有子节点。参数二 fn
是个函数,在遍历节点树中为每个节点调用该函数一次,至于函数要对该节点动什么手脚,取决于你要传入的函数。
function traverseDOM(ele, fn) {
// 处理当前节点
fn(ele)
ele = ele.firstElementChild
while (ele) {
traverseDOM(ele, fn)
ele = ele.nextElementSibling
}
}
下面也是一个拥有同样功能的函数,每调用它一次都会获得一个返回值直至无生成值产生,我们通常将这类函数称为生成器,即调用时计算一次并返回该值,而不是一次性将整个仓库丢给你。我们可以通过DOMTraversal.next().value
不断获取下一个生成的值,直到最后一个返回值 undefined
出现。
该函数只接收一个参数 ele
,即根节点。从该节点开始向下遍历所有子节点,每调用一次返回一个节点,所以需要外部调用该生成器并接受其返回值。如果要为根节点下所有子节点调用一函数,比如 fn
,则需要在外部遍历生成器的同时将生成器返回的节点作为遍历体中 fn
函数的参数即可。
yield* 语法
function* DOMTraversal(ele) {
yield ele
ele = ele.firstElementChild
while (ele) {
// yield* 将迭代控制转移到另一个 DOMTraversal 生成器上
yield* DOMTraversal(ele)
ele = ele.nextElementSibling
}
}
三、Promise
实现异步获取服务器数据
异步处理 ajax
请求,如果该承诺成功兑现,resolve
函数将会改变 Promise
对象的状态,并将成功的结果作为then
第一参数(onResolved 函数)的参数,即我们获取请求数据后要如何处理这些数据的一个函数。如果失败,通过 reject
函数改变状态,同样将失败原因作为 catch
第一参数的参数(如果有的话),也可以在 then
的第二参数实现该失败处理函数。
Promise 相关API
function getJSON(url) {
return new Promise((resolve, reject) => {
const request = new XMLHttpRequest()
request.open('GET', url)
request.onload = () => {
try {
if (this.status === 200) {
resolve(JSON.stringify(this.response))
} else {
reject(this.status + ' ' + this.responseText)
}
} catch (e) {
reject(e.message)
}
}
request.onerror = () => {
reject(this.status + ' ' + this.responseText)
}
request.send()
})
}
getJSON('data/ninjas.json')
.then(ninjas => {
assert(ninjas !== null, 'Ninjas obtained')
})
.catch(e => {
console.log('Something wrong.')
})
// 链式调用 Promise,每个 then 都会返回一个 Promise 对象,该对象拥有上一个 Promise 对象的结果和状态
getJSON('data/ninjas.json')
.then(ninjas => getJSON([ninjas[0].missionsUrl]))
.then(missions => getJSON([missions[0].detailUrl]))
.then(mission => assert(mission !== null, 'Ninjas mission obtained'))
.catch(e => {
console.log('Something wrong.')
})
四、了解 setPrototypeOf defineProperty API
setPrototypeOf
Object 相关API
const yoshi = { skulk: true}
const hattori = { sneak: true}
const kuma = { creep: true}
assert('skulk' in yoshi, 'Yoshi can skulk')
assert('sneak' in hattori, 'hattori can skulk')
// 将对象 hattori 设置为 yoshi 对象的原型,即改变了 yoshi 的原型指向
Object.setPrototypeOf(yoshi, hattori)
assert('sneak' in yoshi, 'yoshi can skulk')
assert(!('creep' in hattori), 'hattori can not skulk')
Object.setPrototypeOf(hattori, kuma)
assert('creep' in hattori, 'hattori can skulk')
assert('creep' in yoshi, 'yoshi alse can skulk')
defineProperty
let ninja = {}
ninja.weapon = 'kusarigama'
// 为 ninja 对象自定义 sneaky 属性的规则,可以约束遍历、写读等操作
Object.defineProperty(ninja, 'sneaky', {
configurable: false,
enumerable: false,
value: true,
writable: true
})
assert('sneaky' in ninja, 'We can access the new property.')
for (let prop in ninja) {
assert(prop != undefined, 'An enumerated property: ' + prop)
}
// 继承,解决 constructor 属性被覆盖的问题
function Food() {}
Food.prototype.sugar = function () {}
function Melon() {}
Melon.prototype = new Food()
// 继承链时不建议使用 Melon.prototype = Food.prototype
// 因为 Food 原型上发生的变化都会同步到 Melon 原型上
// 定义一个新的不可枚举的 constructor 属性,属性值为 Food 对象,避免被覆盖
// 不设置的话,constructor 指向仍为 Melon
Object.defineProperty(Melon.prototype, 'constructor', {
enumerable: false,
value: Food,
writable: true
})
let melon = new Melon()
assert(melon.constructor === Food, 'restablished!')
for (let prop in Melon.prototype) {
assert(prop === 'sugar', 'the only enumerate property is sugar!')
}
五、了解 getter 和 setter
对读取、设置对象属性值作出一定的约束,符合规则才能获取或修改。
const ninjiaCollection = {
ninjas: ['Yoshi', 'Kuma', 'Hattori'],
// es6 class 中也可以做出同样的约束,而且语法相同
get firstNinja() {
console.log('Getting firstNinja')
return this.ninjas[0]
},
set firstNinja(val) {
console.log('Setting firstNinja')
this.ninjas[0] = val
}
}
assert(ninjiaCollection.firstNinja === 'Yoshi', 'Yoshi is the first ninja')
ninjiaCollection.firstNinja = 'Hachi'
assert(ninjiaCollection.firstNinja === 'Hachi' && ninjiaCollection.ninjas[0] === 'Hachi', 'Now Hachi is the first ninja')
// or 用 defineProperty 定义 getter、setter
function Ninja() {
let _skillLevel = 0
Object.defineProperty(this, 'skillLevel', {
get: () => {
console.log('Getting firstNinja')
return _skillLevel
},
set: val => {
console.log('Setting firstNinja')
_skillLevel = val
}
})
}
const ninja = new Ninja()
assert(typeof ninja._skillLevel === undefined, 'Cannot access a private property')
assert(ninja.skillLevel === 0, 'The getter works fine!')
ninja.skillLevel = 10
assert(ninja.skillLevel === 10, 'The value was updated')
六、代理 Proxy
控制对另一个对象属性的访问
Proxy Doc
// 类似的,只是这次为通过代理约束。
const emperor = {name: 'Komei'}
const representative = new Proxy(emperor, {
get: (target, key) => {
console.log('Reading ' + key + ' through a proxy')
return key in emperor ? target[key] : 'Do not bother the emperor!'
},
set: (target, key, value) => {
console.log('Writing ' + key + ' through a proxy')
target[key] = value
}
})
assert(emperor.name === 'Komei', 'name is Komei')
assert(representative.name === 'Komei', 'get the name property through a proxy')
assert(emperor.nickname === undefined, 'emperor does not have a nickname')
assert(representative.nickname === 'Do not bother the emperor!', 'The proxy jumps in when we make inproper requests')
representative.nickname = 'Tenno'
assert(emperor.nickname === 'Tenno', 'emperor does not have a nickname')
assert(representative.nickname === 'Tenno', 'The nickname is alse accesible through the proxy')
实现数组负索引功能
Python 的列表可以通过 list[-1]
访问最后一个,list[-2]
访问倒数第二个,甚至 list[1:]
切片技术截取从索引 1 到最后一个。这里简单实现了数组的负索引,至于切片效果,通过 array.slice(1, array.length)
进行获取,大体也差不多的。
function createNegativeArrayProxy(array) {
if (!Array.isArray(array)) {
throw new TypeError('Expected an array')
}
return new Proxy(array, {
get: (target, index) => {
index = +index
return target[index < 0 ? target.length + index : index]
},
set: (target, index, val) => {
index = +index
return target[index < 0 ? target.length + index : index] = val
}
})
}
const ninjas = ['Yoshi', 'Kuma', 'Hattori']
const proxiedNinjas = createNegativeArrayProxy(ninjas)
assert(proxiedNinjas[0] === 'Yoshi', 'found')
assert(proxiedNinjas[2] === 'Hattori', 'found')
assert(proxiedNinjas[-1] === 'Hattori', 'found')
assert(proxiedNinjas[-2] === 'Kuma', 'found')
assert(proxiedNinjas[-3] === 'Yoshi', 'found')
七、了解 Map And Set
map
根据键获取键对应的值,这里不同于 {} 对象,Map 的键甚至可以是对象和特殊值,而不仅限于字符串。下面为建立一字典容器,设置键值对,获取键值,容器大小,以及删除已有键值对和清空整个容器。
Map 相关API
const ninjaIslandMap = new Map()
const ninjas1 = {name: 'Yoshi'}
const ninjas2 = {name: 'Hattori'}
const ninjas3 = {name: 'Kuma'}
ninjaIslandMap.set(ninjas1, {homeIsland: 'Honshu'})
ninjaIslandMap.set(ninjas2, {homeIsland: 'Hokkaido'})
assert(ninjaIslandMap.get(ninjas1).homeIsland === 'Honshu')
assert(ninjaIslandMap.get(ninjas2).homeIsland === 'Hokkaido')
assert(ninjaIslandMap.get(ninjas3).homeIsland === undefined)
assert(ninjaIslandMap.size === 2)
assert(ninjaIslandMap.has(ninjas1) && ninjaIslandMap.has(ninjas2))
ninjaIslandMap.delete(ninjas1)
assert(!ninjaIslandMap.has(ninjas1))
ninjaIslandMap.clear()
assert(ninjaIslandMap.size === 0)
set
集合结构,即相同项只能有一项,不可共存,下面为建立集合容器,检测数据是否存在,移除数据,支持 for of
遍历,除此之外还有,还有并集、交集、差集运算。
Set 相关API
const ninjas = new Set(['Yoshi', 'Hattori', 'Kuma', 'Hattori'])
assert(ninjas.has('Hattori') && ninjas.size === 3)
ninjas.add('Yagyu')
assert(ninjas.has('Yagyu'))
ninjas.remove('Hattori')
for (let ninja of ninjas) {
console.log(ninja)
}
八、正则捕获引用,反向引用
反向引用匹配 HTML 标签的内容
有时候,我们需要检测、匹配一些前后一致的字符串,但这些字符串是未确定的,例如标签对。在此我们可以使用正则的捕获引用,以第一个匹配的结果作为后一个的匹配规则,下面是利用捕获引用获取标签对内的文本节点。
let html = 'Hello world! '
// 捕获的引用,\1 指向第一个捕获
const pattern = /<(\w+)([^>]*)>(.*?)<\/\1>/g
let match = pattern.exec(html)
assert(match[0] === 'Hello ')
assert(match[1] === 'b')
assert(match[2] === ' class="hello"')
// 目标内容
assert(match[3] === 'Hello')
// 再执行一次,则得到类似的结果(world! )
match = pattern.exec(html)
console.log(match)
驼峰字符串转化成短横线链接字符串
// 对替代字符串内获取捕获,而不是使用反向引用,使用 $1、$2 等标记捕获序号
let test = 'fontFamily'
assert(test.replace(/([A-Z])/g, '-$1').toLowerCase() === 'font-family')
短横线链接字符串转化成驼峰字符串
function upper(all, letter) {
return letter.toUpperCase()
}
let test2 = 'border-bottom-width'
assert(test2.replace(/-(\w)/g, upper) === 'borderBottomWidth')
一种查询字符串压缩技术
该压缩技术即是对 URL 地址后面的参数进行压缩,整合冗余的参数键值对到单个 =
号上,用 ,
分隔键值。
function compress(source) {
const keys = {}
source.replace(/([^=&]+)=([^&]*)/g, function (full, key, value) {
keys[key] = (keys[key] ? keys[key] + ',' : '') + value
})
const result = []
for (let key in keys) {
result.push(key + '=' + keys[key])
}
return result.join('&')
}
assert(compress('foo=1&foo=2&blah=a&blah=b&foo=3') === 'foo=1,2,3&blah=a,b')
匹配 Unicode
根据特定的转义字符和指定一个范围匹配 Unicode 字符串。
let text = '\u5FCD\u8005\u30D1\u30EF\u30FC'
const matchAll = /[\w\u0080-\uFFFF_-]+/g
assert(text.match(matchAll), 'Regexp matches non-ASCII!')
九、确定 DOM 自闭合元素被正确解析
编写 HTMl 页面时,我们有可能会疏忽掉未闭合的标签,或者干脆不写,兼容性处理好的浏览器可能会帮我们自动补全那些需要成对出现但未成对的标签,如果闭合不符合规范将会对文档结构的解析造成很大的影响,现在我们大概可以将该处理函数简化成下面这种方式,给定一个包含不需要自闭的标签字符串,通过正则匹配传入的字符串来决定哪些标签需补全,哪些不用,最终返回处理后的结果。
function convert(html) {
const tags = /^(area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i
return html.replace(/(<(\w+)[^>]*?)\/>/g, (all, front, tag) => {
return tags.test(tag) ? all : front + '>' + tag + '>'
})
}
assert(convert(' ') === ' ', 'Check anchor conversion.')
assert(convert(' ') === ' ', 'Check hr conversion.')
十、将元素标签转为一系列 DOM 节点
个人觉得这是一个不实用的方法,依靠函数补全父节点的不完整性,并不是件值得赞扬的事儿。当然了,这里只是练练手,通过匹配传入的字符串可以确定标签应有的标签深度(嵌套层数),从而决定是否需要填补父级标签对使其完整。
function getNodes(htmlString, doc) {
const map = {
'', ' '],
'', ' '],
'', ' '],
'', ''],
' ', ''],
'', ''],
'', ''],
' ', ''],
' ', ''],
'', ''],
'', ''],
' ', ' '],
}
const tagName = htmlString.match(/<\w+/)
let mapEntry = tagName ? map[tagName[0]] : null
if (!mapEntry) {
mapEntry = [0, ' ', ' ']
}
let div = (doc || document).createElement('div')
div.innerHTML = mapEntry[1] + htmlString + mapEntry[2]
while (mapEntry[0]--) {
div = div.lastChild
}
return div.childNodes
}
assert(getNodes('test test2 ').length === 2, 'Get two nodes back froum the method.')
assert(getNodes('test ')[0].nodeName === 'TD', 'Verify that we are getting the rigth node.')
十一、获取样式属性计算后的值
一个获取元素样式属性计算过后的属性值。
getComputedStyle Doc
function fetchComputedStyle(element, property) {
const computedStyles = getComputedStyle(element)
if (computedStyles) {
// 将驼峰转为中横线分隔
property = property.replace(/([A-Z])/g, '-$1').toLowerCase()
return computedStyles.getPropertyValue(property)
}
}
十二、自定义事件
当浏览器提供的内置事件不能满足于我们的需求时,可以凭借 CustomEvent
构造函数自定义我们想要的事件,第一参数 eventType
是指事件的类型(名字),第二参数是一个对象,里面囊括所要描述的信息。这里自定义了 ajax-start
和 ajax-complete
两个事件,可轻易地从事件名判断出事件监听的时间点或触发点,而且每个事件都是完全独立的。
CustomEvent Doc
function triggerEvent(target, eventType, eventDetail) {
const event = new CustomEvent(eventType, {
detail: eventDetail
})
target.dispatchEvent(event)
}
function performAjaxOperation() {
triggerEvent(document, 'ajax-start', {
url: 'my-url'
})
setTimeout(() => {
triggerEvent(document, 'ajax-complete')
}, 5000)
}
// 示例测试
const btn = document.getElementById('clickMe')
btn.addEventListener('click', () => {
performAjaxOperation()
})
document.addEventListener('ajax-start', e => {
document.getElementById('whirlyThing').style.display = 'inline-block'
assert(e.detail.url === 'my-url', 'pass in event data')
})
document.addEventListener('ajax-complete', e => {
document.getElementById('whirlyThing').style.display = 'none'
})
你可能感兴趣的:(2019-01-24)
2019-01-24
角角123
2019-01-23①每天6.30起来打卡完成②晨间日记完成1.给学员讲解考级要求,并鼓励他们不要紧张完成2.整理回家的东西完成3.看点幽默的视频,郭德纲的相声。③看书半小时。完成④输出写作不少于300字。⑤复盘。完成⑥健身半个小时完成瓦伦达效应瓦伦达效应”属于“不良压力”。这是一种非理性的压力,因为这种压力的根源是人的患得患失的心态,并不是担心自己不够好从而想办法提升自我,而是在反复担心“失败后
2019-01-24
YMMona
分手23天,他突然发了个语音,6秒,2个字用了1秒,剩下5秒在抽泣,唤我宝宝。1个小时20分钟后,我回复了RUokay,微信自动跳出灰字,我不是对方的好友一丝震惊,心酸,难过,一些无奈,担忧,疑惑,不忍其实他发之前,我昨天很想问候下他,你怎么样?我也想问,不是信誓旦旦不会放手,为何一个分手电话后杳无音讯我也想问,要是说再见,为何不好好说再见
2019-01-24
幽冥沐雪
马上接近年关,离接你也越来越近,甚至各种期待,去云南的票一周前就买好,静静等待你的到来。而就在几分钟前你找人给我打电话来说身份证不知道放哪了,那一刻火冒三丈,我千叮咛万嘱咐什么都可以掉唯独身份证,甚至每一天都不厌其烦的跟你唠叨,身份证一定放好,当你特别小心翼翼的跟我讲今天找了一天不知道放在何处的时候我觉得更多的是心疼,在看看时间晚上十一点半你去找别人给我打电话,就为了告诉我你找不到身份证,不知道为
2019-01-24刻意练习
梦雅的简动力
书名,读了一篇其他阅读者的读后感亦可以专业术语说是书评,暂且列入“想读”,没有参与就没有发言权,仅对这四个字发表一下见解。列了几项计划,日更6000步、日更、每周读两本书写书评、听CPA课,写信给关心的她们等,目前正在执行中,也包含了对于自我为人处世的要求,对事对闻的态度,可以说是在“刻意练习”,半个多月下来,整体觉得生活是充实的,不至于发呆,不至于木讷,不至于闲于应付时间;收获的是有条有理的办事
2019-01-24
123的梦
昨天收拾了一下自己,收拾了一下房间。很久没有收拾了。我也需要整理一下自己的思路。一度想快步前行,便把自己弄得蓬头垢面。看来不能急功近利,要逐序渐进,一步一个脚印。不怕慢,就怕站。生活还要继续,我不想被鸡毛蒜皮淹没。我的誓言:三年实现经济独立。2018年11月26日~2021年11月25日。共计1095天。今天是第60天。今天,我又朝独立的生活迈进了一步,我应该为自己鼓掌!
再遇小猪佩奇:回顾一次完美的营销
静静的含羞草
商业再遇小猪佩奇:回顾一次完美的营销2019-01-24今日导读PeppaPig(《小猪佩奇》)是一部来自英国的动画片,自2004年播出以来,受到了世界各地无数小朋友的喜爱。2015年,国内的小朋友第一次与《小猪佩奇》见面,它因为奇妙的画风、鲜艳的配色、充满乐趣的剧情,很快成为了很多小朋友每日必看的节目。不仅如此,半年前小猪佩奇还摇身一变成为了“社会人”的代名词。最近,一部叫做《啥是佩奇》的短片在
2019-01-24
空灵静
这两天的一个状态是挺“丧”的。突然就想到了以后的生活与工作。工作的事情没有处理好,生活上便也无法去经营得精致,自己的生活节奏就一步步的被打乱,自然而然的内心的焦虑感便也降临。和朋友诉说自己的一个近况。朋友说“后来我哦发现自己把工作的事情处理干净,活干净明白了,生活也可以过的很舒心。”我觉得这文字的背后,是有一股多么强大的力量在支撑着他啊,内心的充盈与丰富足以让他将这些负面的情绪释放,并不影响他生活
兴趣和工作分清楚,怎样完成一项工作?
奥巴荣
奥巴荣Blog-054佛山·中国2019-01-24用语音速记聊了半个钟,最后聊了最近工作上的烦恼。记得之前好像有说过同样的事情,懒得去查,再说一次也无妨。现在工作的事情不算特别忙,但是任务列表也有几十个低优先级的open。不可能把所有任务都做完,做好那最重要的20%的任务就好了。在没有头绪想歇一歇的时候,最近喜欢看科技新闻,想跟上世界潮流。业余时候,之前想自己做一些项目,提高工作能力,例如量子实
2019-01-24
Fantasiy
1.完成开题报告研究意义和背景,规划了时间;2.与老师讨论了模型的问题3.原则梳理原则(初稿)关于反馈成长的过程,给这世界建立的有效联系,得到有效的反馈。反馈可以是自己,也可以是他人外界。原则建立,用时间去实验自己的原则,在生活中的达到的指标。尤克里里,弹出来的声音。产品给于用户,用户给于反馈,进行调整。数一数,每天有效联系的人和物,得到的反馈量,反馈周期,成长周期。我想拥有把一切事物说明简单的方
2019-01-24
臻美Kin56
Kin91宇宙蓝猴,以慈悲与爱感受遇见晚上下班,接近新年的城巴,没有了往常的挤拥,上车后,便挑选了一个可以方便我听冥想音乐的位置坐下,播放慈悲心练习《我是另外一个你》。当音乐引领到“在头顶上有一个光球向四周浮射出柔软温暖明亮的金色光芒,感受她的博大与慈悲”时,闭上眼睛的我感受到一股酸味从远处蔓延过来,直扑鼻子。我慢慢睁开眼睛,映入眼帘的是对面座位一个女孩猛吐了一地,坐在旁边打扮优雅的妈妈有点不知所
2019-01-24
坏火柴
第7课1、创伤性记忆也很可能把我们经历的——或者以为自己亲身经历过的——某事件的大量错误信息整合在一起,即便是高度情绪化的记忆也有可能是完全错误的、虚假的。【自以为的创伤性记忆可能不完全是真的】2、从一般情况来看,单靠展示照片或问几个特定的问题就能在我们的记忆中植入虚假的细节,甚至还能植入令人难以置信的情感事件。3、用语言重复描述某事物非但不能加强记忆,反而会削弱记忆。但并不意味着用语言描述这个方
2019-01-24
叮当凡凡
我们三人是大学毕业时找工作的过程中认识的,谁说过的出了校园便不会再有真正的友谊?我们三人这里破了这个迷信。当初在人力市场,为了工作头破血流的人不在少数,可是我们三朵奇葩相遇真是天大的缘分,因为我们总是被同一家公司面试并且面试不通过。于是在第三次在同一家公司面试不通过的时候相遇后,我们三很豪爽的决定出去吃一顿,奶奶的,不就一个工作,慢慢找就是了。在吃饭的过程中,我们发现我们三人属于臭味相投型的,怪不
2019-01-24
柳叶箴
知其不可而为之的勇气不是谁都有的明知道我答应的可能微乎其微却还是抱着一丝希望去请求可惜我这人铁石心肠思量考虑后若觉不可那便是不可
2019-01-24
水中月是天上月_6336
蓝色和红色性格,蓝色做什么都计划好,不喜欢出自己掌控外的事情,红色性格不安规则出牌,随心所欲,碰撞机率比较大
2019-01-24
琳_efc0
当你不再打开朋友圈时,你在逃避什么?这已经是很多次当我习惯性点开五彩同心圆圈又急忙退出了,想一想我每隔一两个月就会出现逃避去看朋友圈的行为,我为此觉得焦虑难过又心烦。这种行为已经持续一两年了,我其实很明白自己抗拒的原因,昔日的同窗、讨厌的亲戚、认识的朋友在朋友圈里都过得比我好。说走就走的旅行、奢侈豪华的晚餐、美得令你嫉妒的容颜充斥于你的朋友圈,而此刻刷朋友圈的你没有诗和远方,只有干瘪的荷包、贫瘠的
【家庭成长日记】Mickey生日
彭峰_家庭教育工具
【2019-01-24星期四晴】Mickey的生日终于到了,这半个月她自己自然是一直在期待中度过的。今年给Kitty过了一个比较特别的生日,那就是让她请同学过来,一开始说请5/6个,谁知后来她好朋友太多,一下子把半个班的同学都叫过来了。场面极为热闹。这可把Mickey羡慕死了,她也想过一个这样的生日。由于她还在上幼儿园,家长们不会同意让孩子去同学家的。所以只是家人陪她过,潘锴一家和明磊一家,吃完午
2019-01-24
Fantasiy
一、拥抱现实,应对现实1、做一个超级现实的人:超出现阶段事情不考虑,比如说结婚生子,小孩上学,买房子,奢侈品愿望(欲望)+现实(方法)+决心(坚持)=实现想法的生活深呼吸和冥想有助于镇静和清醒有情绪的时候先停止一会2、对现实的准确理解事任何良好结果的根本依据:比如不愿意花钱和精力时间,就是不爱可信者特征,能不断成功的实现一些成就,并能够对如何实现这一点提供清晰的解释,在某个领域三次成功3、做到头脑
2019-01-24
静水流深深几许
心灵点滴:不管昨晚你经历了怎样的撕心裂肺,早上醒来这座城市依然车水马龙、人语喧嚣,没有人在意你失去了什么,没有人关心你快不快乐,这个世界不会为了任何人停下前进的步伐。成长,就是学会在跌跌撞撞中把所有委屈调成静音模式。成长,就是要认识到人一定会摔倒的事实,更要明白因地而倒因地而起的道理。不要强迫自己什么事情都要做对,因为很多时候,只有犯错才能让我们变得更好。美好的一天从更好开始!人的烦恼就12个字:
2019-01-24
君子包
凤求凰汉·司马相如有一美人兮,见之不忘。一日不见兮,思之如狂。凤飞翱翔兮,四海求凰。无奈佳人兮,不在东墙。将琴代语兮,聊写衷肠。何日见许兮,慰我彷徨。愿言配德兮,携手相将。不得於飞兮,使我沦亡。凤兮凤兮归故乡,遨游四海求其凰。时未遇兮无所将,何悟今兮升斯堂!有艳淑女在闺房,室迩人遐毒我肠。何缘交颈为鸳鸯,胡颉颃兮共翱翔!凰兮凰兮从我栖,得托孳尾永为妃。交情通意心和谐,中夜相从知者谁?双翼俱起翻高飞
2019-01-24
3ff4007cf51f
今天早上我和妈妈睡到9:00钟才起床,我们飞快地下楼吃完早餐又飞快地跑四楼去,一到四楼看见奶奶在哪儿,我就拿着作业本来到姐姐的房间里写作业了,我忽然听到有人在叫我,哦,原来是奶奶在叫我呀!她说把那个位置让给我写作业,我说不用了,奶奶就忙着她自己的事情,我也忙着写作业,写啊,写啊…终于作业写的差不多了,还有最后一题体是做实验,我赶紧跑下楼,首先:从冰箱里拿出二块大小一样的冰块再拿两个盘子,然后:将一
2019-01-24
艾小月
《如何让你爱的人爱上你》读后感黄色的封面、新颖的书名、引人入胜的内容给与了读者极大的精神享受。本书提供了一些求偶时可以努力的方向和有意思的技能,来帮到大家找到相伴一生的爱人。白娘子白素贞的扮演者,被称为冻龄女神的赵雅芝曾向记者透露自己婚姻幸福的秘诀:永远向对方展现自己最好的一面,将老公当成自己的男朋友那般相处,即便已经携手步入婚姻殿堂,也要像谈恋爱时那样精心打扮自己,并时刻保持神秘感。本书指出人们
mysql atm项目代码_JavaGUI编程——ATM项目包含源码和程序使用说明
weixin_39832965
mysql atm项目代码
2019-01-24本程序由java编写,包含了数据库,GUI等知识。压缩文件中有程序源码,数据库文件,程序使用说明。程序主要代码如下:/**接口*/publicResultSetSelect(Stringx);//查询publicvoidwithDrawal(floatx);//取款publicvoidRemove(Stringx,floaty);//转账publicvoidInsert(flo
2019-01-24
梦碎南墙
今天是2019年1月24日,今天甚是开心。为什么呢。因为今天解决了我2019年的两大障碍(目标)。第一个是,做了一年半的管理师生缘美食城的项目,终于在今天尘归尘土归土。这一年半,在这个项目上挣的钱不足一万。很多次已经跟合伙人提及,也庆幸在这个2019年年初解决了这个我自认为的麻烦。第二个是今天报名成功了广西民族大学的工商企业管理自考本科(又说专本衔接),已交第一年的学费,了解到是每一科考试费80o
2019-01-24
碧海蓝天_b718
日记今天,梁传奇他们没来,可能是没吃完饭吧。女孩要懂的道理:吃苦头不是逻辑后果需要的条件。例如,一个孩子可能很喜欢清理自己的课桌。(这很好,因为逻辑后果的目的是为了停止不良行为并找到解决方法,而不是为了报复而给孩子造成痛苦)。因此,逻辑后果的另一个名称是转移孩子的行为。今天,有点无聊,希望快点到春天,我就可以穿卫衣出去嘚思,O(∩_∩)O哈哈~
2019-01-24
记忆悠悠
连接词是文章通顺的灵魂。我们常被要求写文章要通顺,其实通顺是具体建立在逻辑连接词上,因为所谓通顺就是指每则信息之间的前后关系,文章通不通顺,全在于你是否能将每则信息之间的前后关系明了的传达给对方。逻辑衔接,减轻接收者的负担。不管在哪一层级都会和其他信息互相产生关系,这些关系都要靠逻辑连接词来表达,思考如何加入逻辑衔接的过程本身就是一种逻辑思考。总而言之,逻辑表现力的基本要求,就是尽量不要造成接收者
2019-01-24
rabbit__cat
寻求安逸的欲望阻碍了每颗伟大而高贵的进取心今天看了蒂姆·波顿的电影《大鱼》,亲情故事交织着童话般的场景,很炫目,也很感人。影片里,父亲为儿子讲述了一个个自己年轻时期的冒险经历,都多多少少带着些奇幻的想象。其中一个故事,令我颇有感触。那时候父亲刚刚成年,生活在一个小镇子。但他总觉得这里容不下他的雄心壮志,于是踏上了去往大城市的旅程。路上,他发现了一条小路,破败不堪,不知通往何处。天生爱冒险的他走上了
2019-01-24
尊道贵德Layla
江城子(苏轼)玉人家在凤凰山②,水云间、掩门闲③。门外行人、立马看弓弯④。十里春风谁指似,斜日映,绣帘斑⑤。多情好事与君还,闵新鳏,拭余潸⑥。明月空江、香雾著云鬟⑦。陌上花开春尽也,闻旧曲⑧,破朱颜。注释②玉人:美女,指陈直方的新妾。凤凰山:在杭州市区南。③门闲:《周礼·夏官·虎贲氏》:“舍则守王闲。是古代官府前防止行人乱入的木制障碍物。④弓弯:舞名。(72/100)
2019-01-24
私享者2021
晚上一顿分岁酒吃完,即将结束忙碌的一年工作,还没静下心来回顾自己一年来的工作,或是生活中的点点滴滴。现在脑中有点意识到一些寄托于今后想完成的事情,如果现在还不行动,以后想去实现还是有些不现实的。人只有经历些事情才会成长,也有一种成长叫做等待某年某月自然会成功的梦破灭而成熟。
2019-01-24
易贝源
易贝源老师告诉你:后天如何辅助孩子长高?孩子长得高总体来说还是比较有优势的,在与那么多宝妈的交流中,老师感觉得到几乎每一位家长都希望自己的孩子能长得高高的,这样起码看着很棒,当然孩子的身高除了与遗传因素有关之外,还与后天因素有很大的关系,因此即使父母双方身高不理想,也不能放任孩子不管,很多的家长都表达过对孩子身高的担忧,老师为了宽慰一些家长,所以就提出几条后天比较有利于孩子身高发展的建议,希望能帮
2019-01-24 14.1统计函数(Subtotal)
星语西瓜
14.1统计函数(Subtotal)[if!supportLists]·[endif]一、基本用法[if!supportLists]·[endif]显示公式说明[if!supportLists]·[endif]=SUBTOTAL(1,B2:B8)平均值[if!supportLists]·[endif]=SUBTOTAL(2,B2:B8)统计个数[if!supportLists]·[endif]=S
ztree异步加载
3213213333332132
JavaScript Ajax json Web ztree
相信新手用ztree的时候,对异步加载会有些困惑,我开始的时候也是看了API花了些时间才搞定了异步加载,在这里分享给大家。
我后台代码生成的是json格式的数据,数据大家按各自的需求生成,这里只给出前端的代码。
设置setting,这里只关注async属性的配置
var setting = {
//异步加载配置
thirft rpc 具体调用流程
BlueSkator
中间件 rpc thrift
Thrift调用过程中,Thrift客户端和服务器之间主要用到传输层类、协议层类和处理类三个主要的核心类,这三个类的相互协作共同完成rpc的整个调用过程。在调用过程中将按照以下顺序进行协同工作:
(1) 将客户端程序调用的函数名和参数传递给协议层(TProtocol),协议
异或运算推导, 交换数据
dcj3sjt126com
PHP 异或 ^
/*
* 5 0101
* 9 1010
*
* 5 ^ 5
* 0101
* 0101
* -----
* 0000
* 得出第一个规律: 相同的数进行异或, 结果是0
*
* 9 ^ 5 ^ 6
* 1010
* 0101
* ----
* 1111
*
* 1111
* 0110
* ----
* 1001
事件源对象
周华华
JavaScript
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml&q
MySql配置及相关命令
g21121
mysql
MySQL安装完毕后我们需要对它进行一些设置及性能优化,主要包括字符集设置,启动设置,连接优化,表优化,分区优化等等。
一 修改MySQL密码及用户
 
[简单]poi删除excel 2007超链接
53873039oycg
Excel
采用解析sheet.xml方式删除超链接,缺点是要打开文件2次,代码如下:
public void removeExcel2007AllHyperLink(String filePath) throws Exception {
OPCPackage ocPkg = OPCPac
Struts2添加 open flash chart
云端月影
准备以下开源项目:
1. Struts 2.1.6
2. Open Flash Chart 2 Version 2 Lug Wyrm Charmer (28th, July 2009)
3. jofc2,这东西不知道是没做好还是什么意思,好像和ofc2不怎么匹配,最好下源码,有什么问题直接改。
4. log4j
用eclipse新建动态网站,取名OFC2Demo,将Struts2 l
spring包详解
aijuans
spring
下载的spring包中文件及各种包众多,在项目中往往只有部分是我们必须的,如果不清楚什么时候需要什么包的话,看看下面就知道了。 aspectj目录下是在Spring框架下使用aspectj的源代码和测试程序文件。Aspectj是java最早的提供AOP的应用框架。 dist 目录下是Spring 的发布包,关于发布包下面会详细进行说明。 docs&nb
网站推广之seo概念
antonyup_2006
算法 Web 应用服务器 搜索引擎 Google
持续开发一年多的b2c网站终于在08年10月23日上线了。作为开发人员的我在修改bug的同时,准备了解下网站的推广分析策略。
所谓网站推广,目的在于让尽可能多的潜在用户了解并访问网站,通过网站获得有关产品和服务等信息,为最终形成购买决策提供支持。
网站推广策略有很多,seo,email,adv
单例模式,sql注入,序列
百合不是茶
单例模式 序列 sql注入 预编译
序列在前面写过有关的博客,也有过总结,但是今天在做一个JDBC操作数据库的相关内容时 需要使用序列创建一个自增长的字段 居然不会了,所以将序列写在本篇的前面
1,序列是一个保存数据连续的增长的一种方式;
序列的创建;
CREATE SEQUENCE seq_pro
2 INCREMENT BY 1 -- 每次加几个
3
Mockito单元测试实例
bijian1013
单元测试 mockito
Mockito单元测试实例:
public class SettingServiceTest {
private List<PersonDTO> personList = new ArrayList<PersonDTO>();
@InjectMocks
private SettingPojoService settin
精通Oracle10编程SQL(9)使用游标
bijian1013
oracle 数据库 plsql
/*
*使用游标
*/
--显示游标
--在显式游标中使用FETCH...INTO语句
DECLARE
CURSOR emp_cursor is
select ename,sal from emp where deptno=1;
v_ename emp.ename%TYPE;
v_sal emp.sal%TYPE;
begin
ope
【Java语言】动态代理
bit1129
java语言
JDK接口动态代理
JDK自带的动态代理通过动态的根据接口生成字节码(实现接口的一个具体类)的方式,为接口的实现类提供代理。被代理的对象和代理对象通过InvocationHandler建立关联
package com.tom;
import com.tom.model.User;
import com.tom.service.IUserService;
Java通信之URL通信基础
白糖_
java jdk webservice 网络协议 ITeye
java对网络通信以及提供了比较全面的jdk支持,java.net包能让程序员直接在程序中实现网络通信。
在技术日新月异的现在,我们能通过很多方式实现数据通信,比如webservice、url通信、socket通信等等,今天简单介绍下URL通信。
学习准备:建议首先学习java的IO基础知识
URL是统一资源定位器的简写,URL可以访问Internet和www,可以通过url
博弈Java讲义 - Java线程同步 (1)
boyitech
java 多线程 同步 锁
在并发编程中经常会碰到多个执行线程共享资源的问题。例如多个线程同时读写文件,共用数据库连接,全局的计数器等。如果不处理好多线程之间的同步问题很容易引起状态不一致或者其他的错误。
同步不仅可以阻止一个线程看到对象处于不一致的状态,它还可以保证进入同步方法或者块的每个线程,都看到由同一锁保护的之前所有的修改结果。处理同步的关键就是要正确的识别临界条件(cri
java-给定字符串,删除开始和结尾处的空格,并将中间的多个连续的空格合并成一个。
bylijinnan
java
public class DeleteExtraSpace {
/**
* 题目:给定字符串,删除开始和结尾处的空格,并将中间的多个连续的空格合并成一个。
* 方法1.用已有的String类的trim和replaceAll方法
* 方法2.全部用正则表达式,这个我不熟
* 方法3.“重新发明轮子”,从头遍历一次
*/
public static v
An error has occurred.See the log file错误解决!
Kai_Ge
MyEclipse
今天早上打开MyEclipse时,自动关闭!弹出An error has occurred.See the log file错误提示!
很郁闷昨天启动和关闭还好着!!!打开几次依然报此错误,确定不是眼花了!
打开日志文件!找到当日错误文件内容:
--------------------------------------------------------------------------
[矿业与工业]修建一个空间矿床开采站要多少钱?
comsci
地球上的钛金属矿藏已经接近枯竭...........
我们在冥王星的一颗卫星上面发现一些具有开采价值的矿床.....
那么,现在要编制一个预算,提交给财政部门..
解析Google Map Routes
dai_lm
google api
为了获得从A点到B点的路劲,经常会使用Google提供的API,例如
[url]
http://maps.googleapis.com/maps/api/directions/json?origin=40.7144,-74.0060&destination=47.6063,-122.3204&sensor=false
[/url]
从返回的结果上,大致可以了解应该怎么走,但
SQL还有多少“理所应当”?
datamachine
sql
转贴存档,原帖地址:http://blog.chinaunix.net/uid-29242841-id-3968998.html、http://blog.chinaunix.net/uid-29242841-id-3971046.html!
------------------------------------华丽的分割线--------------------------------
Yii使用Ajax验证时,如何设置某些字段不需要验证
dcj3sjt126com
Ajax yii
经常像你注册页面,你可能非常希望只需要Ajax去验证用户名和Email,而不需要使用Ajax再去验证密码,默认如果你使用Yii 内置的ajax验证Form,例如:
$form=$this->beginWidget('CActiveForm', array( 'id'=>'usuario-form',&
使用git同步网站代码
dcj3sjt126com
crontab git
转自:http://ued.ctrip.com/blog/?p=3646?tn=gongxinjun.com
管理一网站,最开始使用的虚拟空间,采用提供商支持的ftp上传网站文件,后换用vps,vps可以自己搭建ftp的,但是懒得搞,直接使用scp传输文件到服务器,现在需要更新文件到服务器,使用scp真的很烦。发现本人就职的公司,采用的git+rsync的方式来管理、同步代码,遂
sql基本操作
蕃薯耀
sql sql基本操作 sql常用操作
sql基本操作
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
蕃薯耀 2015年6月1日 17:30:33 星期一
&
Spring4+Hibernate4+Atomikos3.3多数据源事务管理
hanqunfeng
Hibernate4
Spring3+后不再对JTOM提供支持,所以可以改用Atomikos管理多数据源事务。Spring2.5+Hibernate3+JTOM参考:http://hanqunfeng.iteye.com/blog/1554251Atomikos官网网站:http://www.atomikos.com/ 一.pom.xml
<dependency>
<
jquery中两个值得注意的方法one()和trigger()方法
jackyrong
trigger
在jquery中,有两个值得注意但容易忽视的方法,分别是one()方法和trigger()方法,这是从国内作者<<jquery权威指南》一书中看到不错的介绍
1) one方法
one方法的功能是让所选定的元素绑定一个仅触发一次的处理函数,格式为
one(type,${data},fn)
&nb
拿工资不仅仅是让你写代码的
lampcy
工作 面试 咨询
这是我对团队每个新进员工说的第一件事情。这句话的意思是,我并不关心你是如何快速完成任务的,哪怕代码很差,只要它像救生艇通气门一样管用就行。这句话也是我最喜欢的座右铭之一。
这个说法其实很合理:我们的工作是思考客户提出的问题,然后制定解决方案。思考第一,代码第二,公司请我们的最终目的不是写代码,而是想出解决方案。
话粗理不粗。
付你薪水不是让你来思考的,也不是让你来写代码的,你的目的是交付产品
架构师之对象操作----------对象的效率复制和判断是否全为空
nannan408
架构师
1.前言。
如题。
2.代码。
(1)对象的复制,比spring的beanCopier在大并发下效率要高,利用net.sf.cglib.beans.BeanCopier
Src src=new Src();
BeanCopier beanCopier = BeanCopier.create(Src.class, Des.class, false);
ajax 被缓存的解决方案
Rainbow702
JavaScript jquery Ajax cache 缓存
使用jquery的ajax来发送请求进行局部刷新画面,各位可能都做过。
今天碰到一个奇怪的现象,就是,同一个ajax请求,在chrome中,不论发送多少次,都可以发送至服务器端,而不会被缓存。但是,换成在IE下的时候,发现,同一个ajax请求,会发生被缓存的情况,只有第一次才会被发送至服务器端,之后的不会再被发送。郁闷。
解决方法如下:
① 直接使用 JQuery提供的 “cache”参数,
修改date.toLocaleString()的警告
tntxia
String
我们在写程序的时候,经常要查看时间,所以我们经常会用到date.toLocaleString(),但是date.toLocaleString()是一个过时 的API,代替的方法如下:
package com.tntxia.htmlmaker.util;
import java.text.SimpleDateFormat;
import java.util.
项目完成后的小总结
xiaomiya
js 总结 项目
项目完成了,突然想做个总结但是有点无从下手了。
做之前对于客户端给的接口很模式。然而定义好了格式要求就如此的愉快了。
先说说项目主要实现的功能吧
1,按键精灵
2,获取行情数据
3,各种input输入条件判断
4,发送数据(有json格式和string格式)
5,获取预警条件列表和预警结果列表,
6,排序,
7,预警结果分页获取
8,导出文件(excel,text等)
9,修