关于 JS 一些特别的点

Coly 发布于2019-08-20 14:18 / 3491人阅读

摘要：变量提升所谓变量提升即所有声明变量或声明函数都会被提升到当前函数的顶部。对于第一个中，她最终执行的代码实际上是这样的所以最终打印出来的结果分别是和，这就是变量提升很简单，不是吗但是你要保持警惕，因为他随时会让你吃大亏。

变量提升

所谓 变量提升 即所有声明变量或声明函数都会被提升到当前函数的顶部。

    var a = 1;
    function log(){
        console.log(a);
        var a = 2;
        console.log(2);
    }
    log();
    var a;
    console.log(a);

大家可以猜测下上面打印到控制台的消息会是什么？

    结果分别是 ： undefine,2 和 1

那么我们再看看下面这个代码打印出来会是什么呢？

    var a = 1;
    function log(){
        console.log(a);
        a = 2;
        console.log(2);
    }

    log()

    结果分别是 ： 1 和 2

结合一下我们对变量提升的定义，你也许已经明白了。对于第一个Demo中，她最终执行的代码实际上是这样的

    var a = 1;
    function log(){
        var a;
        console.log(a);
        a = 2;
        console.log(2);
    }

    log()

所以最终打印出来的结果分别是 undefine 和 __2__，这就是变量提升很简单，不是吗？但是你要保持警惕，因为他随时会让你吃大亏。

函数的声明方式

    var getName = function(){
        console.log("函数表达式");
    }

    function getName(){
        console.log("函数声明");
    }

    getName();

还是请大家想想会打印出什么？

    公布结果 ： 函数表达式

这就是两种不一样的声明方式带来的结果，对于 函数声明 JS会在优先解析，确保所有调用这个方法的地方不会报错，但是对于 函数表达式 只会在JS从上往下解析的时候才会，正式解析，我们可以看下面代码会打印出什么。

    console.log(getName); // undefine

    var getName = function(){
        console.log("函数表达式");
    }

    console.log(getName); // 会打印出getName的方法

作用域

JS是没有块级作用域的(ES5之前),但是有函数作用域，我们看下面这两个Demo，看看两者的区别

    function add(){
        a += 10;
        return a;
    }

    var a = 30;

    console.log(add(a)+a);

    function add(a){
        a += 10;
        return a;
    }

    var a = 30;

    console.log(add(a)+a);

这是一道很基础的问题，当我们把两个Demo 同时写出来的时候，我相信很多人是可以回答出正确答案的，下面公布答案。

    第一个Demo ： 80
    第二个Demo ： 70

为什么会得到这样的结果呢？我们看第一个Demo 函数里面的 a 实际上直接操作window下面的，也就是全局环境。但是第二个Demo操作的确实函数自己的形参，也就是自己的作用域，它的改变不会影响到全局环境的a

类

JS中声明类的方法有很多种，这里我就介绍最经典的一种而已

    function Animal(){
        this.name = "";
        var food = "";

        var eat = function(){
            console.log("eat");
        }

        this.run = function(){
            console.log("run");
        }
    }

    Animal.prototype.name = "小明";
    Animal.prototype.food = "穿山甲"

    var animal = new Animal();

    console.log(animal); // 会打印出什么属性？
    console.log(animal.name); // 结果会是什么？
    console.log(animal.food); // 那么这个呢？

首先这个涉及到了闭包的概念，关于这个问题我在这里就不详细说了，给大家一个知乎链接，里面讲的答案非常的简单明了，记得要全部看完，不要只关注高分项 JavaScript 里的闭包是什么？应用场景有哪些？,基本我要讲的都在这里面了。

    至于 animal.name 为什么会是 "" ，而 animal.food 是穿山甲，其实很简单，对象对于prototype会是低优先，先找本身存不存在name这个属性，找不到就到prototype去找。

GPU云服务器云服务器关于图像识别的技术关于图像识别的国外网站关于图像识别的书c 有哪些关于图像识别的书籍

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/81534.html

1.2.HTML的核心标签

摘要：的核心标签头标签序号标签标签解释定义关于文档的信息定义文档标题定义页面上所有链接的默认地址或默认目标定义文档和外部资源的关系定义关于文档的元数据定义客户端脚本定义文档的样式信息使用定义一个的模板文件新建模板文件，将模板文件放在目录下配置一下 HTML的核心标签 1.HTML头标签序号标签标签解释1 定义关于文档的信息2 定义文档标题3 ...

caikeal 2019-08-01 16:18 评论0 收藏0
我的React之路--入门

摘要：在构造函数里面初始化的数据，把数据放在页面上，点击时候调用方法改变中的数据。是中父组件向子组件通信的方式，下面是一个简单的例子使用组件我是显示的数据我们定义组件时候在构造函数中可以接收到参数，并且要使用传到的构造方法中。 React的学习之路还要继续走下去，最近一边在做未完成的项目一边学习React，项目是vue写的，后面还需要有一个后台管理系统计划使用react完成，寒假说长也不长，...

qpwoeiru96 2019-08-22 13:52 评论0 收藏0
关于Html+css阶段学习总结

摘要：再之后，通过专业老师的指导，开始进行前端知识的全面及系统性的学习。而这篇文章便是对这次学习的一次阶段性总结。的学习并不是太难，也可以说是很容易，但千里之行，这才刚刚开始，熟练的掌握，还需要不断的练习。一、学习经历进入大学不久，就加入了社团，从而对前端有了一个初步的了解，之后也做过一些学校的官网，积累了一些微小的经验。到了大二的时候，学校开设了专门的html+css课程，从中也学到...

CoXie 2019-08-30 14:21 评论0 收藏0
关于Html+css阶段学习总结

摘要：再之后，通过专业老师的指导，开始进行前端知识的全面及系统性的学习。而这篇文章便是对这次学习的一次阶段性总结。的学习并不是太难，也可以说是很容易，但千里之行，这才刚刚开始，熟练的掌握，还需要不断的练习。一、学习经历进入大学不久，就加入了社团，从而对前端有了一个初步的了解，之后也做过一些学校的官网，积累了一些微小的经验。到了大二的时候，学校开设了专门的html+css课程，从中也学到...

Rindia 2019-08-02 10:06 评论0 收藏0
JavaScript 中的隐式类型转换

摘要：虽然你可能很惊讶甚至可能怀疑是的但是这都是有语言自己的一个隐式类型转换的套路。基本的隐式类型转换基本类型的隐式转换这个其实我们使用的最多例如结果返回的是而不是这就是类型的隐式转换。基本上所有的语言都有隐式类型转换 ,但是对于弱类型语言(JS) 来说 ,隐式类型转换会比强类型语言(Java) 带来更大的副作用,有些行为甚至是不可思议的。虽然你可能很惊讶 ,甚至可能怀疑是 JS 的...

txgcwm 2019-08-26 11:44 评论0 收藏0