原生JS中应该禁止出现的写法

块级函数

严格模式下,在 ES6 之前应禁止使用。ES6 开始可以使用,函数的作用域为声明该函数的块内部。非严格模式下应禁止使用。

if(true) {
    function test() { //块级函数
        console.log(1);
    }
}
test();

直接修改对象的 prototype 原型

浏览器对原型进行了优化,在调用实例之前,会为对象的方法提前规划内存位置。所以不可以直接修改 prototype 原型。以下两种方法都应禁止使用

使用 Object.setPrototypeOf 修改原型

function a(){}
a.prototype = {
  a_prop: "a val"
};
function b(){}
var proto = {
  b_prop: "b val"
};
Object.setPrototypeOf(
  proto, a.prototype
);
b.prototype = proto;
var test = new b;
console.log(test.a_prop); // a val
console.log(test.b_prop); // b val

直接修改对象的 __proto__ 属性

function a(){}
a.prototype = {
  a_prop: "a val"
};
function b(){}
var proto = {
  b_prop: "b val",
  __proto__: a.prototype //直接修改 b 对象的 __prototype__ 属性
};
b.prototype = proto;
var test = new b;
console.log(test.a_prop); // a val
console.log(test.b_prop); // b val

with

with 的用法:

var a = {
    p1: 1,
    p2: 2
}
with (a) {
    p1 = 3;
}
console.log(a.p1);

应该禁止使用 with,例如:

function a(arg1, arg2) {
  with (arg2){
    console.log(arg1); // 无法确定是要输出第一个参数还是要输出 arg2 的 arg1 属性
  }
}
var arg2 = {arg1:1}
a("arg1", arg2)

callee

arguments.callee 表示当前正在执行的函数:

function a(arg1) {
    if (arg1 > 1) {
        return arg1 * arguments.callee(arg1 - 1);
    }
    else {
        return 1;
    }
}
console.log(a(3)); // 6

当一个函数必须调用自身的时候, 应禁止使用arguments.callee(),直接通过函数名字调用该函数。

function a(arg1) {
    if (arg1 > 1) {
        return arg1 * a(arg1 - 1); // 直接通过函数名称调用
    }
    else {
        return 1;
    }
}
console.log(a(3)); // 6

caller

caller 表示函数的调用者,应禁止使用,该特性不是标准的。

function a() {
    console.log(a.caller); // function b() { a(); }
}
function b() {
    a();
}
b();

eval

eval() 可以把传入的字符串参数当成JavaScript代码执行。

eval("var a = 1, b = 2; console.log(a+b)"); // 3

禁止使用 eval。eval 比一般JavaScript执行要慢,因为浏览器对 javascript 进行了优化。eval 方法也不安全,因为它使用与调用者相同的权限执行代码,而且 eval() 被调用时,它的作用域也会暴露。应该用 Function 代替:

var a = new Function("a", "b", "console.log(a+b)")
a(1,2); // 3

以上就是原生JS中应该禁止出现的写法的详细内容,更多关于原生JS中应该禁止的写法的资料请关注我们其它相关文章!

时间: 2021-05-03

JavaScript提高加载和执行效率的方法

前言 无论当前 JavaScript 代码是内嵌还是在外链文件中,页面的下载和渲染都必须停下来等待脚本执行完成.JavaScript 执行过程耗时越久,浏览器等待响应用户输入的时间就越长.浏览器在下载和执行脚本时出现阻塞的原因在于,脚本可能会改变页面或 JavaScript 的命名空间,它们对后面页面内容造成影响. 一个典型的例子就是在页面中使用document.write() . JavaScript 代码内嵌示例 <html> <head> <title>Sourc

JavaScript数组去重的几种方法效率测试

