关注
分享
文章平均质量分 96
作为一个热爱计算机专业的小白，当然不能局限于大学课堂上老师教的内容，热爱踏入学习之门，热爱学习新的知识是小白最感兴趣的事情了，这个专栏主要是记叙了我自己学习前端中JavaScript的一些基础知识和笔记，同样自己也是第一次接触博客，如有不好，请指出
c-Tomorrow
如果你能力撑不起野心的时候，那么就应该静下心来好好学习了。
展开
-
JavaScript简单拖拽
说到交互，基本上是在JavaScript语言中占据了大分量，JavaScript行为 为页面增添了光彩，而现在大多数网站都是运用交互式的，拖拽在交互这个大系统中也是很有重量的。 把一个东西放在大盒子里移动拖拽，计算拖拽公式是非常重要的，基本上明白了拖拽公式就可以写出拖拽代码了。 假设我们把物体1 拖拽到物体2 的地方，此刻可以知道拖拽的步骤...原创 2018-03-30 22:43:13 · 318 阅读 · 0 评论 -
JavaScript原生运动框架
在网页交互过程中，运动是比不可少的，每次交互产生运动的时候，都要写一次关于这次运动的代码，显然很麻烦，封装运动框架能让代码的可读性增强很多。 匀速运动 匀速运动就是让dom元素匀速的进行某一个动作（位置，大小等）。var timer = null;function anmite(dom,target){ var speed; if(dom.offset...原创 2018-05-19 13:19:11 · 391 阅读 · 0 评论 -
JavaScript之ES3.0模拟map和reduce
我们知道浏览器的发展是相对快速的，当然浏览器的不断更新同样面临着前端的更新，在我们前端编程中由于用户所用浏览器的不同，我们是必须要做兼容性处理的，有些浏览器的版本比较低，一些前端语言不兼容，做方法的兼容性处理衡很好的避免Bug的出现。 ES3.0实现数组map方法var map = Array.prototype.map ? function(a,f){ retur...原创 2018-03-28 20:43:16 · 569 阅读 · 0 评论 -
JavaScript之高阶函数详解
最近在狂刷JavaScript权威指南（第六版），看到高阶函数这里。高阶函数在稍微大一点的项目里也是很常用的。 所谓高阶函数就是以一个函数作为参数传入高阶函数里面经过一些算法再返回一个函数，精准的利用了闭包的特性--私有化变量，防止污染全局。 看例子吧 function not(f){ return function(){ var args ...原创 2018-03-28 21:17:22 · 318 阅读 · 0 评论 -
JavaScript之函数式编程不完全函数
不完全函数编程是一种函数编程技巧，即把一次完整的函数调用拆成多次函数调用，每次传入的参数都是完成参数的一部分，每次才分开的函数就叫做不完全函数。每次函数调用就叫做不完全调用。 特点： 每次调用都返回一个函数，知道调用最终位置。 在函数式编程中ES3.0模拟bind的方法就是一个很好的例子。先看代码。Function.prototype.newBind(t...原创 2018-03-29 00:08:22 · 367 阅读 · 0 评论 -
JavaScript之函数式编程思想-纯函数
在任何一个语言中都避免不了Bug的存在。我们只能用一系列编程的思想尽量避免Bug的产生。 Bug守恒定律 当我们在开发网站的时候，一旦网站的应用代码量达到一定程度的时候，它将不可避免的包含某种Bug，这个东西并不是JavaScript特有的，而是几乎所有的语言都有的通病--虽然不是不可能，想要彻底清除代码中的Bug是非常难办到的，但是，这并不意味着我们不...原创 2018-03-29 00:41:39 · 768 阅读 · 0 评论 -
JavaScript之函数式编程思想--函数记忆
函数记忆编程是一种编程思想，主要是解决当我们在编程过程中有些部分或者有些功能是重叠的，可以利用记忆函数来把重叠的部分记录下来。 典型的例子就是阶乘和斐波那契数列了。这里我们用数组来示范一下。var content = 0；function jiece(n) content ++; if(n == 0 || n == 1){ return...原创 2018-03-29 01:05:58 · 677 阅读 · 2 评论 -
JavaScript之bind及bind的模拟实现
在JavaScript编程中有很多改变this的方法和方式，今天说的bind与众不同，像call、apply改变this指向的时候会直接执行。而bind则不是，话不多说，直接进入正题。 bind bind是函数原型上的一个方法，作用是改变this指向并且返回一个函数等待被执行。Function.prototype.bind() bind()...原创 2018-03-23 23:49:38 · 2289 阅读 · 1 评论 -
JavaScript之再谈数组之数组方法、ES5方法
稀疏数组 在数组中有那个一种形式：忽略索引，显示长度。这种形式就是稀疏数组。 稀疏数组定义方法是：两种方式，var a = new Array(5);console.log(a.length);console.log(a);var arr = [];arr[1000] = 0;console.log(arr); 数组方法 ...原创 2018-03-18 23:46:48 · 301 阅读 · 0 评论 -
JavaScript之再谈对象之枚举对象的工具函数
在JavaScript中，由于JavaScript的弱类型特征，使得JavaScript变的更加灵活，同样JavaScript中对象也是如此。var o = { name : "wang", age : 20,}var p = { name : "zhou", age1 : 21,} 以上两个函数为例。 把p中的可枚举属性复制到o中，并返回o，如果...原创 2018-03-14 23:33:36 · 242 阅读 · 0 评论 -
JavaScript之再谈对象之getter、setter存取器
在JavaScript对象中，有两种属性getter、setter。 getter 和 setter是一种存取器，也可以说成是对象定义属性是读写属性的方法，getter定义可读属性，setter定义可写属性，读取只写属性总是返回undefined。 var obj = { x : 1, get getX(){ return this.x; }, set...原创 2018-03-15 00:15:50 · 234 阅读 · 0 评论 -
JavaScript之再谈对象之属性的特性
在各种语言中对象的属性都有很对特性，JavaScript也不例外。 对象属性中除了名字和值外，还有一些标识着它们可写，可枚举，可配置的特性，存取器也是可以看成属性的特性的。 一般属性有一个名称，四个特性分别是：值（value），可写性（writable），可枚举性（enumerable），可配置性（configurable）。 存取器不具有...原创 2018-03-15 00:30:30 · 175 阅读 · 0 评论 -
JavaScript之eval用法
在JavaScript史中，出现过这样一个方法，这个方法可以修改变量环境进行代码执行，这个方法就是eval()。 eval() 这个函数只有一个参数，当传入的参数不是字符串的时候，则返回这个参数。当传入的参数是字符串的时候，则它会把这个字符串当做js代码来执行，当然传入的字符串在语法上必须得讲得通的。 eval最重要的是调用了它的变量作...原创 2018-03-12 19:44:09 · 1025 阅读 · 0 评论 -
JavaScript之运算符表及含义
在js里面运算符占有着重要的意思，今天在一本书上看到了运算符全解，特来分享一下。来自JavaScript权威指南第六版，喜欢就收藏吧--主页传送门--...原创 2018-03-11 20:59:28 · 336 阅读 · 0 评论 -
JavaScript之正则表达式精解
在所有的语言中基本上都有一个通用的东西，那就是正则表达式了，正则表达式定义了字符串的组成规则，使得匹配环节更加灵活。同样，在前端领域中，我们知道处理数据源的终端在前端，随着交互式输入信息的格式的核查，使得正则表达式奇为重要。 在进入正文之前，先铺垫一点小知识 转义字符 在前端JavaScript代码编写中，有很多字符是带有语法规则的，如果你...原创 2018-03-10 18:58:33 · 220 阅读 · 0 评论 -
JavaScript之js异步加载精解
在解释之前先铺垫几个知识点。 DomTree：在页面渲染时候会把html构建成一个树形结构，把标签全部挂在树形结构上，构建DOM树采用深度优先原则。 Dom解析：绘制DOM树过程中，当遇到外部引入的文件标签时候，不用等到DOM元素全部加载完成再放到DOM树上，只知道是什么就可以了，DOM树的构建完毕表示所有DOM节点解析完毕。 CssTre...原创 2018-03-05 23:02:12 · 280 阅读 · 1 评论 -
JavaScript之js加载时间线精解
在js加载开始的时候，浏览器会记录js执行的这段过程。 1.创建Document对象，开始解析web页面，解析HTML元素和他们的文本内容后添加Element对象和Text节点到文档中。这个阶段Document。readyState = "loading"。 2.遇到link外部css，创建线程加载，并继续解析文档。 ...原创 2018-03-05 23:13:30 · 1856 阅读 · 0 评论 -
JavaScript之JSON
我们知道，前端和后端进行沟通的桥梁是数据的传输。在数据的传输中不同的时代也有着各种各样的数据传输格式。从开始的XML到如今的JSON格式传输，也包含着各种各样的变化。从繁到简。 JSON json说白了就是一种对象，也可以说是一种命名空间，json是一种数据传输格式，本质上是对象，但用途不同，对象就是本地用的，而json是作为数据传输用的。 ...原创 2018-03-05 22:07:09 · 2067 阅读 · 0 评论 -
JavaScript之类型转换
本人是一个初学小萌新,对什么都比较好奇,开始学JavaScript,对JS的感兴趣,学到类型转换这个地方,总结了一下类型转换的知识点,给大家分享一下。 类型转换分为“显示类型转换“和“隐式类型转换”。顾名思义，显示类型转换就是以各种转换函数进行的转换；隐式类型转换是暗藏在表达式里面的转换。一，显示类型转换 显示类型转换：Number（），parseInt（），parseFloat（），原创 2018-02-05 17:14:37 · 334 阅读 · 1 评论 -
JavaScript之预编译
初学JavaScript，遇到预编译这个梗，学完，感觉对于JS代码的理解和执行过程又更深了一步。首先说一下，众所周知，JavaScript语言是一种解释性语言。JavaScript代码执行分为三个步骤：1.语法分析 2.预编译 3.解释执行在预编译阶段简单总结两句话：1，函数声明整体提升----提升到逻辑的最前面 2，变量声明提升---只是把声明提升到最前面预编译阶段原创 2018-02-05 19:23:58 · 275 阅读 · 0 评论 -
JavaScript之作用域及作用域链精解
上次说了一下JavaScript预编译，在预编译过程中JavaScript函数会生成AO对象这个东西，个AO对象也称之为“执行期上下文”。今天说一下这个作用域和作用域链，明白这个东西，会更明白JavaScript代码。一，作用域 其实每个JavaScript函数都是一个对象，对象中有些属性我们可以访问，有的不可以，就像test（）函数的test.name是可以访问的，[[scope]]原创 2018-02-06 17:04:04 · 239 阅读 · 0 评论 -
JavaScript之立即执行函数
说道在写JavaScript代码的时候，我们经常有一些变量啊，方法呀，是整个代码程序只运用一次就没有作用的一部分代码。而这些代码又不用不可，用完之后再也不用了而且还占内存，我们就想有没有一种什么方法可以让这个函数方法用完一次，充分展示了它的作用之后，就立即销毁。在这里，我们引入立即执行函数。立即执行函数 定义：立即执行函数只被执行一次，执行完之后立即销毁。作原创 2018-02-07 15:02:21 · 340 阅读 · 0 评论 -
JavaScript之JavaScript对象及包装类
说道对象，我想起了在其它语言上说的一句话---万物皆对象，在世间任何一个东西都有它自己的属性和特别方法，这里可以说它自己的用途。JavaScript对象 最基础的对象需要明白：1.对象的定义、2.对象属性的增删改查、3.对象的创建方法。一、对象的定义 定义对象：对象的定义中既可以有属性也可以有方法。var obj = {name : "wang",age : "20",eat : fu...原创 2018-02-08 22:53:14 · 386 阅读 · 1 评论 -
JavaScript之原型、原型链
原型 定义 原型是function对象的一个属性，它定义了构造函数制造出的对象的公有祖先，通过该构造函数产生的对象， 可以继承该原型的属性和方法，原型也是对象。 构造函数不懂的话 点击这里 上面说原型是function对象的一个属性---prototype。 Per...原创 2018-02-09 22:24:59 · 186 阅读 · 0 评论 -
JavaScript之call、apply
我认为编程也是随着科技的发展实现，高效性，简介性的重要理念。call和apply是JS中知识点少而又非常重要的。call/apply 作用：他们两个的作用相同，改变this指针的指向，借别人的方法实现自己的功能。 区别：要说它们两个的区别有两个：1、书写不同。2、传参列表不同。call：需要把实参按照形参的个数传进去，apply：传的是数组，是实参列表（ar...原创 2018-02-10 18:20:04 · 193 阅读 · 0 评论 -
JavaScript之继承模式。
个人感觉作为一个程序员在编写程序时，快捷，高效，简便，是写代码的最大特点。在相对于相同的代码不用去写第二遍，在别处写好的功能在这里直接拿来去用，就是快捷的一种方式。继承模式 在继承模式的发展史上，出现过很多种继承模式，经过不断完善最终成就完美模式 原型链 别人的东西我如果需要我自己拿来用。Grand.prototype.lastName = "wan...原创 2018-02-11 17:10:08 · 248 阅读 · 0 评论 -
JavaScript之命名空间
在大程序做项目的时候，一个项目的完成不可能是一个人完成的，往往需要很多人，就像前端，一个团队写界面会有很多个HTML文件，很多个CSS文件和很多个JS文件，就JavaScript而言，对于每个人的命名规则不一样，相近的功能可能会产生同样的变量名以及函数名，产生变量覆盖现象。那么设置命名空间就很重要了。命名空间 作用：管理变量，防止污染全局，适用于模块化开发。 方...原创 2018-02-11 18:12:19 · 222 阅读 · 0 评论 -
JavaScript之对象枚举
对象的访问有两种方法，第一种是对象名.属性名（obj.name）、第二种是对象名['属性名']（obj['name']）。其实第一种是在内部变成第二种的形式，然后再执行。var obj = {name : "wang";age : 20;sex : "male";}console.log(obj['name']);这种也是有好处，看下面例子。var obj = { color1 : {...原创 2018-02-11 20:35:27 · 3075 阅读 · 1 评论 -
JavaScript之区别一个变量是数组还是对象的三种方法
var num = {} // || [];上面代码表示这个num是对象或者数组我们不知道，如何区分有三种方法。1.constructor2.instanceof3.toString.call() JavaScript语言我个人感觉是最有意思的了，我也是一个初学者，遇到问题，喜欢在博客上分享，也希望能帮到大家。一个初学者，有什么不足或者纰漏的话，希望在下面评论出来，相互学习，...原创 2018-02-11 20:49:51 · 222 阅读 · 0 评论 -
JavaScript之this
this在JavaScript中访问全局变量，访问函数内部变量，大家都知道，this，是用起来最舒服的一个指针。对于this有几个特点 1.在预编译过程中this指向window（全局） function test(){var a = 123;var b = 456;}test();/*在test函数预编译阶段，AO中除了有a和b还有两个参数，arguments和this，这里的a...原创 2018-02-12 20:54:29 · 247 阅读 · 0 评论 -
JavaScript之 callee及caller
callee 大家都知道arguments是函数的实参列表，而这个callee就是arguments的一个方法。arguments.callee指向自身函数function person (){console.log(arguments.callee);}person();//输出的就是person这个函数//arguments.callee == test ...原创 2018-02-12 21:10:44 · 161 阅读 · 0 评论 -
JavaScript之克隆
在JavaScript如何把一个对象的属性和方法完完整整的搬过来到另一个空对象身上，对于继承的使用方法不能完成上述操作，所以我们开始另一种方法----克隆。克隆分为：浅层克隆和深度克隆。浅层克隆 var obj = {name : "wang",age : 20,say : [1,2,3],family : {name :"zhou",baobao : {name : "...原创 2018-02-12 21:58:37 · 309 阅读 · 0 评论 -
JavaScript 之数组
数组JavaScript数组的定义方法和对象相似。定义方法第一种：数组字面量定义：var arr = [1,2,3,4,5]; //建议第一种第二种：构造函数定义方法。使用Array.prototype原型var arr1 = new Array(num)//num 可以传参也可以不传，表示多长的数组。数组的读和写 数组的读和写，没有太多的规则，var arr = [];console...原创 2018-02-12 23:00:25 · 179 阅读 · 0 评论 -
JavaScript之类数组
在JavaScript中有一种说是数组又不能说是数组，但可以当数组来用的东西，这个东西叫做类数组。类数组有一下特点： 1.可以利用属性名来模拟数组的特性2.可以动态的执行length的属性3.如果强行让类数组调用push方法，则会根据length属性值的位置进行属性的扩充在函数中实参列表---arguments，就是一个类数组。类数组的组成部分：1.属性为索引属性（...原创 2018-02-17 19:28:39 · 149 阅读 · 0 评论 -
JavaScript之数组/字符串去重
一个数组之中的值如果有重复的，怎么把这个数组变的没有重复值，这就需要用到我们已经学过的知识，运用算法来实现。数组去重在原型链上编程，也就是在Array.prototype上面写代码。Array.prototype.unique = function (){var temp = {},len = this.length,arr = [];for(var i = 0; i < len...原创 2018-02-17 19:50:54 · 237 阅读 · 0 评论 -
JavaScript之try、catch及错误类型
我们知道，在做项目过程中是前端和后端一起的，当我们做前端的需要后端传值的时候，有时候并没有传过来，那么我们的代码就会报错，如何解决这个问题，这时候就用到了我们前端的try、catch语法try{}catch(e){}try代码块里放的是如果会出错的代码，catch代码块里放的是如果try代码错误，执行catch代码。try{console.log("a");console.log(b...原创 2018-02-17 20:22:49 · 678 阅读 · 0 评论 -
JavaScript之es5.0严格模式
严格模式现在的浏览器是基于es3.0和es5.0的一些新增的方法使用的。然而，在es3.0和es5.0必然会有冲突的部分，而这些冲突的部分就是使用es3.0的严格模式定义"use strict" 这样的一个字符串，放在声明的最顶端。严格模式报错1.使用with(){}会报错。2.arguments.callee和function.caller在严格模式下不能使用。3.变量赋值前必须声明。4.局部的...原创 2018-02-17 20:51:03 · 324 阅读 · 0 评论 -
JavaScript之with
with(){}是个很强大的功能。关于with。它可以修改作用域链，把它接受到的对象放在作用域的最顶端。进行代码执行。作用： 修改作用域链。 var obj = {name : "wang"};function test(){var name = "zhou";with(obj){console.log(name);}}test();//"wang"wi...原创 2018-02-17 21:12:19 · 275 阅读 · 0 评论 -
JavaScript之Dom选择器
Dom Dom即Document Object Model （文档对象模型），Dom定义了表示和修改文档所需的方法。DOM对象即为宿主对象，由浏览器厂商定义，用来操作html和xml功能的一类对象的集合，也有人称DOM是对html以及xml的表追编程接口。 JavaScript进入Dom阶段是JS通过一些方法来增删改查html文档。Dom选择器 Dom选...原创 2018-02-19 19:35:14 · 451 阅读 · 0 评论 -
JavaScript之Dom节点类型、遍历节点数。
在Dom文档查的结构中，实际上各级标签呈现树状排列。我们可以把整个html文档看成一个树形，可以通过遍历节点树的形式进行标签的选取。 Dom文档中，遍历节点的节点有，文本节点，注释节点和标签节点。遍历节点树 以下找孩子节点包括文本节点和注释节点 parentNode -->父节点（最顶端的parentNode是docuemnt）<!D...原创 2018-02-20 23:35:58 · 799 阅读 · 0 评论