JS情缘
艾小莫的梦
这个作者很懒,什么都没留下…
展开
-
JS中script标签详细介绍
Script标签介绍向HTML页面中插入JavaScript的主要方法,就是使用<script>元素HTML4.01为这个元素定义了下列6个属性。 - async:可选。表示应该立即下载脚本,但不应该妨碍页面中的其他操作。比如下载其他资源或者等待加载的其他脚本。只对外部脚本文件有效。 - charset:可选。表示通过src属性指定的代码的字符集。但由于大多数浏览器会忽略它的值。因此这个属性原创 2017-03-17 16:28:28 · 3990 阅读 · 0 评论 -
你应该知道的 setTimeout 秘密
计时器setTimeout是我们经常会用到的,它用于在指定的毫秒数后调用函数或计算表达式。语法:setTimeout(code, millisec, args);注意:如果code为字符串,相当于执行eval()方法来执行code。当然,这一篇文章并不仅仅告诉你怎么用setTimeout,而且理解其是如何执行的。1、setTimeout原理先来看一段代码:var start = new Date()转载 2017-06-22 11:54:44 · 1299 阅读 · 0 评论 -
深入浅出 妙用Javascript中apply、call、bind
这篇文章实在是很难下笔,因为网上相关的文章不胜枚举。巧合的是前些天看到阮一峰老师的一篇文章的一句话: “对于我来说,博客首先是一种知识管理的工具,其次才是传播工具。我的技术文章,主要用来整理我还不懂得知识。我只写那些我还没有完全掌握的东西,那些我精通的东西,往往没有动力写。炫耀从来不是我的动机,好奇才是。”对于这句话,不能赞同更多,也让我下定决心好好写这篇,网上虽然文章很多,但是大多复制粘贴,且晦转载 2017-06-22 15:11:43 · 709 阅读 · 0 评论 -
ajax的实现过程
前几天去百度一面,被问到了这个,于是就想整理一下Ajax的基本步骤。AJAX = 异步 JavaScript和XML(标准通用标记语言的子集)。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。那么如果让我们自己写一个ajax请求,主要包括哪些基本步骤呢。为了讨论这个问题,我们首先看一个了解一个重要的原创 2017-03-17 10:29:04 · 4163 阅读 · 0 评论 -
浅谈js中==、!=、===、!==
==与===1、对于string,number等基础类型,==和===是有区别的1)不同类型间比较,==之比较“转化成同一类型后的值”看“值”是否相等===如果类型不同,其结果就是不等;原始类型的数据会转换成数值类型再进行比较。字符串和布尔值都会转换成数值,所以题主的问题中会有第二个string输出。2)同类型比较,直接进行“值”比较,两者结果一样2、对于Array,Object等高级类型,==原创 2017-08-21 10:06:57 · 373 阅读 · 0 评论 -
从一道面试题看ES6箭头函数
前几天头条面试碰到了这样一道面试题,让我写出每行代码的运行结果:var f = x => x; f(1); //return 1var f = x => {x}; f(1); //function(x)={x};var f = x => ({x}) ;f(1);//return {1}(返回一个对象)ES6 允许使用“箭头”(=>)定义函数。var f = v => v;上面的箭头函数等同于:原创 2017-08-21 10:46:21 · 1563 阅读 · 0 评论 -
JS中this关键字详解
this是Javascript语言的一个关键字。它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。比如, function test(){ this.x = 1; }随着函数使用场合的不同,this的值会发生变化。但是有一个总的原则,那就是this指的是,调用函数的那个对象。下面分六种情况,详细讨论this的用法。普通函数调用作为方法来调用作为构造函数来调用使用ap原创 2017-08-21 16:07:27 · 368 阅读 · 0 评论 -
从Promise来看JavaScript中的Event Loop、Tasks和Microtasks
前几天面试的时候,碰到了这样一个题:说出下列代码的执行结果:setTimeout(function () { console.log(1)}, 0);new Promise(function executor(resolve) { resolve();}).then(function () { console.log(2);}); //2,1(functio原创 2017-08-22 14:20:59 · 1165 阅读 · 0 评论 -
JS map的简单实现
/* * MAP对象,实现MAP功能 * * 接口: * size() 获取MAP元素个数 * isEmpty() 判断MAP是否为空 * clear() 删除MAP所有元素 * put(key, value) 向MAP中增加元素(key, value) * remove(key) 删除指定KEY的元素原创 2017-09-13 17:29:44 · 696 阅读 · 0 评论 -
JavaScript里的循环方法之forEach,for...in,for...of
JavaScript诞生已经有20多年了,我们一直使用的用来循环一个数组的方法是这样的:for (var index = 0; index < myArray.length; index++) {console.log(myArray[index]);}一、 forEach自从JavaScript5起,我们开始可以使用内置的forEach 方法:,forEach方法中的function回调有三个原创 2017-07-05 11:18:00 · 710 阅读 · 0 评论 -
浅谈XSS跨站脚本攻击
简介跨站脚本攻击(cross site script),为了避免与样式css混淆,所以简称XSS。恶意攻击者往Web页面里插入恶意script代码,当用户浏览该页面之时,嵌入其中web里面的Script代码会被执行,从而达到恶意攻击的目的。XSS攻击的危害包括:1、盗取各类用户账号,如机器登录账号、用户网银账号、各类管理员账号 2、控制企业数据,包括读取、篡改、添加、删除企业敏感数据的能力。 3原创 2017-06-21 17:05:52 · 567 阅读 · 0 评论 -
JS中的map、reduce
Array.prototype.map()map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素。 注意: map() 不会对空数组进行检测。 注意: map() 不会改变原始数组。举例说明,比如我们有一个函数f(x)=x2,要把这个函数作用在一个数组[1, 2, 3, 4, 5, 6, 7, 8, 9]上,就可以原创 2017-09-18 12:17:37 · 1074 阅读 · 0 评论 -
用setTimeout()方法来模拟setInterval()与setInterval()之间的什么区别?
对于setTimeout()跟setIntervl()之间的区别,你真的了解么?有时候看似简单的东西,往往隐藏一些你不知道的细节。setTimeout(fn,time)是超时调用,它在大于等于time之后调用fn;而setIntervl(fn,time)是间歇调用;每隔time调用一次。下面我要讲的是:用setTimeout()方法来模拟setInterval()与setInterval()之间的什转载 2017-09-19 10:32:33 · 631 阅读 · 0 评论 -
Javascript 严格模式详解
一、概述除了正常运行模式,ECMAscript 5添加了第二种运行模式:”严格模式”(strict mode)。顾名思义,这种模式使得Javascript在更严格的条件下运行。设立”严格模式”的目的,主要有以下几个: 消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为; 消除代码运行的一些不安全之处,保证代码运行的安全; 提高编译器效率,增加运行速度; 为未转载 2017-09-28 11:25:33 · 685 阅读 · 0 评论 -
JS如何判断一个对象为空
昨天面试的时候被问到的问题。只怪自己根基不牢,没有回答好。然后面试官提示用for in,突然恍然大悟,然后又查询了网上的一些方法,对这个问题做一下整理。1、最常见的思路,for…in…遍历属性,为真则为“非空数组”;否则为“空数组”var judgeObj = function(obj){ for(var item in obj){ return true; }原创 2017-09-12 15:08:00 · 1358 阅读 · 0 评论 -
JS中自定义sleep函数
js中不存在自带的sleep方法,要想休眠要自己定义个方法,现将自己使用的方法整理如下,后续如果有更优雅的方法,我会再来补充,也欢迎大家多提意见。1、for循环法function sleep(d){ for(var t = Date.now();Date.now() - t <= d;);}sleep(5000); //当前方法暂停5秒利用for循环的这种写法是最简单也最糟糕的方法,如上的代码原创 2017-09-12 16:07:44 · 1127 阅读 · 0 评论 -
一道常被人轻视的前端JS面试题
前几天读文章,偶尔读到了一篇挺不错的文章,用来考核面试者的JavaScript的综合能力,先整理分享一下。题目如下:function Foo() { getName = function () { alert (1); }; return this;}Foo.getName = function () { alert (2);};Foo.prototype.getName =转载 2017-06-22 12:21:10 · 412 阅读 · 0 评论 -
js中的事件委托
简介利用冒泡的原理,把事件加到父级上,触发执行效果。在介绍事件委托例子之前,先看一个传统做法的例子:实现功能是点击li,弹出123:<ul id="ul1"> <li>111</li> <li>222</li> <li>333</li> <li>444</li></ul>window.onload = function(){ var oUl = docum原创 2017-06-21 18:03:13 · 388 阅读 · 0 评论 -
跨域请求的几种实现方式
什么是跨域跨域是由于浏览器的同源策略导致的,所谓的同源就是指协议、域名、端口相同。当浏览器执行一个脚本时会检查是否同源,只有同源的脚本才会执行,如果不同源即为跨域。(也就是跨域发生在浏览器阶段,当请求一个跨域资源时,服务器会返回相应的脚本,但是浏览器并不会执行)实现跨域的几种方式1、JSONP最常见的一种跨域方式,其背后原理就是利用了script标签不受同源策略的限制,在页面中动态插入了script原创 2017-05-19 17:24:07 · 1024 阅读 · 0 评论 -
js异步加载的四种解决方案
js异步加载的4种方式,点评开始。方案1:$(document).ready<!DOCTYPE html><html> <head> <script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script> <script type="text/jav转载 2017-03-18 18:56:23 · 1993 阅读 · 0 评论 -
JavaScript简介
JavaScript诞生于1995年。当时,它的主要目的是处理以前由服务器端语言负责的一些输入验证操作。在JS问世之前,必须把表单数据发送到服务器端才能确定用户是否没有填写某个必填域,是否输入了无效的值。如今,JS已经从一个简单的输入验证器发展成一门强大的编程语言,完全出乎人们的意料。一个完整的JS实现应该由以下三个不同的部分组成:核心(ECMAScript)。 由ECMA-262定义的ECM原创 2017-03-20 13:08:31 · 382 阅读 · 0 评论 -
JS中Boolean类型值的判断
Boolean类型是ECMAscript中使用最多的一种类型,该类型只有两个字面值:true和false。不过我们要注意,这里的true和false是区分大小写的,True和Flase都不是Boolean值,只是标识符。虽然Boolean类型的字面值只有两个,但ECMAscript中所有类型的值都有与这个两个Boolean值等价的值。要将一个值转换为其对应的Boolean值,可以调用转型函数Bool原创 2017-03-20 15:35:58 · 20039 阅读 · 0 评论 -
JS中Number数据类型需要注意的事项
1、浮点数值 虽然小数点前面可以没有整数,但是并不推荐这种写法。var floatNum1 = 1.1;var floatNum2 = .2; //有效,但不推荐由于保存浮点数值需要的内存空间是保存整数值的两倍,因此ECMAScript会不失时机地将浮点数值转化为整数数值。显然,如果小数点后面没有任何数字,那么这个数值就可以作为整数值来保存。同样,如果浮点数值本身表示的就是一个整数,那么该值也会原创 2017-03-20 16:26:14 · 2667 阅读 · 0 评论 -
ES6学习笔记(一)(整理阮一峰大神入门)
一、ES6声明变量的六种方法ES5 只有两种声明变量的方法:var命令和function命令。ES6除了添加let和const命令,另外两种声明变量的方法:import命令和class命令。所以,ES6 一共有6种声明变量的方法。1、let变量在代码块中有效。比如用for循环计数器,就很适合用let变量。2、var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为und原创 2017-03-27 15:30:28 · 7571 阅读 · 0 评论 -
JavaScript中垃圾回收机制简介
JavaScript 具有自动垃圾收集机制,也就是说,执行环境会负责管理代码执行过程中使用的内存。 而在 C 和 C++之类的语言中,开发人员的一项基本任务就是手工跟踪内存的使用情况,这是造成许多问 题的一个根源。在编写 JavaScript 程序时,开发人员不用再关心内存使用问题,所需内存的分配以及无 用内存的回收完全实现了自动管理。这种垃圾收集机制的原理其实很简单:找出那些不再继续使用的变 量,转载 2017-03-21 16:56:14 · 511 阅读 · 0 评论 -
JavaScript数组简介
除了 Object 之外,Array 类型恐怕是 ECMAScript 中最常用的类型了。而且,ECMAScript 中 的数组与其他多数语言中的数组有着相当大的区别。虽然 ECMAScript 数组与其他语言中的数组都是 数据的有序列表,但与其他语言不同的是,ECMAScript 数组的每一项可以保存任何类型的数据。也 就是说,可以用数组的第一个位置来保存字符串,用第二位置来保存数值,用第三个位置原创 2017-03-21 17:30:20 · 338 阅读 · 0 评论 -
关于 JavaScript 的数组随机排序
关于 JavaScript 的数组随机排序JavaScript 开发中有时会遇到要将一个数组随机排序(shuffle)的需求,一个常见的写法是这样:function shuffle(arr) { arr.sort(function () { return Math.random() - 0.5; });转载 2017-03-30 16:04:20 · 1020 阅读 · 0 评论 -
undefined与null的区别
下面是爱奇艺前端面试问的一个问题:undefined与null有什么区别。typeof(null) typeof(undefined)输出的结果分别是什么。这面我们就来详细探究一下这两个变量的相似性与区别。相似性 在JavaScript中,将一个变量赋值为undefined或null,大部分情况下我个人认为是一样的。 var name = undefined; var name =原创 2017-03-17 11:54:32 · 542 阅读 · 0 评论 -
js创建对象的方法
下面简单罗列下js中创建对象的各种方法,现在最常用的方法是组合模式。1)原始模式//1.原始模式,对象字面量方式var person = { name: 'Jack', age: 18, sayName: function () { alert(this.name); }};//1.原始模转载 2017-05-15 13:11:33 · 337 阅读 · 0 评论 -
JavaScript 深入之从原型到原型链
构造函数创建对象我们先使用构造函数创建一个对象:function Person() {}var person = new Person();person.name = 'name';console.log(person.name) // name在这个例子中,Person就是一个构造函数,我们使用new创建了一个实例对象person。很简单吧,接下来进入正题:prototype每个函数都有一个转载 2017-05-15 14:39:43 · 623 阅读 · 0 评论 -
从一道面试题谈js函数声明
爱奇艺前端面试题有个题目如下:a();function a(){ console.log('a');}b();var b = function(){ console.log('b');}那么函数的执行结果是?熟悉函数变量提升的同学很容易就想到答案是:a undefined。不熟悉的童鞋们可以接着往下看~JS关于函数的声明,有一个很重要的特征就是函数的变量提升。意思是在执行代原创 2017-05-15 16:33:14 · 1744 阅读 · 1 评论 -
JS中类型的检测
在js开发中,经常需要检测一个变量的类型。现在就总结一下常见的检测变量类型的方法,以及它们的适用场景。一、typeof要检测一个变量是不是基本数据类型,typeof是最佳的工具。也就是说,typeof是确定一个变量是字符串、数值、布尔值还是undefined的最佳工具。但如果变量是一个对象或者null,则typeof操作符会都返回object:var num = 123;var str = 'ab原创 2017-05-19 10:55:50 · 684 阅读 · 0 评论 -
JS中Function类型详解
ECMScript中最有意思的莫过于函数了。每个函数都是Funtion类型的实例,而且与其他引用类型一样具有属性和方法。由于函数是对象,因此函数名实际上也是一个指向函数对象的指针,不会和某个函数绑定。下面就整理一下函数常见的性质和属性。1、没有重载将函数名想象成指针,有助于理解为什么ECMAScript中没有函数重载的概念。function add(num){ return num + 10原创 2017-05-19 12:45:02 · 738 阅读 · 0 评论 -
javascript放在head和body的区别(w3c建议放在head标签中)
JavaScript脚本放在哪里 在HTML body部分中的JavaScripts会在页面加载的时候被执行。 在HTML head部分中的JavaScripts会在被调用的时候才执行。 —————————————————————————— JavaScript应放在哪里 页面中的JavaScripts会在浏览器加载页面的时候被立即执行,我们并不希望总是这样,有时候我们想让一段脚本在页面加转载 2017-05-19 15:27:08 · 450 阅读 · 0 评论 -
Javascript异步编程的4种方法
你可能知道,Javascript语言的执行环境是”单线程”(single thread)。所谓”单线程”,就是指一次只能完成一件任务。如果有多个任务,就必须排队,前面一个任务完成,再执行后面一个任务,以此类推。这种模式的好处是实现起来比较简单,执行环境相对单纯;坏处是只要有一个任务耗时很长,后面的任务都必须排队等着,会拖延整个程序的执行。常见的浏览器无响应(假死),往往就是因为某一段Javascri转载 2017-09-30 10:31:08 · 521 阅读 · 0 评论