js

JS高阶编程技巧--柯理化函数

梦想的初衷 提交于 2020-02-13 16:12:59
首先看一段代码: let obj = { x: 100 }; function fn(y) { this.x += y; console.log(this); } 现在有一个需求:在1秒后,执行函数fn,并让其this指向obj。 如果写成 setTimeout(fn, 1000); 这么写的话,fn函数中的this是指向window的,而且也没有传递参数。 如果写成 setTimeout(fn(200), 1000); 这么写的话,this指向依然是window,而且相当于立即执行fn函数,并把结果赋给定时器1秒后再执行,这样肯定不行。 如果写成 setTimeout(fn.call(obj,200), 1000); 这么写的话,用call或apply虽然改变了this指向,但都是函数立即执行并把返回结果赋给了定时器,依然无法完成需求。 如果写成 setTimeout(function() { fn.call(obj, 200); }, 1000); 这么写的话,用一个匿名函数包起来,等到1秒后执行匿名函数里边的代码,这样便可以完成上述需求。 从中我们可以看出,在某一个阶段之后执行某些代码,我们需要预先把this指向、参数等预先准备好,这种预先处理的思想即柯理化思想。 即,柯理化函数的思想:利用闭包的机制,把一些内容事先存储和处理了,等到后期需要的时候拿来用即可。 当然

如何将php变量传递给js

别说谁变了你拦得住时间么 提交于 2020-02-13 12:42:39
实例 <?php //获取txt文件 $txt_files_raw = glob('demo/*.txt'); //encode方便js接收数组 $txt_files = json_encode($txt_files_raw); //数组长度计算 var $txt_files_length = count($txt_files_raw); //basename数组与赋值,也可用demo = Array();创建数组 for ($txt_n=0; $txt_n < $atc_length; $txt_n++){ $txt_name_arr_raw[$txt_n] = basename($txt_files_raw[$txt_n],'.txt'); } $txt_name_arr = json_encode($txt_name_arr_raw); echo <<<eot <script language="JavaScript" type="text/JavaScript"> var txtFiles = $txt_files; var atcLength = $atc_length; var txtNameArr = $txt_name_arr; </script> eot; ?> 此处是数组的传递,只需要对其进行 json_encode ,然后用 echo <<< //...

js -this,new、call、apply、bind 相关面试题

