javascript场景,javascript应用场景

js语言怎么样？

JavaScript 是目前所有主流浏览器上唯一支持的脚本语言。JavaScript入门难度较低，可在任何浏览器上开发及调试，不需要安装额外的软件。作为一门灵活的脚本语言，JS有很多用途：前端，后端，游戏脚本等。

目前javascript的应用场景非常多，并且也是热门语言之一。

如web开发、小程序开发等都用到了js，如果不考虑兼容性问题，已经可以使用ES6/7/8中的语法糖。在web开发中目前有很多框架，如vue、angular、react等

如果想做后台开发可以使用nodejs（Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境），也有比较适用的框架如express、koa、koa2、fastify等

还可以使用js做桌面端开发，Electron（Electron（原名为Atom Shell）是GitHub开发的一个开源框架。 它允许使用Node.js（作为后端）和Chromium（作为前端）完成桌面GUI应用程序的开发）。 像 常用的编辑器Visual Studio Code就是使用Electron开发。

js目前属于非常热门的语言，并且这种现象将会持续下去，因为在发展过程中你会发现js非常强大。

[img]

Javascript在嵌入式的应用场景有哪些

Javascript是最流行的脚本语言之一，也是Web的主要技术之一，这样的优势导致它在嵌入式领域也有一定的作用

飞利浦出过一套 Pronto 智能中控设备系列，可以通过编写代码自定义界面和逻辑，控制继电器、串口、红外等设备，适用于家庭和办公室自动化控制。

控

制设备分为中控主机和控制板（即带彩色触摸屏的遥控器），本身是嵌入式系统，但控制板中存储的自定义逻辑代码就是使用改造过的Javascript脚本规

范。为家庭或安装好被控制的设备以后，只需通过必要连线或局域网将中控主机与被控设备连通，再将电脑上编写好的脚本和配置文件通过USB口传到控制板上，

就可以使用了。电脑端编辑是半图形化半文本式的界面（类似Visual Studio和 Xcode

的使用），代码编写又不难，因此上手非常容易。编写界面和最终的控制板使用体验都很好。

“ProntoScript

是一种基于 JavaScript 的软件工具，它使安装人员能够创建动态的双向用户界面，利用全图形的灵活性对 RS232 或 IP

进行系统控制。该工具集成在 ProntoEdit Professional 软件中。与 Pronto 合作伙伴预建的 ProntoScript

模块可通过网站获得。对于典型安装，您可以选择使用标准安装参考文件，重新分配各个组件即可。更高级的 JavaScript

编程人员能够创建他们自己的 ProntoScript 模块，以便进行全面的系统操作和反馈。”

可惜不知为何没有后续研发新产品。

Javascript在嵌入式的应用场景有哪些？优势在何处

Javascript是最流行的脚本语言之一，也是Web的主要技术之一，这样的优势导致它在嵌入式领域也有一定的作用

飞利浦出过一套 Pronto 智能中控设备系列，可以通过编写代码自定义界面和逻辑，控制继电器、串口、红外等设备，适用于家庭和办公室自动化控制。

控

制设备分为中控主机和控制板（即带彩色触摸屏的遥控器），本身是嵌入式系统，但控制板中存储的自定义逻辑代码就是使用改造过的Javascript脚本规

范。为家庭或安装好被控制的设备以后，只需通过必要连线或局域网将中控主机与被控设备连通，再将电脑上编写好的脚本和配置文件通过USB口传到控制板上，

就可以使用了。电脑端编辑是半图形化半文本式的界面（类似Visual Studio和 Xcode

的使用），代码编写又不难，因此上手非常容易。编写界面和最终的控制板使用体验都很好。

“ProntoScript

是一种基于 JavaScript 的软件工具，它使安装人员能够创建动态的双向用户界面，利用全图形的灵活性对 RS232 或 IP

进行系统控制。该工具集成在 ProntoEdit Professional 软件中。与 Pronto 合作伙伴预建的 ProntoScript

模块可通过网站获得。对于典型安装，您可以选择使用标准安装参考文件，重新分配各个组件即可。更高级的 JavaScript

编程人员能够创建他们自己的 ProntoScript 模块，以便进行全面的系统操作和反馈。”

可惜不知为何没有后续研发新产品。

JavaScript 里的闭包是什么？应用场景有哪些

闭包（closure）是Javascript语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现。

下面就是我的学习笔记，对于Javascript初学者应该是很有用的。

一、变量的作用域

要理解闭包，首先必须理解Javascript特殊的变量作用域。

变量的作用域无非就是两种：全局变量和局部变量。

Javascript语言的特殊之处，就在于函数内部可以直接读取全局变量。

var n=999;

function f1(){

alert(n);

}

f1(); // 999

另一方面，在函数外部自然无法读取函数内的局部变量。

function f1(){

var n=999;

}

alert(n); // error

这里有一个地方需要注意，函数内部声明变量的时候，一定要使用var命令。如果不用的话，你实际上声明了一个全局变量！

