原生JS编写时哪些写法要避免?我们知道原生JS编写是有规范和要求的，而且有良好的代码编写习惯也是很重要的，对此本文就给大家来介绍一下原生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禁止出现的写法，大家可以关注其它的相关文章。

文本转载自脚本之家

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• Promise静态类型有哪些，分别有什么不同呢

  目录前言Promise.all基础学习Iterator 接口参数思路分析源码实现Promise.allSettled基础学习思路分析源码实现Promise.race基础学习思路分析源码实现Promise.any基础学习思路分析源码实现前言恰逢 Promise 也有四个很像的静态三兄弟(Promise.all、Promi

• jQuery中如何实现修改style属性？

  这篇文章我们来了解jQuery中如何实现修改style属性。这里我们可以使用attr()方法来修改style属性，具体的实现方法及代码如下，有需要的朋友可以参考，接下来就跟随小编来一起学习一下吧！

• 用JS+CSS实现卡片轮播的具体代码是什么

  本文实例为大家分享了js+css实现卡片轮播图效果的具体代码，供大家参考，具体内容如下实现点击的时候切换卡片，自动轮播，鼠标移入暂停，移出继续轮播,有动画事件。效果如下。

• vue中watch的触发条件及用法是什么呢

  vue中的监听方法watch作用，用来监听vue实例中的数据变化，可以随时修改状态的变化，下文有实例供大家参考，对大家了解操作过程或相关知识有一定的帮助，而且实用性强，下面我们一起来了解看看吧。

• React怎样创建和使用组件？

  这篇文章主要介绍 React中组件的类别以及如何创建和使用组件，对新手学习React有一定的帮助，有这方面学习需要的朋友可以解决参考，接下来小编带着大家一起了解看看。