以下是我针对网上三种高效率方法总结与效率测试,如果大家有更好的意见或建议也可以提出,大家共勉学习. 数组去重法1: Array.prototype.unique1 = function(){ console.time("数组去重法1"); //记录开始执行的时间 var arr = []; //创建一个临时数组 var obj = {}; //创建一个空对象 for(var i = 0; i < this.length; i++){ //遍历当前要去重的数组 if(!obj[th

浅谈js正则字面量//与new RegExp的执行效率

前几天谈了正则匹配 js 字符串的问题:<js 正则学习小记之匹配字符串> 和 <js 正则学习小记之匹配字符串优化篇>. 里面讲到了优化正则起到提升性能的问题,但是能提升多少呢? 于是我去测试了,发现TMD几乎微乎其微,我用1千字符串进行100万次匹配测试,优不优化根本没区别. 这不科学,我白看了这么多天正则,上天这是在玩弄我么. 突然我想到了 compile 方法,然后去测试了下,奇迹出现了,果然优化过的快了不少. 但这是为什么呢? 于是我翻阅资料,在 MDN 上找到了 Reg

深入探究JavaScript中for循环的效率问题及相关优化

Underscore.js库 你一天(一周)内写了多少个循环了? var i; for(i = 0; i < someArray.length; i++) { var someThing = someArray[i]; doSomeWorkOn(someThing); } 这当然无害,但这种写法非常丑而且奇怪,这也不是真正需要抱怨的.但这种写法太平庸了. var i, j; for(i = 0; i < someArray.length; i++) { var someThing = some

JavaScript中for循环的几种写法与效率总结

前言 对于for循环,相信大家再常用不过了.但是这回说下for循环是因为看代码时我居然没有看明白一个for循环的意思,真是不应该啊. 这个for循环是这么写的: for (var i = 0, rule; rule = rules[i++];) { //do something } 这个写法是什么意思呢?后面再说,现卖个关子,这个写法我感觉还是挺好的. for循环写法对效率的影响 说上面那段代码之前,先说一下for循环的效率问题.在接触js时关于for循环的写法和对效率影响的文章挺不少的.但总的

如何高效率去掉js数组中的重复项

方式一: 常规模式 1.构建一个新的临时数组存放结果 2.for循环中每次从原数组中取出一个元素,用这个元素循环与临时数组对比 3.若临时数组中没有该元素,则存到临时数组中 方式二: 使用了默认Js数组sort默认排序,是按ASCII进行排序: 若要按照升降序的排列如下:<控制台打印输出> 1.先将当前数组进行排序 2.检查当前中的第i个元素 与 临时数组中的最后一个元素是否相同,因为已经排序,所以重复元素会在相邻位置 3.如果不相同,则将该元素存入结果数组中 方式三: <推荐>利

JavaScript判断是否为数组的3种方法及效率比较

今天针对不同的数组判定方式在chrome上做了一个效率的对比,结果如下: 其代码如下: var ret; var o = [1,2,3]; var toStr = {}.toString; var array = {}; array["[object Array]"] = "array"; console.log("各种判断是否数组的速度比较!") console.log("方法一:Array.isArray(o)"); co

JavaScript查看代码运行效率console.time()与console.timeEnd()用法

程序运行时间计算: 注意:测试代码运行时间的话console.time()与console.timeEnd()要一起使用,这是一个组合:这两个之间的代码就是要运行测试程序的时间 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body>

如何用Node.js编写内存效率高的应用程序

前言 软件应用程序在计算机的主存储器中运行,我们称之为随机存取存储器(RAM).JavaScript,尤其是 Nodejs(服务端js)允许我们为终端用户编写从小型到大型的软件项目.处理程序的内存总是一个棘手的问题,因为糟糕的实现可能会阻塞在给定服务器或系统上运行的所有其他应用程序.C 和 C++程序员确实关心内存管理,因为隐藏在代码的每个角落都有可能出现可怕的内存泄漏.但是对于 JS 开发者来说,你真的有关心过这个问题吗? 由于 JS 开发人员通常在专用的高容量服务器上进行 web 服务器编程

Node.js编写CLI的实例详解

Why Node.js? 常用的用来编写CLI的语言有 python, ruby, perl, Node.js等等. 为什么选取Node.js作为CLI的语言编写工具呢?有三个理由: 对Javascript语言更加熟悉 npm 完善的生态系统 npm OS无关的包管理机制 主要原因还是归咎于npm 完善的生态,目前npm官方有47.5万个三方包可供使用,你可以很方便的使用一些已经编写的很不错的轮子去帮你快速开发.另一方面,你不需要考虑跨平台的安装问题,比如OSX上的homebrew.Debian

使用Node.js配合Nginx实现高负载网络

在搭建高吞吐量web应用这个议题上,NginX和Node.js可谓是天生一对.他们都是基于事件驱动模型而设计,可以轻易突破Apache等传统web服务器的C10K瓶颈.预设的配置已经可以获得很高的并发,不过,要是大家想在廉价硬件上做到每秒数千以上的请求,还是有一些工作要做的. 这篇文章假定读者们使用NginX的HttpProxyModule来为上游的node.js服务器充当反向代理.我们将介绍Ubuntu 10.04以上系统sysctl的调优,以及node.js应用与NginX的调优.当然,如果

利用Node.js编写跨平台的spawn语句详解

前言 Node.js 是跨平台的,也就是说它能运行在 Windows.OSX 和 Linux 平台上.很多 Node.js 开发者都是在 OSX 上做开发的,然后再将代码部署到 Linux 服务器上.由于 OSX 和 Linux 都是基于 Unix 的,因此两者共性很多.Windows 也是 Node.js 官方支持的平台,只要你通过正确的方式写代码,就能在各个平台上毫无压力的跑起来. Node.js 的子进程 (child_process) 模块下有一 spawn 函数,可以用于调用系统上的命

Node.js编写组件的三种实现方式

首先介绍使用v8 API跟使用swig框架的不同: (1)v8 API方式为官方提供的原生方法,功能强大而完善,缺点是需要熟悉v8 API,编写起来比较麻烦,是js强相关的,不容易支持其它脚本语言. (2)swig为第三方支持,一个强大的组件开发工具,支持为python.lua.js等多种常见脚本语言生成C++组件包装代码,swig使用者只需要编写C++代码和swig配置文件即可开发各种脚本语言的C++组件,不需要了解各种脚本语言的组件开发框架,缺点是不支持javascript的回调,文档和de

Node.js编写爬虫的基本思路及抓取百度图片的实例分享

其实写爬虫的思路十分简单: 按照一定的规律发送 HTTP 请求获得页面 HTML 源码(必要时需要加上一定的 HTTP 头信息,比如 cookie 或 referer 之类) 利用正则匹配或第三方模块解析 HTML 代码,提取有效数据 将数据持久化到数据库中 但是真正写起这个爬虫来,我还是遇到了很多的问题(和自己的基础不扎实也有很大的关系,node.js 并没有怎么认真的学过).主要还是 node.js 的异步和回调知识没有完全掌握,导致在写代码的过程中走了很多弯路. 模块化 模块化对于 nod

Android向node.js编写的服务器发送数据并接收请求

本文实例为大家分享了Android九宫格图片展示的具体代码,供大家参考,具体内容如下 首先时node.js服务器端代码 var http = require("http"); var fs = require("fs"); var queryString = require('querystring'); var url = require('url'); var util = require('util'); http.createServer(function

node.js 和HTML5开发本地桌面应用程序

HTML5让Web开发人员用纯HTML技术开发富客户端互联网应用或者甚至本地桌面应用成为了可能.HTML5可以将任何普通网站转变成Web应用.HTML5 web 应用不仅具有在桌面浏览器应用中的优势,同时在智能手机和平板中也是开发利器. 在手机端,有一个非常棒的工具叫做PhoneGap,使用这个快速开发平台,任何人都可以使用HTML5+CSS3+JavaScript开发出安卓,iOS等应用.PhoneGap的最好的一个特点是,你并不需要联网,不需要连接web服务器,你可以从把它当成本地桌面应用.

使用Meteor配合Node.js编写实时聊天应用的范例

我经常见到被拿来与Derby.js做比较的框架是Meteor.js. 与Derby相似的是,它也能在多个客户端下实时更新views, 尽管做法上可能跟Derby有点不同. Derby可以较容易的使用多种数据库, 而Meteor则只亲近于MongoDB. 事实上, 通过如Mongoose客户端接入数据库的API与你在服务端所期望的已经非常接近了. 虽然现在meteor是个有一些缺点和争议的框架, 但Meteor看起来是非常有趣的选择用来建立有实时需求的应用. 个人还是喜欢Derby基于传统回调的编

详解如何使用Node.js编写命令工具——以vue-cli为例

vue-cli全局安装之后,提供了vue命令和vue init.vue list.vue build三个子命令,通过命令可以搭建基于vue.js的脚手架项目.本文简单介绍一下这些命令是如何实现的. vue-cli的项目目录 如下图,由之前文章介绍,npm安装过程中,可以利用package.json中bin字段的配置,将bin目录下的命令文件软连到全局命令.也就是说在/usr/local/bin下生成了四个软连命令:vue.vue-build.vue-list.vue-init. vue命令的源码

利用Node.js批量抓取高清妹子图片实例教程

前言 写了一个抓取图片的小玩意,分享一下. Github地址:https://github.com/focalhot/node.js-crawler (本地下载) 示例代码 //依赖模块 var fs = require('fs'); var request = require("request"); var cheerio = require("cheerio"); var mkdirp = require('mkdirp'); //目标网址 var url =