function f1(){

n=999;

}

f1();

alert(n); // 999

二、如何从外部读取局部变量？

出于种种原因，我们有时候需要得到函数内的局部变量。但是，前面已经说过了，正常情况下，这是办不到的，只有通过变通方法才能实现。

那就是在函数的内部，再定义一个函数。

function f1(){

var n=999;

function f2(){

alert(n); // 999

}

}

在上面的代码中，函数f2就被包括在函数f1内部，这时f1内部的所有局部变量，对f2都是可见的。但是反过来就不行，f2内部的局部变量，

对f1就是不可见的。这就是Javascript语言特有的"链式作用域"结构（chain scope），子对象会 "一级一级" 地向上寻找所有父对象的变量。

所以，父对象的所有变量，对子对象都是可见的，反之则不成立。

既然f2可以读取f1中的局部变量，那么只要把f2作为返回值，我们不就可以在f1外部读取它的内部变量了吗！

function f1(){

var n=999;

function f2(){

alert(n);

}

return f2;

}

var result=f1();

result(); // 999

三、闭包的概念

上一节代码中的f2函数，就是闭包。

各种专业文献上的"闭包"（closure）定义非常抽象，很难看懂。我的理解是，闭包就是能够读取其他函数内部变量的函数。

由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成"定义在一个函数内部的函数"。

所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。

四、闭包的用途

闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。

怎么来理解这句话呢？请看下面的代码。

function f1(){

var n=999;

nAdd=function(){n+=1}

function f2(){

alert(n);

}

return f2;

}

var result=f1();

result(); // 999

nAdd();

result(); // 1000

在这段代码中，result实际上就是闭包f2函数。它一共运行了两次，第一次的值是999，第二次的值是1000。

这证明了，函数f1中的局部变量n一直保存在内存中，并没有在f1调用后被自动清除。

为什么会这样呢？原因就在于f1是f2的父函数，而f2被赋给了一个全局变量，这导致f2始终在内存中，而f2的存在依赖于f1，

因此f1也始终在内存中，不会在调用结束后，被垃圾回收机制（garbage collection）回收。

这段代码中另一个值得注意的地方，就是"nAdd=function(){n+=1}"这一行，首先在nAdd前面没有使用var关键字，因此nAdd是一个全局变量，而不是局部变量。

其次，nAdd的值是一个匿名函数（anonymous function），而这个匿名函数本身也是一个闭包，

所以nAdd相当于是一个setter，可以在函数外部对函数内部的局部变量进行操作。

五、使用闭包的注意点

1）由于闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露。

解决方法是，在退出函数之前，将不使用的局部变量全部删除。

2）闭包会在父函数外部，改变父函数内部变量的值。所以，如果你把父函数当作对象（object）使用，把闭包当作它的公用方法（Public Method），

把内部变量当作它的私有属性（private value），这时一定要小心，不要随便改变父函数内部变量的值。

六、思考题

如果你能理解下面两段代码的运行结果，应该就算理解闭包的运行机制了。

代码片段一。

var name = "The Window";

var object = {

name : "My Object",

getNameFunc : function(){//alert(this.name);//My Object

return function(){

return this.name;// 空

};

}

};

alert(this.name);// The Window

alert(object.getNameFunc()()); // 空

代码片段二。

var name = "The Window";

var object = {

name : "My Object",

getNameFunc : function(){

var that = this;

return function(){

return that.name;

};

}

};

alert(object.getNameFunc()()); // My Object

JS之bind浅析及应用场景

fn.bind(obj, args)

bind() 方法会创建一个函数，该函数的 this 指向了传入的第一个参数，当 bind() 的参数为空时， this 指向全局对象。如浏览器中的 window 。

因为 js 是一门 Duck typing 语言，所以我们可以通过 bind 实现一些共有方法。

有的时候我们需要针对特定的 this 调用某些方法。写起来比较麻烦，这个时候就可以使用 bind 创建一个 shortcut 方便调用。

bind 也可以绑定构造函数，但是当执行生成的函数时，会忽略this指向，即使在绑定时已经对其赋值。

javascript对象池应用场景是什么样的？

具体实现思路：

我们使用一个数组来存储已创建的xmlhttp对象实例，然后每次调用从池中去取一个实例。xmlhttp实例通讯完毕后我们不用做任何处置，因为它自身的readyState属性可以标识出它是否可用，如果当时没有空闲的xmlhttp实例，且池中的实例数小于最大实例个数，那么就创建一个新的实例并放入池中。重新改进的实现代码如下：

复制代码代码如下:

//封装XMLHTTP的MyAjaxObj类

var MyAjaxObj = new Object();

var maxXmlHttpCount = 5; //最多5个xmlhttp对象存在

MyAjaxObj.reqList = []; //可以清空里面的项

