拷贝也是面试经典呐! 数组的浅拷贝 如果是数组,我们可以利用数组的一些方法比如:slice.concat 返回一个新数组的特性来实现拷贝. 比如:   var arr = ['old', 1, true, null, undefined]; var new_arr = arr.concat(); new_arr[0] = 'new'; console.log(arr) // ["old", 1, true, null, undefined] console.log(new_arr) /…

× 目录 [1]运动轨迹 [2]拖拽轨迹 [3]投掷 前面的话 一般地,不同的运动形式会产生不同的轨迹.但仅凭肉眼去识别运动轨迹,其实并不是很直观.因此,在页面中显示运动轨迹,是一个重要的问题.物体初始态时,受到外力大小不同,则初速度不同.如何在网页中模拟投掷效果,也需要解决.接下来,将详细介绍轨迹和投掷 运动轨迹 元素在运动过程中,不同的运动形式会产生不同的轨迹.如果不把轨迹表示出来,我们只能通过肉眼来区分运动形式.表示轨迹通常有两种方式:创建小元素和使用canvas 创建小元素 创建小元素原…

× 目录 [1]原型继承 [2]伪类继承 [3]组合继承 前面的话 学习如何创建对象是理解面向对象编程的第一步,第二步是理解继承.本文是javascript面向对象系列第三篇——实现继承的3种形式 [1]原型链 javascript使用原型链作为实现继承的主要方法,实现的本质是重写原型对象,代之以一个新类型的实例 function Super(){ this.value = true; } Super.prototype.getValue = function(){ return this.va…

× 目录 [1]属性 [2]方法 前面的话 函数是javascript中的特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本文是深入理解javascript函数系列第三篇——属性和方法 属性 [length属性] 函数系列第二篇中介绍过,arguments对象的length属性表示实参个数,而函数的length属性则表示形参个数 function add(x,y){ console.log(arguments.lengt…

× 目录 [1]let [2]const [3]try 前面的话 尽管函数作用域是最常见的作用域单元,也是现行大多数javascript最普遍的设计方法,但其他类型的作用域单元也是存在的,并且通过使用其他类型的作用域单元甚至可以实现维护起来更加优秀.简洁的代码,比如块作用域.随着ES6的推广,块作用域也将用得越来越广泛.本文是深入理解javascript作用域系列第四篇——块作用域 let for (var i= 0; i<10; i++) { console.log(i); } 上面这段是很熟…

× 目录 [1]变量 [2]函数 [3]优先 前面的话 一般认为,javascript代码在执行时是由上到下一行一行执行的.但实际上这并不完全正确,主要是因为声明提升的存在.本文是深入理解javascript作用域系列第三篇——声明提升(hoisting) 变量声明提升 a = 2 ; var a; console.log( a ); 直觉上,会认为是undefined,因为var a声明在a = 2;之后,可能变量被重新赋值了,因为会被赋予默认值undefined.但是,真正的输出结果是2 c…

前面的话 一般认为,javascript代码在执行时是由上到下一行一行执行的.但实际上这并不完全正确,主要是因为声明提升的存在.本文是深入理解javascript作用域系列第三篇——声明提升(hoisting) 变量声明提升 a = 2 ; var a; console.log( a ); 直觉上,会认为是undefined,因为var a声明在a = 2;之后,可能变量被重新赋值了,因为会被赋予默认值undefined.但是,真正的输出结果是2 console.log( a ) ; var a…

前面的话 尽管函数作用域是最常见的作用域单元,也是现行大多数javascript最普遍的设计方法,但其他类型的作用域单元也是存在的,并且通过使用其他类型的作用域单元甚至可以实现维护起来更加优秀.简洁的代码,比如块作用域.随着ES6的推广,块作用域也将用得越来越广泛.本文是深入理解javascript作用域系列第四篇——块作用域 let for (var i= 0; i<10; i++) { console.log(i); } 上面这段是很熟悉的循环代码,通常是因为只想在for循环内部的上下文中使…

前面的话 函数是javascript中特殊的对象,可以拥有属性和方法,就像普通的对象拥有属性和方法一样.甚至可以用Function()构造函数来创建新的函数对象.本文是深入理解javascript函数系列第三篇——属性和方法 属性 [length属性] 函数系列第二篇中介绍过,arguments对象的length属性表示实参个数,而函数的length属性则表示形参个数 function add(x,y){ console.log(arguments.length)//3 console.log(…

[JavaScript数据结构系列]00-开篇 码路工人 CoderMonkey 转载请注明作者与出处 ## 0. 开篇[JavaScript数据结构与算法] 大的计划,写以下两部分: 1[JavaScript数据结构系列] 2[JavaScript算法系列] 1.[JavaScript数据结构系列] 大家都知道,学习编程,基础很重要.数据结构,就是很其中重要的一项. 本系列是个人在学习过程中的记录总结实践分享,也希望对想要学习这方面的你,有所助益. 大白话模式开扯. 1.1 什么是数据结构 D…

最近在看<冴羽的博客>,讲真,确实受益匪浅,已经看了javascript 深入系列和专题系列的大部分文章,可是现在才想起来做笔记.所以虽然很多以前面试被问得一脸懵逼的问题都被“一语惊醒梦中人”过,注意这里我说的是“过”.是的,这些知道点,当时看的时候跟着大佬的思维,确实当时感觉“哦~ 原来是这样”,但是,看了下篇把上篇的知识忘了还是让我感觉自己太挫了. 于是,决定写点笔记来加深一点印象吧! 今天看到了“javascript专题之递归” (https://github.com/mqyqingfe…

太久没有更新了,新年回来工作,突然有收到网友的邮件提问,居然还有人在关注,惭愧,找了下电脑上还有一点儿存着,顺便先发这一个番外篇吧,好歹可以看到真实的效果,等我考完英语,一定会更新下一章,"愤怒的小鸟篇" 此篇,并不是书中的篇符,而是通过希望通过结合实际的canvas 绘图库实现box2d物理引擎在各绘图库上应用,绘图库网上有很多现成的 如:createjs, pixi.js 等,Egret或者其它游戏引擎有自己的物理引擎扩展库,所以就不说了. 现在通过之前的学习,基本掌握了刚体等基础…

乱序的意思想必没有不知道:就是将数组打乱. 听到乱序一般都会想到js的随机函数Math.random(); var values = [1, 2, 3, 4, 5]; values.sort(function() { return Math.random() - 0.5; }); console.log(values) 利用数组的sort方法,判断随机出来的0~1值与0.5的大小,实现排序. 看似一个很不错的方案,代码逻辑也没毛病,一般情况下也确实能够做到乱序.但是,这是一个伪排序,是的还有但是…

JavaScript 初级篇 [JS]120-重温基础:语法和数据类型 [JS]121-重温基础:流程控制和错误处理 [JS]122-重温基础:循环和迭代 [JS]123-重温基础:函数 [JS]124-重温基础:表达式和运算符 [JS]125-重温基础:数字 [JS]126-重温基础:时间对象 [JS]127-重温基础:字符串 [JS]128-重温基础:正则表达式 [JS]129-重温基础:数组 [JS]130-重温基础:Map和Set对象 [JS]131-重温基础:使用对象 [JS]132-…

上一篇我们学习了解了如何使用Windows GDI画图,该应用程序都是光光的静态窗口,我们使用Windows应用程序,但凡稍微复杂一点的程序都会有工具栏和状态栏,工具栏主要用于一些快捷功能按钮.比如典型的windows应用程序的上面是菜单栏,从菜单栏我们可以选择应用程序提供的各种功能,但是有的功能比较常用,且不能放在第一级菜单,需要进入二级.三级甚至更多的菜单才能选择.显然这样使用起来比较麻烦,于是这时候工具栏的作用就体现出来了,一般工具栏位于菜单栏的下面,但是位于客户窗口的上面.下面就是win…

前面的话 面向对象的应用并非只是读几本书那么容易,需要有大量的工程实践做基础才能真正理解并学会使用它.本文将用面向对象的技术来制作一个简单的选项卡 图示说明 由图示结果看到,这是一个非常简单的选项卡.三个控制按钮利用点击事件分别控制三张不同的选项卡.选项卡用文字和背景颜色区分,控制按钮用轮廓outline区分 HTML代码 [1]使用行间样式来引入CSS的扩展性不高,需要根据实际情况谨慎使用 [2]在a标签中使用javascript:;来阻止默认的页面跳转行为 [3]给最外层div元素设置id属…

× 目录 [1]图示 [2]概念 [3]说明[4]总结 前面的话 对于执行环境(execution context)和作用域(scope)并不容易区分,甚至很多人认为它们就是一回事,只是高程和犀牛书关于作用域的两种不同翻译而已.但实际上,它们并不相同,却相互纠缠在一起.本文先用一张图开宗明义,然后进行术语的简单解释,最后根据图示内容进行详细说明 图示 查看大图 概念 [作用域] 作用域是一套规则,用于确定在何处以及如何查找标识符.关于LHS查询和RHS查询详见作用域系列第一篇内部原理. 作用域分…

前面的话 对于执行环境(execution context)和作用域(scope)并不容易区分,甚至很多人认为它们就是一回事,只是高程和犀牛书关于作用域的两种不同翻译而已.但实际上,它们并不相同,却相互纠缠在一起.本文先用一张图开宗明义,然后进行术语的简单解释,最后根据图示内容进行详细说明 图示 查看大图 概念 [作用域] 作用域是一套规则,用于确定在何处以及如何查找标识符.关于LHS查询和RHS查询详见作用域系列第一篇内部原理. 作用域分为词法作用域和动态作用域.javascript使用词法作…

一.概述 (一)函数的声明 JavaScript 有三种声明函数的方法. (1)function 命令 function命令声明的代码区块,就是一个函数.function命令后面是函数名,函数名后面是一对圆括号,里面是传入函数的参数.函数体放在大括号里面. function print(s) { console.log(s); } 上面的代码命名了一个print函数,以后使用print()这种形式,就可以调用相应的代码.这叫做函数的声明(Function Declaration). (2)函数表…

前面的话 前面分别介绍了拖拽模拟和磁性吸附,当可视区域内存在多个可拖拽元素,就出现碰撞检测的问题,这也是javascript动画的一个经典问题.本篇将详细介绍碰撞检测 原理介绍 碰撞检测的方法有很多,接下来使用九宫格分析法 假设黄色元素要与红色元素进行碰撞.将红色元素所处的区域分为9部分,自身处于第9部分,周围还存在8个部分.只要黄色元素进入红色元素的第9部分,就算碰撞.否则,都算未碰撞 总共分为以下5种情况: 1.处于上侧未碰撞区域——1.2.3区域 2.处于右侧未碰撞区域——3.4.5区域…

× 目录 [1]动态样式 [2]CSS类[3]setAttribute()[4]CSSRule对象添加[5]空样式覆盖[6]CSSRule对象删除 前面的话 我们可以通过计算样式来读取伪元素的样式信息,但是却无法使用javascript来直接操作伪元素,本文以一个需求解决为例,详细介绍脚本化伪元素的6种方法 需求说明 [1]为id=box的div元素添加content="前缀"的:before伪元素 [2]为已经添加:before伪元素的div元素删除伪元素  [注意]由于IE7-浏览…

最近在写一些关于java基础的文章,但是我又不想按照教科书的方式去写知识点的文章,因为意义不大.基础知识太多了,如何将这些知识归纳总结,总结出优缺点或者是使用场景才是对知识的升华.所以我更想把java相关的基础知识进行穿针引线,进行整体上的总结. 总结java中创建并写文件的5种方式 总结java从文件中读取数据的6种方法 总结java创建文件夹的4种方法及其优缺点 总结java中删除文件或文件夹的7种方法 总结java中文件拷贝剪切的5种方式 比如之前我已经写了上面的这些内容,如果对java基…

× 目录 [1]匀速碰壁 [2]自由落体 [3]投掷碰壁[4]拖拽碰壁 前面的话 碰撞运动可能是运动系列里面比较复杂的运动了.碰撞可以分为碰壁和互碰两种形式,而碰撞前后的运动形式也可以分为变速和匀速两种,如果再涉及到阻力,具有速度损耗的话,就更加复杂了.本文先介绍碰壁运动 匀速碰壁 碰壁是一种常见的碰撞形式,匀速碰壁是最简单的碰撞运动 假设一个密闭空间内一个弹性小球,小球有一个随机方向随机大小的初始速度.当小球碰壁时,速度不损失,而是做反向的匀速运动 <!DOCTYPE html> <h…

× 目录 [1]原理介绍 [2]代码实现 [3]实例应用 前面的话 在运动系列中,前面分别介绍了匀速运动.变速运动和曲线运动.下面介绍一种特殊的运动形式——抖动 原理介绍 抖动其实是往复运动的一种特殊形式,只不过往复运动是一种无摩擦力的无限运动,且以速度为参照依据:而抖动以位置作为参照依据,最终停在起始点 在网页中最常见的一种抖动效果应该是窗口抖动提示了 抖动元素从起始点开始,先向右移动最大距离len,然后移动到对称的左边位置:然后再向右移动稍微小一点的距离,再移动到对称的左边位置:以此循环,最…

× 目录 [1]圆周运动[2]三维圆周 [3]钟摆运动 [4]抛物线[5]流体运动 前面的话 上一篇介绍了变速运动,但只实现了直线运动.如果元素的left和top同时运动,并遵循不同的曲线公式,则会进行不同形式的曲线运动.本文将详细介绍圆周运动.钟摆运动和抛物线运动这三种曲线运动形式 圆周运动 圆周运动可能是最好理解的曲线运动了 若(x0,y0)为圆心,则圆的公式为(x-x0)*(x-x0) + (y-y0)*(y-y0) = r*r 写成三角函数的形式为 x = x0 + cosa*r y =…

× 目录 [1]焦点状态 [2]哈希状态 [3]动画状态[4]显隐状态 前面的话 过滤选择器的内容非常多,本文介绍过滤选择器的最后一部分——状态选择器 焦点状态 :focus :focus选择器选择当前获得焦点的元素 <div> <button>btn1</button> <button>btn2</button> <button>btn3</button> </div> <script> docu…

× 目录 [1]类型 [2]方法 [3]详述[4]状态 前面的话 对于操作系统中的文件,我们可以驾轻就熟将其设置为只读.隐藏.系统文件或普通文件.于对象来说,属性描述符提供类似的功能,用来描述对象的值.是否可配置.是否可修改以及是否可枚举.本文就来介绍对象中神秘的属性描述符 描述符类型 对象属性描述符的类型分为两种: 数据属性和访问器属性 数据属性 数据属性(data property)包含一个数据值的位置,在这个位置可以读取和写入值.数据属性有4个特性 [1]Configurable(可配置性…

前面的话 提到加载事件,可能想到了window.onload,但实际上,加载事件是一大类事件,本文将详细介绍加载事件 load load事件是最常用的一个事件,当页面完全加载后(包括所有图像.javascript文件.CSS文件等外部资源),就会触发window上的load事件 [注意]IE8-浏览器不会为该事件设置srcElement属性,而其他浏览器的target属性指向document window.onload = function(e){ e = e || event; var tar…

使用索引可以大大提高文档的查询效率.如果没有索引,会遍历集合中所有文档,才能找到匹配查询语句的文档.这样遍历集合中整个文档的方式是非常耗时的,特别是处理大数据时,耗时几十秒甚至几分钟都是有可能的. 创建索引 MongoDB 中,使用 ensureIndex() 方法创建索引. 格式 db.COLLECTION_NAME.ensureIndex({KEY:1}) 其中,KEY表示要创建索引的字段名称,1 表示按升序排列字段值.-1 表示按降序排列. 范例 1.给 user 集合中 name 字段添…

最近看了一些kettle的文章,都是kettle7.0以前的,已经跟不上时代了.截止笔者写这篇文章的时候,github上面的已经是7.1.0.3了,而且是发行版的,最新的快照版本已经是8.0的了.基于此,有必要写一篇关于7.1之后的版本的kettle说明了. 特别说明,我用的项目的构建工具是maven,而不是ant了,如果想用ant的童鞋可以用一下maven的插件maven-antrun-plugins,还是比较好用的. 好了,开始吧! 第一步:下载源码. 源码地址在github上面:https…