码迷,mamicode.com
首页 > 其他好文 > 详细

原生方法系列(查缺补漏 不断更新)

时间:2016-02-21 22:42:43      阅读:206      评论:0      收藏:0      [点我收藏+]

标签:

Function.call   Function.apply

将其他对象的方法"借用"在自己身上用(this)    Function.call 和Function.apply的行为非常相似  只不过是Function.call接受的参数列表 Function.apply接受的是参数数组

    var friend = {
         food:0,
            eat:function(amount,money) {
                this.food = amount;
                console.log(money);
            }
        }//friend对象有一个eat方法  设置自己的food属性 并且输出相应的money
        var me = {
            food:0,
            isHungry:function() {
                return this.food < 100;
            }
        }  //me只有一个根据food值判断是否饥饿的方法 me很懒 想使用朋友的eat方法(可以理解为喂我吃) 通过this的绑定eat方法中的this指向了我 所以我不在饥饿了

        console.log(me.isHungry());
        friend.eat.call(me,100,"120");  //call 接受参数列表
        console.log(me.isHungry());
        friend.eat.apply(me,[100,"120"]); //apply 接受参数数组
        console.log(me.isHungry()); 

 生成对象的三种方法

对象字面量 

  

    var dog = {
            name:"ha",
            say:function() {
                return "wang";
            }
        }
    dog.age = 9;
    console.log(dog.age) //9

其实可以理解为对象字面量是Object.create()的一种快捷调用  

        var dog = Object.create(Object.prototype,{
            name:{
                value:"sss"
            },
            say:{
                value:function() {
                    return "wang";
                }
            }
        });

        console.log(dog.say()); //wang  //会在下面介绍Object.create()


这种方式是创建简单的一次性对象的最佳选择  

new Object()    

        var dog = new Object({
            name:"haha",
            say:function() {
                return "wang";
            }
        });

        console.log(dog.say());//wang 

通过原生对象的构造函数进行对象的创建     注意原生对象的构造函数是属于全局命名空间的 也就是通过winow.Object能获取到这个构造函数(有可能被修改了)

Object.create(args1,args2)   第一个参数是提供原型的对象  第二个参数是提供可选属性的对象   Object.create() 提供了new操作符的优点

        var person = {
            getOld:function() {
                this.age = this.age + 10;
                return this.age;
            }
        }
          var haha = Object.create(person,{
              age:{
                  value:10,
                  writable:true
              }
          });
          console.log(haha.getOld());  //20

第二个参数可选属性对象相应的属性配置需要配置 否则 默认为false  就是不可修改 不可以枚举 

 

window.getComputedStyle(元素,伪类)  第二个参数不是必须的   使用这个方法可以获得当前元素所有使用的最终的CSS属性值  返回一个样式声明对象  它是一个只读的对象 

对比 element.style   element.style 也能获得一个元素的样式声明对象  但是element.style只能获取元素style属相里面设置的css属性  但是element.style 是可以读写的

在老版本的IE上是不支持window.getComputedStyle()这个方法的 可以使用element.currentStyle  它同样是一个只读的对象  我在IE11 上window.getComputedStye()  element.currentStyle 都支持     

要获取我们获得的样式声明对象obj(无论是通过window.getComputedStyle() 或者 element.currentStyle获取的)   可以通过 obj.attrName 或者   obj[‘attrName‘]  这样的方式获取  

但是在不同的浏览器下同样的属相  attrName 的定义又有可能不同    通用的方法是  使用getPropertyValue(‘attrName‘)     (不支持驼峰  获取background-color   getPropertyValue(‘background-color‘))

 

原生方法系列(查缺补漏 不断更新)

标签:

原文地址:http://www.cnblogs.com/tiantianwaigong/p/5194612.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!