MyAjaxObj.getFreeObj = function() {

var req = null;

var len = this.reqList.length;

//先从当前的池里取

for (var i = 0; i len; i++) {

if (this.reqList[i]) {

if (this.reqList[i].readyState == 4 || this.reqList[i].readyState == 0) {

req = this.reqList[i];

break;

}

}

}

//如果没有闲置的对象，自己独立创建

if (req == null) {

if (this.reqList.length maxXmlHttpCount) {

req = getXmlHttp();

this.reqList.push(req);

}

}

return req;

}

//创建一个XMLHTTP对象，兼容不同的浏览器

function getXmlHttp() {

var xmlHttp = false;

var arrSignatures = ["MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0",

"MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP",

"Microsoft.XMLHTTP"];

for (var i = 0; i arrSignatures.length; i++) {

try {

xmlHttp = new ActiveXObject(arrSignatures[i]);

return xmlHttp;

}

catch (oError) {

xmlHttp = false; //ignore

}

}

// throw new Error("MSXML is not installed on your system.");

if (!xmlHttp typeof XMLHttpRequest != 'undefined') {

xmlHttp = new XMLHttpRequest();

}

return xmlHttp;

}

/*封装XMLHTTP向服务器发送请求的操作

url:向服务器请求的路径；method：请求的方法，即是get/post；***callback：当服务器成功返回结果时，调用的函数(类似c#回调函数)***

data：向服务器请求时附带的数据；urlencoded：url是否编码；cached:是否使用缓存； callBackError;当服务器返回错误时调用的函数

*/

MyAjaxObj.send = function(url, method, callback, data, urlencoded, cached, callBackError) {

var req = this.getFreeObj(); //从池里或者直接实例化一个XMLHTTP的实例

//当XMLHTTP的请求状态发生改变时调用 (核心处理函数)

req.onreadystatechange = function() {

// 当请求已经加载

if (req.readyState == 4) {

// 当请求返回成功

if (req.status == 200) { //或者 req.status 400

// 当定义了成功回调函数时，执行成功回调函数

if (callback)

callback(req, data);

}

// 当请求返回错误

else {

//当定义了失败回调函数时，执行失败回调函数

if (callBackError)

callBackError(req, data);

}

// 有池的管理，我们可以省却释放资源的方法

// try {

// delete req;

// req = null;

// }

// catch (e) {

// alert(e.message);

// }

}

}

//如果以POST方式回发服务器

if (method.toUpperCase() == "POST") {

req.open("POST", url, true);

//请求是否需要缓存(只有在req.open之后才可以设置此项)

if (cached)

req.setRequestHeader("If-Modified-Since", "0");

//请求需要编码

if (urlencoded)

req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

req.send(data);

MyAjaxObj.reqList.push(req);

}

//以GET方式请求

else {

req.open("GET", url, true);

//请求是否需要缓存

if (cached)

req.setRequestHeader("If-Modified-Since", "0");

req.send(null);

MyAjaxObj.reqList.push(req);

}

return req;

}

//全部清除XMLHTTP数组元素，释放资源

MyAjaxObj.clearReqList = function() {

var len = MyAjaxObj.reqList.length;

for (var i = 0; i len; i++) {

var req = MyAjaxObj.reqList[i];

if (req) {

try {

delete req;

} catch (e) { }

}

}

MyAjaxObj.reqList = [];

}

//进一步封装XMLHTTP以POST方式发送请求时的代码

//isClear：是否清除XMLHTTP数组的所有元素；其他参数的意义见 MyAjaxObj.send

MyAjaxObj.sendPost = function(url, data, callback, isClear, isCached, callBackError) {

if (isClear) {

MyAjaxObj.clearReqList();

}

MyAjaxObj.send(url, "POST", callback, data, true, isCached, callBackError); //post方法需要编码

}

//进一步封装XMLHTTP以GET方式发送请求时的代码

MyAjaxObj.sendGet = function(url, args, callback, isClear, isCached, callBackError) {

if (isClear)

MyAjaxObj.clearReqList();

return MyAjaxObj.send(url, "GET", callback, args, false, isCached, callBackError);

}

最后再ps：上周周末和一个哥们聊天的时候谈到ajax应用中的xmlhttp对象。那哥们ms很“虔诚”地问我说xmlhttp怎么就异步通信了。我当时竟然毫不思索地说因为这个对象处理我们的请求调用是“异步”的（当然可以设置成同步的，不过这是一句废话），当前这个请求不会影响其他的操作。这个回答是很“官方”的，显然没有说到问题的本质。哥们，您的眼神儿有必要那么bs人么？现在稍作分析，个人认为其实每个xmlhttp异步请求都会触发一个回调函数，这个回调函数的调用不影响其他的操作，这个方法才是“异步”。如果对比c#里的异步处理回调方法，它们在原理上其实是相通的。 哈哈，现在终于想通了， 真是太骄傲，太有出息了，想到就兴奋！

标签: javascript xmlhttp 对象池