巧了我就是萌 提交于 2020-02-13 12:27:56
this问题 在es5中,在函数定义时是无法确定this的指向的,只有在运行的时候才知道它的指向,实际上this的指向是指向调用它的那个对象 例子1 function a() { var user = '1' console.log(this.user) // undefined console.log(this) // window } a()   这时是window调用,所以这时this指向的是window 例子2 var o= { user = "1", fn: function() { console.log(this.user) // "1" } }o.fn() 这里的this指向的是对象o,因为你调用这个fn是通过o.fn()执行的,那自然指向就是对象o 例子3 var o = { user: "1", b: { user: "2", fn: function () { console.log(this.user) // "undefined" console.log(this) // window } } } var j = o.b.fn; j() 这里this指向的是window,his永远指向的是最后调用它的对象,也就是看它执行的时候是谁调用的,例子3中虽然函数fn是被对象b所引用,但是在将fn赋值给变量j的时候并没有执行所以最终指向的是window  

模块化工具require 学习笔记

拟墨画扇 提交于 2020-02-13 12:13:17
一:早就听说过模块化工具require.js的大名,之前也是由于自己的网页上引用了诸多的js,而且一堆的js引用放在那里,一个依赖另一个,导致我不敢随意改动各个js的位置,而且有时页面内容一多起来,js加载也使得本来的html内容出现响应延迟。因此,在网上查过后,便得知解决方法是使用AMD异步模块-require.js。 二:了解过require.js后,我们一般都知道它具有如下优点: 1,防止js加载阻塞页面渲染,实现js文件的异步加载,避免网页失去响应; 2,使用程序调用的方式加载js,防止出现如下丑陋不堪的一串引用,同时管理模块之间的依赖性,便于编写与维护; <script type="text/javascript" src="a.js"></script> <script type="text/javascript" src="b.js"></script> <script type="text/javascript" src="c.js"></script> <script type="text/javascript" src="d.js"></script> <script type="text/javascript" src="e.js"></script> <script type="text/javascript" src="f.js"></script>

js代码预解析

为君一笑 提交于 2020-02-13 10:29:07
1、var一般用于声明变量,预解析代码的时候,等号后面的赋值过程不会执行,所以预解析时的var变量都是未定义的 2、function声明的函数,预解析的时候,值就是函数里面的内容 例:console.log(c)   var c = 1;   console.log(c)   function c( ){console.log(2)}   预解析过程:var c;       function c( ){console.log(2)};       console.log(c)  // function c( ){console.log(2)};       c = 1;       console.log(c)  // 1        来源: https://www.cnblogs.com/cuishuangshuang/p/12302385.html

js 合并两个数组,去除重复项,只留一个

青春壹個敷衍的年華 提交于 2020-02-13 08:54:39
//It's merge arr1 and arr2 , delete the same element only leave one //It's only apdapter array. If object, no. //The sequence of the two array is not required. mergeArray:function (arr1, arr2){ for (var i = 0 ; i < arr1.length ; i ++ ){ for(var j = 0 ; j < arr2.length ; j ++ ){ if (arr1[i] === arr2[j]){ arr1.splice(i,1); //利用splice函数删除元素,从第i个位置,截取长度为1的元素 } } } //alert(arr1.length) for(var i = 0; i <arr2.length; i++){ arr1.push(arr2[i]); } return arr1; } 另:前替是两个数组中的项没有重复,如果重复,将不能达到想要的效果 来源: https://www.cnblogs.com/Denny_Yang/archive/2011/03/10/1979916.html

JS的基本概念和数据类型

佐手、 提交于 2020-02-13 00:40:11
什么是 JavaScript 语言 JavaScript 是一种轻量级的脚本语言。所谓 “ 脚本语言 ” ,指的是它不具备开发操作系统的能力,而是只用来编写控制其他大型应用程序(比如浏览器)的 “ 脚本 ” , 本身不提供任何的 API ,都要靠宿主环境( host )提供,所以 JavaScript 只合适嵌入更大型的应用程序环境,去调用宿主环境提供的底层 API 。 JavaScript 的核心语法部分相当精简,只包括两个部分:基本的语法构造(比如操作符、控制结构、语句)和标准库(就是一系列具有各种功能的对象比如 Array 、 Date 、 Math 等)。除此之外,各种宿主环境提供额外的 API (即只能在该环境使用的接口),以便 JavaScript 调用。以浏览器为例,它提供的额外 API 可以分成三大类。 浏览器控制类:操作浏览器 DOM 类:操作网页的各种元素 Web 类:实现互联网的各种功能 JavaScript 与 Java 的关系 JavaScript 和 Java 的关系。它们是两种不一样的语言,但是彼此存在联系。JavaScript 的基本语法和对象体系,是模仿 Java 而设计的。但是,JavaScript 没有采用 Java 的静态类型。”。JavaScript 语言的函数是一种独立的数据类型,以及采用基于原型对象(prototype)的继承链

【JS】关于闭包

怎甘沉沦 提交于 2020-02-12 22:55:33
闭包的概念对于初学者来说很容易理解为“函数里面套函数”,当然这是闭包的典型表现形式,但是为什么要在函数里面套函数呢?要知道在其他语言像Java、C++中都不存在这种方式。 究其原因,谈一谈我的想法,我们知道在ES6出现之前,js中的作用域包括全局作用域和函数作用域,不存在块作用域,当我们想在一个函数内封装一些变量,在其他地方又需要访问这些变量时,闭包就产生了。所以闭包存在的意义就是让我们 可以间接访问函数内部的变量 。 闭包的定义:函数A内有一个函数B,B可以访问A中的变量,函数B就叫做闭包。 // 闭包 function A() { var a = 1; return function B() { console.log(a); } } var a = 2; var bar = A(); bar(); 经典例题: for (var i = 1; i <=5; i++) { function(j){ setTimeout(function() { console.log(j); }, j * 1000) }(i) } 修改使其能正确输出1,2,3,4,5 // 使用闭包 for (var i = 1; i <=5; i++) { (function(j){ setTimeout(function timer() { console.log(j); }, j * 1000) })(i

JavaScript的一些基础性知识

|▌冷眼眸甩不掉的悲伤 提交于 2020-02-12 21:12:34
1. JavaScript概述 1.1. JavaScript概述 1.1.1. JavaScript是一门独立的语言 JavaScript是基于对象和事件驱动的脚本语言,主要应用在客户端。 JavaScript是一门独立的语言。 JavaScript是一种脚本语言,不需要编译,是解释运行的语言。 JavaScript运行需要环境,最常见的运行环境就是浏览器,现代主流的浏览器都内置了JS引擎,可以运行JavaScript代码。JS也有服务器端运行环境,我们不做讨论(Node.js、GoogleV8引擎…)。 1.1.2. JS的特点 解释运行,没有编译过程 基于对象 弱类型 1.1.3. JavaScript不得不说的历史 和JAVA的关系:语法十分相似,但其实毫无关系。 1995年5月,Netscape,LiveScript 1995年12月,改名为JavaScript 1996年8月,微软,Jscript 1997-1999年,ECMA,ECMAScript,基于已有的JavaScript和Jscript,提出了标准的Script语法规则,JavaScript和Jscript都遵循这套标准。 1999-以后,ECMAScript不断的更新 JS的优点: 交互性(它可以做的就是信息的动态交互) 安全性(不允许直接访问本地硬盘) 跨平台性(只要是可以解释Js的浏览器都可以执行