JavaScript
文章平均质量分 77
Wendy-lxq
这个作者很懒,什么都没留下…
展开
-
JavaScript中的map()函数
map()方法将调用的数组的每个元素传递给指定的函数,并返回一个数组,它包含该函数的返回值。 传递给map()的函数的调用方式和传递给forEach()的函数的调用方式一样。但传递给map()的函数应该有返回值。注意:map()返回的是新数组:它不修改调用的数组。如果是稀疏数组,返回的也是相同方式的稀疏数组:它具有相同的长度,相同的缺失元素。 举个例子:原创 2017-02-17 15:53:48 · 30891 阅读 · 0 评论 -
Js基础--函数传参小实例(商品价格计算)
在写前端代码的过程中,经常会发现有很多功能的代码是重复的,比如说在网易的首页中,有好几个的选项卡,这些选项卡的功能其实是一样的,就是当鼠标点击或者划过去的时候,下面的内容显示会相应的显示对应的内容,区别在于选项卡的个数以及选项卡的文字内容。所以在写这部分代码的过程中,我们尽可能可以重用代码,不会导致过多的冗余代码。 重用代码: 1、尽量保证 HTML 代码原创 2016-12-05 21:36:07 · 3757 阅读 · 0 评论 -
Js基础--属性读写操作
今天刚好学习Js的基础知识部分中的属性读写操作,所以进行了整理,这样也帮助自己总结和归纳。 HTML的属性操作分为读和写操作,基本的操作方法就是属性名.属性值。 1)属性读操作:获取、找到元素 元素. 属性名 2)属性写操作:替换,修改或者添加 元素.属性名 = 属性值注意: 1、js中不允许出现“ - ”原创 2016-11-27 10:02:53 · 1424 阅读 · 0 评论 -
Js基础--数组应用实例(图片切换)
在前面的文章中,我们讲到了js中数组的具体操作,详见(Js对Array的各种操作总结),这里就不再做详细的讲解。今天主要的目的是如何用数组进行图片的简单左右切换。 本文中的图片切换具体步骤如下: 第1步:简单的布局并设计基本的显示样式; 第2步:通过js获取相关元素; 第3步: 通过数组进行图片url和对应文字描述的存原创 2016-11-29 15:46:45 · 6764 阅读 · 1 评论 -
Js基础--Js数据类型及相关操作
一、Js的数据类型 JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型。可以通过typeOf来判断数据类型。var x // x 为 undefinedvar x = 6; // x 为数字var x = "Bill"; // x 为字符串 Js的基本数据类型:数字、字符串、布尔、数组、对象原创 2016-12-04 10:58:58 · 435 阅读 · 0 评论 -
Js中级--事件冒泡
1、事件 在浏览器客户端应用平台,基本都是以事件驱动的,即某个事件发生,然后做出相应的动作。2、事件对象 event : 事件对象 , 当一个事件发生的时候,和当前这个对象发生的这个事件有关的一些详细的信息都会被临时保存到一个指定地方-event对象,供我们在需要的调用。3、事件冒泡 在一个对象上触发某类事件(比如单击onclick事件),如果此对象原创 2016-12-09 09:24:42 · 477 阅读 · 0 评论 -
Js中级--事件捕获
1、事件传播-冒泡与捕获 DOM事件标准定义了两种事件流,这两种事件流有着显著的不同并且可能对你的应用有着相当大的影响。这两种事件流分别是捕获和冒泡。 默认情况下,事件使用冒泡事件流,不使用捕获事件流。然而,在Firefox和Safari里,你可以显式的指定使用捕获事件流,方法是在注册事件时传入useCapture参数,将这个参数设为true。W3C模型是将事件冒泡原创 2016-12-11 11:00:41 · 560 阅读 · 0 评论 -
Js中级--DOM事件流
"DOM2级事件"规定的事件流包括三个阶段:事件捕获阶段、处于目标阶段和事件冒泡阶段。首先发生的是事件捕获,为截获事件提供了体会。原创 2016-12-16 17:05:33 · 630 阅读 · 0 评论 -
Js中级--模拟短信发送
在学习的过程中,看到js学习的视频中在讲解模拟短信发送,所以自己也动手写了一下这段代码。 在写一个普通的功能时,首先需要设计页面,也就是html结构,然后用css样式修饰,使其界面更加美观。最后才是开始编写js代码,实现页面的交互。 界面设计如下:html结构如下: //为了先实现界面,所以事先写了对话内容原创 2016-12-13 09:29:19 · 2305 阅读 · 0 评论 -
【JavaScript】找出数组中两数之和为指定值的所有整数对
笔试的时候刚好做到这道题:定一个整型数组(数组中的元素可重复,已排序),以及一个指定的值。找出数组中两数之和为指定值的所有整数对,要求时间复杂度为O(N)。 首先来分析一下这个题,假设题目没有说已排序和时间复杂度的要求,那么用最暴力的方法就是直接遍历两次数组,时间复杂度为O(N*N)。这里也来实现一下,代码如下:/*暴力法,直接遍历两次数组,时间复杂度为O(n*n)*/funct原创 2017-04-19 17:00:56 · 5786 阅读 · 0 评论 -
【js实现】在排序数组中,找出给定数字的出现次数,比如 [1, 2, 2, 2, 3] 中2的出现次数是3次
今天做笔试题的时候做到了这题,当时由于时间 太短,而且因为没有处理好JavaScript中整数的关系,导致结果没有运行出来。所以在结束之后,在网上搜了资料,发现都是用C语言或者C++,java实现的,没有用JavaScript实现的,于是我又重新做了这道题。思路分析:1、首先这个数组是有序的,所以我们只要能够找到这个给定的数字在这个数组中出现的第一个位置和最后一个位置就可以得到一共原创 2017-04-02 22:11:15 · 5510 阅读 · 0 评论 -
JavaScript中typeof和instanceof的区别
1、typeof typeof 是一个操作符,主要的目的是检测一个变量是不是基本数据类型的变量,同时也可以说是确定一个变量是字符串,数值,布尔值,还是undefined等的最佳工具。 对一个值使用typeof操作符可能返回下列某种字符串:“underfined”--如果这个值未定义“boolean”--如果这个值是布尔值,即true或者false“string原创 2017-04-12 09:15:51 · 592 阅读 · 0 评论 -
JavaScript正则表达式的模式匹配
正则表达式是一个描述字符模式的对象。JavaScript的RegExp类表示正则表达式,String和RegExp都定义了方法,后者使用正则表达式进行强大的模式匹配和文本检索与替换功能。 JavaScript中的正则表达式用RegExp对象表示,可以使用RegExp()构造函数来创建RegExp对象,不过RegExp对象更多的是通过一种特殊的直接量语法来创建。正则表达式直接量定义为包含原创 2017-02-15 17:25:30 · 985 阅读 · 0 评论 -
【JavaScript设计模式】行为型设计模式--职责链模式
职责链模式的定义是:使多个对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系,将这些对象连成一条链,并沿着这条链传递该请求,直到有一个对象处理它为止。 也就是说,请求以后,从第一个对象开始,链中收到请求的对象要么亲自处理它,要么转发给链中的下一个候选者。提交请求的对象并不明确知道哪一个对象将会处理它——也就是该请求有一个隐式的接受者(implicit receiver)原创 2017-05-24 22:44:04 · 474 阅读 · 0 评论 -
JavaScript中的继承以及实现继承的几种方法
在之前学习java和C语言的时候接触了继承,但是看到了js的继承,总是觉得似曾相识,但又是是懂非懂的感觉。所以觉得应该总结一下,加深自己对js这种OO的理解。 许多OO语言都支持两种继承方式:接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际的方法。因为ECMAScript中函数无法签名,所以不支持接口继承,只支持实现继承,而实际上实现继承主要依靠原型链实现,在前面的文原创 2017-03-02 17:31:56 · 675 阅读 · 0 评论 -
JavaScript同步、异步、回调执行顺序分析
之所以会写这篇文章,是因为在做笔试题的时候,会遇到一题很经典的题目,关于setTimeout的输出结果,下面我们先来看一道题目:for (var i = 0; i < 5; i++) { setTimeout(function() { console.log(i); }, 1000);}console.log(i); 我相信只要是做过前端笔试题原创 2017-05-04 10:11:09 · 17161 阅读 · 4 评论 -
javaScript中var、let、const的区别
在javascript中有三种声明变量的方式:var、let、const。1、var 之前我们在写js代码的时候都知道可以用var定义全局变量和局部变量,也可以省略var,而且在非严格模式下不会报错,但是实际上在严格模式下,两者的使用有没有区别,可能很多人不清楚。var x = 1; y = 2; console.log(x);//1 console.log原创 2017-08-24 15:43:29 · 8125 阅读 · 0 评论 -
用JavaScript实现十大经典排序算法--快速排序
快速排序,这也是在实际中最常用的一种排序算法,速度快,效率高。就像名字一样,快速排序是最优秀的一种排序算法。1)算法原理 快速排序的基本思想:通过一趟排序将待排记录分隔成独立的两部分,其中一部分记录的关键字均比另一部分的关键字小,则可分别对这两部分记录继续进行排序,以达到整个序列有序。2)算法描述 快速排序使用分治法来把一个串(list)分为两个子串(su原创 2017-09-13 22:08:05 · 1325 阅读 · 0 评论 -
null == undefined ?
转载自:作者:一像素www.cnblogs.com/onepixel/p/7337248.html最近在看《JavaScript高级程序设计》一书,书中讲到相等操作符(==)时说,要比较相等性之前,不能将 null 和 undefined 转换成其他任何值,但要记住 null == undefined 会返回 true 。的确,在ECMAScript转载 2017-08-18 17:47:56 · 35535 阅读 · 0 评论 -
【JavaScript设计模式】行为型设计模式--模板方法模式
模板方法模式是一种只需要使用继承就可以实现的非常简单的模式。模板方法模式是由两部分组成,第一部分是抽象类,第二部分是具体的实现子类。通常在抽象父类中封装了子类的算法框架,其中主要是包括一些公共的方法以及封装所有子类中所有方法的执行顺序。那子类通过继承这个抽象类,也就是继承了整个算法结构,并且可以选择重写父类的方法。 在模板方法模式中,还引入了另外一个设计原则--“好莱坞原则”。为了说原创 2017-05-22 16:17:52 · 379 阅读 · 0 评论 -
【JavaScript设计模式】行为型设计模式--策略模式
俗话说“条条大路通罗马”。在现实中,很多时候也有多种途径可以到达同一个目的地,比如,我们要去某个地方旅游,可以根据具体的实际情况来选择出行的线路。在程序设计中,我们也常常遇到类似的情况,要实现某一个功能有多种方案可以选择。比如要对一个数组进行排序,我们可以选择快速排序算法,也可以选择冒泡排序算法。 策略模式定义了算法家族,分别封装起来,让他们之间可以互相替换,此模式让算法的变化不会原创 2017-05-22 09:52:18 · 437 阅读 · 0 评论 -
【JavaScript设计模式】行为型设计模式--发布-订阅模式
发布-订阅者模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知。那具体的含义,就是有订阅者和发布者,两者的功能,订阅是请求在某些事件(event)到达时可以通知它并执行对应的动作(action),而发布则相对的是向订阅告知事件(event)已经到达,你可以执行对应的动作(action)了。 举一个现实中的例子。我们在现实原创 2017-06-01 17:01:22 · 493 阅读 · 0 评论 -
【JavaScript设计模式】创建型设计模式--建造者模式
建造者模式:可以将一个复杂对象的构建与其表示相分离,使得同样的构建过程可以创建不同的表示。也就是说如果我们用了建造者模式,那么用户就需要指定需要建造的类型就可以得到他们,而具体建造的过程和细节就不需要知道了。建造者模式实际,就是一个指挥者,一个建造者,一个使用指挥者调用具体建造的工作得出结果的客户。1、建造者模式四要素 1)产品类Product:一般是一个较为复杂的对象,也就是说创原创 2017-05-18 09:11:22 · 563 阅读 · 0 评论 -
【JavaScript设计模式】创建型设计模式--简单工厂、工厂方法、抽象工厂
既然标题中提到了创建型设计模式,那就先来解释一下什么叫创建型设计模式?创建型设计模式是一类处理对象创建的设计模式,通过某种方式控制对象的创建来避免基本对象创建时可能导致设计上的问题或增加设计上的复杂度。--引自张荣铭的【JavaScript设计模式】 在一篇博客中,博主为了写工厂模式,在文章开始进行了一个简答的问题陈述,下面我将这段话也写进来: 原文“想象一个场景:如果原创 2017-05-17 17:05:36 · 927 阅读 · 0 评论 -
JavaScript中的深复制和浅复制
在谈javascript的浅复制和深复制之前,我们先来看看js的数据类型:有Number,Boolean,String,Null,Undefined,Object五种类型。而Object又包含Function,Array和Object自身。前面的五种类型叫做基本类型,而Object是引用类型。之所以要先了解 这几种数据类型,是因为JS 中的浅拷贝与深拷贝,其实只是针对复杂数据类型(Object原创 2017-05-06 11:28:05 · 798 阅读 · 0 评论 -
JavaScript之事件委托
由于事件处理程序可以为现代Web应用程序提供交互能提供交互能力,因此许多开发人员会部分青红皂白地向页面中添加 大量的处理程序。当我们需要对很多元素添加事件的时候,可以通过将事件添加到它们的父节点而将事件委托给父节点来触发处理函数。但是,如果添加到页面上的事件处理程序数量一大会影响到页面的整体运行性能。原因在于:每个函数都是对象,都会占用内存,内存中的对象越多,性能就会越差;必须事先指定原创 2017-03-09 11:15:56 · 389 阅读 · 0 评论 -
JavaScript中JSON.stringify()与JSON.parse()
在开始介绍本文要介绍的两个方法之前,我们先来看一下什么是JSON对象。一、JSON对象 1、什么是json? JSON(JavaScript Object Notation)javscript对象标记,是一种轻量级的数据交换格式。简单来说,json就是用JavaScript语法写的一个特殊的标记字符串。 2、json的作用 (1)简化用JavaScript定原创 2017-04-08 09:32:54 · 1421 阅读 · 0 评论 -
JavaScript中的原型prototype【2】
转载自:原型prototype[2]前面说了介绍了原型,这一部分说说原型的一大作用:继承。在面向对象中,继承有两种方法,分别是接口继承和实现继承。但是在JavaScript中,函数不能只签名,所以JavaScript中只有实现继承。JavaScript继承的基本思路就是让一个引用类型继承另一个引用类型的属性和方法。 function SuperType()转载 2017-02-19 11:24:40 · 480 阅读 · 0 评论 -
仿网易选项卡制作
如果你的页面只有一个tab(选项卡)切换的地方,需要调用js效果,如果单独为了它,还要为页面加载一个jQuery插件,想必是极痛苦的。所有很多时候,jQuery特效也不是万能的,偶尔来个原生的js效果也是必须的。今天闲着无聊,用js和jquery分别写了一个选项卡的效果,但是其中用到jquery只是为了更好的获取标签以及修改样式。先来浏览一下效果图吧~~一、原创 2016-10-03 11:02:08 · 1399 阅读 · 0 评论 -
表单--form对象
在Javascript 中,页面上的每一对 标记都解析为一个对象,即form 对象。所有的表单元素都支持type、name、form、value属性。如果一个表单对象定义如下: 获得该表单对象的方法: 1> document.forms["frm1"]; // 根据name属性值原创 2016-12-20 20:07:00 · 1815 阅读 · 0 评论 -
用JavaScript实现十大经典排序算法--插入排序
插入排序的代码实现虽然没有冒泡排序和选择排序那么简单粗暴,但它的原理应该是最容易理解的了,因为只要打过扑克牌的人都应该能够秒懂。像排序一手扑克牌,开始时,我们的左手为空并且桌子上的牌面向下。然后,我们每次从桌子上拿走一张牌并将它插入左手中正确的位置。为了找到一张牌的正确位置,我们从右到左将它与已在手中的每张牌进行比较,拿在左手上的牌总是排序好的,原来这些牌是桌子上牌堆中顶部的牌。1)算法原理原创 2016-12-27 20:14:16 · 779 阅读 · 0 评论 -
用JavaScript实现十大经典排序算法--选择排序
表现最稳定的排序算法之一,因为无论什么数据进去都是O(n²)的时间复杂度.....所以用到它的时候,数据规模越小越好。唯一的好处可能就是不占用额外的内存空间。1)算法原理 先在未排序序列中找到最小(大)元素,存放到排序序列的起始位置,然后,再从剩余未排序元素中继续寻找最小(大)元素,然后放到已排序序列的末尾。以此类推,直到所有元素均排序完毕。2)算法原创 2016-12-27 19:41:44 · 867 阅读 · 0 评论 -
用JavaScript实现十大经典排序算法--冒泡排序
冒泡排序可谓是最经典的排序算法了,它是基于比较的排序算法,时间复杂度为O(n^2),其优点是实现简单,n较小时性能较好。1)算法原理 相邻的数据进行两两比较,小数放在前面,大数放在后面,这样一趟下来,最小的数就被排在了第一位,第二趟也是如此,如此类推,直到所有的数据排序完成。2)算法描述 比较相邻的元素。如果第一个比第二个大,就交换它们两个;原创 2016-12-27 19:39:15 · 8462 阅读 · 2 评论 -
【js】将1-100之间的奇数存入数组
数组在js的应用中非常重要,很多地方都用到了数组进行存储数据。今天总结一个小小的问题,但是很容易忘记的小知识点。要求:将1-100之间的奇数存入到数组中。分析: 假设数组array,循环判断初始值var i=1。 大家最先想到的方法应该是我们对i进行判断,然后将符合条件的i值存入数组array[i],最后进行打印查看结果是否正确,代码如下:var a原创 2016-12-26 21:11:41 · 11021 阅读 · 0 评论 -
sublime text 3调试js
今天刚好有一个需求,就是希望我在用js写算法或者自己学习js函数等知识时,希望写的程序能够直接调试,而不用每次都要用浏览器去解析,所以特地去搜了资料,然后参考了多篇文章之后,才最后配置成功,于是就是分享一下经验~~一、安装node.js当然你可以使用其它诸如jsc之类的环境来运行js, 本文使用的是nodejs. 首先确保你的电脑已经安装好nodejs, 并已将其添加到环境变量。下原创 2016-09-26 20:59:32 · 8907 阅读 · 0 评论 -
用JavaScript实现十大经典排序算法
排序算法是最基本最常用的算法,不同的排序算法在不同的场景或应用中会有不同的表现,我们需要对各种排序算法熟练才能将它们应用到实际当中,才能更好地发挥它们的优势。之前学习的排序算法都是用c或者c++实现的,没有用过Javascript实现过,通过查阅资料,决定自己总结一下这十个排序算法。一、排序算法的说明1、定义输入:n个数:a1,a2,a3,...,an输出:n个数的排列:a1'原创 2016-10-02 08:47:59 · 1148 阅读 · 0 评论 -
利用js编写响应式侧边栏
为了练手,自己学敲网站时刚好碰到需要制作侧边栏,在网上也查了各种插件以及框架都可以实现这个功能,但是想自己学着用js原生学一个试试,于是就初略完成了侧边栏的实现,可以让初学者参考参考,代码能力有限。其中主要设计的就是animate()函数,animate() 方法执行 CSS 属性集的自定义动画。该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的,这样就可以原创 2016-08-30 15:15:08 · 2471 阅读 · 0 评论 -
Js对Array的各种操作总结
Array应该是我们在平时写js代码中,使用频率最高的,在平时的项目中,很多数据都是可以通过Array来存储、操作等任务。除了Object之外,Array类型应该是js中最常用的类型了。今天总结一下Array的一些简单和基本的操作,也来巩固下自己的基础知识。一、如何创建Array(下面直接说数组)创建数组主要有两种方法,第一种是使用数组构造函数,第二种是使用数组字面量表示法。1、使原创 2016-11-01 21:00:45 · 933 阅读 · 1 评论 -
JavaScript中的原型Prototype【1】
在看了不少资料之后,对于原型的理解就是两个字,共享。 在这一部分,将通过分析原型出现的原因,已经原型的应用-->继承。原型Prototype的出现在讨论原型的出现,就需要从对象的创建开始说起。创建对象可以通过new Object()或者直接通过对象字面量{}完成,但是使用这种方法会导致在创建多个对象的时候,产生大量的代码。因此有了工厂模式:1 工厂模式工厂模转载 2017-02-19 11:20:46 · 364 阅读 · 0 评论 -
JavaScript中setTimeout()和setInterval()的使用以及区别
今天刚好在看setTimeout()的一个案例,在案例的解析中提到了setTimeout()和setInterval()的使用区别,但是比较理论,所以决定自己也总结一下,写写例子帮助理解一下。 首先是说说这两个方法的具体时如何使用的。1、setTimeout()方法 这个方法所有浏览器都支持,setTimeout( ) 是属于 window 的 method,原创 2017-02-20 22:07:15 · 8361 阅读 · 0 评论