美文网首页
js对象深入理解(一)

js对象深入理解(一)

作者: 感觉不错哦 | 来源:发表于2018-11-22 10:27 被阅读101次
    对象是JavaScript中的基本数据类型,对象是一种复合值;它将很多值(原始值或者其他对象)聚合在一起,可通过key值进行访问。对象是属性无序的集合,正因为是无序的,我们有时操作对象会发现返回的数据不是按照原来的顺序的。每个属性对应一个名/值对。属性名是字符串,因此我们可以把对象看成是从字符串到值的映射。然而对象不仅仅是字符串到值的映射,除了可以保持自有的属性,JavaScript对象还可以从一个称为原型的对象继承属性。对象的方法通常是继承的属性,这种原型继承是JavaScript的核心特征
    不理解没关系,希望我下面的内容能帮助到你对于对象的理解
    对于 对象,属性,方法三者之间的关系你能更加透彻的深入

    标识符与保留字

    简单介绍一下这两个概念,已了解的小伙伴可以直接跳过

    标识符就是JavaScript中针对变量 和函数命名的标识,以便JavaScript可以轻易区分标识符与数字。JavaScript的标识符必须以字母下划线(_)或者美元符($)开始,比如以下命名

        i
        my_name
        $str
        _and
    

    希望小伙伴可以规范自己的命名,千万不要什么a.js b.html 遭不住的

    保留字就是JavaScript将一些标识符拿出来做自己的关键字,而这些关键字我们是没办法做标识符的


    像这些是不能做标识符的,小伙伴注意一下

    讲这两内容主要是自己联系对象操作的时候因为标识符出了不少笑话,希望能帮助到各位

    开始步入正题,将讲解比较多的js内部机制,如果过程有小伙伴看不懂的可以留言我好做出修改

    全局对象

    我们在写js的时候,有没有想过一些我们未定义的属性,方法是哪里来的
    其实当JavaScript解释器启动时,也就相当于web浏览器加载页面的时候,它将创建一个新的全局对象,并且给它一组定义好的初始属性:

    全局属性:比如undefined、Infinity和NaN
    全局函数:比如isNaN()、parseInt()和eval()=== eval()用的很少了 有兴趣可以自行了解一下
    构造函数:比如Date()、ReegExp()、String()、Object()
    全局对象:比如Math和JSON

    全局对象的属性并不是保留字,但我们要把它们当保留字对待,在代码的最顶级----不在任何函数的JavaScript ----可以使用this来引用全局对象

    比如我们在script标签下方第一行定义

     var global=this  //定义一个引用全局对象的全局变量
    

    有小伙伴可能就疑问了,不是可以直接使用window吗?
    其实window是存在客户端JavaScript的全局对象,也就是在浏览器中调用了JavaScript代码的全局对象,不过一般我们写的代码都是存在浏览器客户端的,但还是要区别一下。

    这里有个区别,我们常写的window的w都是小写而调用的全局,但全局其实是Window(大写的W),而window是Window下的一个属性,它调用了它本身,效果相同但意义不同,所以Window下的window属性可以代替this来引用全局对象,Window对象定义了核心全局属性,同时也针对Web浏览器和客户端JavaScript定义了一少部分其他全局属性,就比如xy坐标

    包装对象

    JavaScript一切皆对象,小伙伴们应该不陌生了吧,初学者也应该会听过,为什么说一切皆对象呢?
    我们看个简单的例子

       var s="hello world!"
       var world=s.substring(s.indexOf(" "))
       console.log(world,s.length)
    

    打印什么就不写了,总之没有报错,不了解字符串方法的小伙伴可以自行查找一下
    这里很明显,JavaScript中的字符串当成了一个对象,通过 . (点)调用了对象下面的属性substring以及indexOf,那字符串就是对象了?

       console.log(typeof s == typeof Object) 很明显输出的是false 字符串怎么会是对象呢
    

    但我们转变一下

       console.log(typeof String==typeof Object)   好嘛 它变true了
    

    我们都知道只有对象才有属性,大家应该知道字符串的申明有两种,一种是字面量直接赋值,另一种就是构造函数实例对象new String(),这个大家应该知道。那length就是new String()中的一项属性,当我们s.length 也就是通过s调用属性的时候,JavaScript会将字符串值通过new String(s)的方式将s转换成对象,这是JavaScript内部完成的,此时s这个对象(注意此时变成了实例对象了)就继承了字符串的方法,继承跟原型下面我会提到,暂时不懂没关系!

    好,此时我想大家又懵了,那既然s是个对象了,为什么我们typeof 还是string呢?我们看下面一个例子
      var s='test'
      s.len=4;
      var r=s.len
      console.log(r)  //undefined
    
      var s='test'
      s.length=4;
      var r=s.length
      console.log(r) //4
    
      var s='test'
      s.length=5;
      var r=s.length
      console.log(r)//4
    

    先说下原理,方便大家理解。第二行我们调用了一个len属性,我们称之为临时字符串对象,为什么是临时?因为JavaScript立刻会销毁这个对象,其实这个属性值真的被创建了,只是立马被JavaScript销毁了,所以我们打印的时候打印undefined,注意 属性是不会报错的,只会报undefined,报错的是方法

    接下来就好理解了,第一块代码,第二行我们给new String(s)这个对象申明了一个属性len,值为4,但是刚出生就夭折了,入土了,哦不,应该是灰飞烟灭了,第三行我们再去找这个值找不到了

    第二块代码,length是new String()中的属性,而s继承了这个属性,即可完美调用,所以这个值存活下来了,他成长了

    第三块代码,诶 又来了,此时我们先将5调用给s.length,好嘛第三个赋值r 发现打印的不是5,是4!好,其实这不是销毁,只是一个普通的JavaScript函数原理,首先s.length,length是s对象中的一个属性,很明显这个属性是个方法,他返回的是字符串的长度,这个方法是固定的,所以我们在第三行调用的时候,哪怕前面已经赋值,但重新调用属性的时候,它还是获取的字符串长度,如果我们换个写法

    var r=(s.length=5) 此时打印的就是5了
    

    可能讲的不是很清楚,如果没看懂可以再下方留言
    这就是简单的包装对象,其实很像构造函数,相似的还有Number Boolean 都是一样的道理,所以我们常说JavaScript一切皆对象

    相关文章

      网友评论

          本文标题:js对象深入理解(一)

          本文链接:https://www.haomeiwen.com/subject/bkbcqqtx.html