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

 更新时间:2021年05月04日 11:46:15   作者:浅笑·  
这篇文章主要介绍了原生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中应该禁止的写法的资料请关注脚本之家其它相关文章!

相关文章

  • 简单实现JavaScript图片切换效果

    简单实现JavaScript图片切换效果

    这篇文章主要教大家如何简单实现JavaScript图片切换效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-11-11
  • json数据处理技巧(字段带空格、增加字段、排序等等)

    json数据处理技巧(字段带空格、增加字段、排序等等)

    json数据处理技巧例如:正常取值、字段带空格、赋值、增加字段、排序、拷贝、数组添加和删除等,详细请参考本文或许对你有所帮助
    2013-06-06
  • 输入npm run xxx后执行原理深入解析

    输入npm run xxx后执行原理深入解析

    这篇文章主要为大家介绍了输入npm run xxx后执行原理深入解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • JavaScript 函数参数是传值(byVal)还是传址(byRef) 分享

    JavaScript 函数参数是传值(byVal)还是传址(byRef) 分享

    这篇文章主要介绍了在JS中函数参数是传值(byVal)还是传址(byRef)的误区我们通过实例说明一下,有需要的朋友可以参考
    2013-07-07
  • Object.keys方法实例详解

    Object.keys方法实例详解

    这篇文章主要介绍了Object.keys方法实例详解,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-09-09
  • 微信小程序开发常用功能汇总

    微信小程序开发常用功能汇总

    这篇文章主要介绍了微信小程序开发常用功能,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-02-02
  • 全面理解JavaScript中的继承(必看)

    全面理解JavaScript中的继承(必看)

    下面小编就为大家带来一篇全面理解JavaScript中的继承(必看)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • 前端解决跨域问题nmp安装http-server的问题

    前端解决跨域问题nmp安装http-server的问题

    这篇文章主要介绍了前端解决跨域问题-nmp安装http-server的问题,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-07-07
  • 你可能不知道的前端算法之文字避让(inMap)

    你可能不知道的前端算法之文字避让(inMap)

    这篇文章主要给大家介绍了关于前端算法之文字避让的相关资料,对于这个知识相信很多的朋友都不知道,但看到效果会惊叹不已,实现这一个效果主要利用的是inMap文字避让功能,文中通过示例代码介绍的非常详细,需要的朋友可以参考借鉴,下面随着小编来一起学习学习吧。
    2018-01-01
  • JavaScript实现鼠标移入随机变换颜色

    JavaScript实现鼠标移入随机变换颜色

    这篇文章主要给大家介绍了关于JavaScript实现鼠标移入随机变换颜色的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-11-11

最新评论