资讯专栏INFORMATION COLUMN

js 零碎知识整理

liaorio / 585人阅读

摘要:,看了这样的解释,或许让你更摸不着头脑了。弹出弹出在这个例子中,只要会使用浏览器的朋友,都能看得出来完全继承了的属性和方法,否则是无法解释的,因为在中并没有定义属性和,那么按常理推断在的实例对象中,并不会出现这两个属性。

快速删除尾部数组
var arr=[1,2,3,4,5];
arr.length=3;
console.log(arr)//[1,2,3]

直接改变数组的length的值

从数组中移除重复元素
var arr = [1,1,2,2,3,3]
const removeDuplicateltems = arr => [...new Set(arr)];
console.log(removeDuplicateltems(arr))//[1,2,3]
/**
* ...拓展运算符,是遍历Symbol.iterator 
* 和for...of一样的遍历方法
*/    
函数作为值传入
//把函数作为值传入进去
    function callSomeFunction(someFunction,someArgument){
      return someFunction(someArgument);
    }

最终调用的这个函数 他有两个参数, 第一个参数是一个方法 , 第二个参数是第一个方法的参数。

    function add10(num){
      return num + 10;
    }
    var result1=callSomeFunction(add10,10);
      console.log(result1);//20

这个例子稍微一看就明白了吧, 传入的10 最终成了add()的参数, 也就是成了num, 所以结果是20

    function getGreeting(name){
      return "holle," + name;
    }
    var result2=callSomeFunction(getGreeting, "Nicholas");
    console.log(result2);//holle Nicholas

上面的理解了 这个也就不难了 同理 “ Nicholas” 变成了getGreeting() 的参数 name,所以输出结果是 holle Nicholas

call() 理解

先看看关于call()的官方解释,“调用一个对象的一个方法,以另一个对象替换当前对象。”,看了这样的解释,或许让你更摸不着头脑了。看例子:

var x = "我是全局变量";    //定义全局变量x
function a(){         //定义函数类结构a  
    this.x = "我是在函数类结构a中声明的哦";    
}
//定义普通函数,弹出当前指针所包含的变量x的值
function f(){       
    alert (this.x);
}
f.call(new a());//返回值为“我是在函数类结构a中声明的哦”

我的理解是,f.call(new a())就是把函数(其实也是对象)f复制到被调用对象“new a()”下面去解析,事实上和下面这段代码的解析结果一样:

function a(){
  this.x = "我是在函数类结构a中声明的哦";
  alert(this.x);    //我是在函数类结构a中声明的哦
}
a();

只不过此时变量X的作用域不同而已,咿…看起来好像有点继承的味道哦,难道不是吗?在上例中,f完全被构造函数a的实力对象继承了,如果说这还不足以说明a.call(b)是一种继承模式,那么再看一个更具有继承味道的用法吧。

function f(){    
    this.a ="a";    
    this.b = function(){    
        alert("b");
    }
}
function e(){    
    f.call(this);     
}
var c = new e();
alert(c.a);  //弹出a
c.b();    //弹出b

在这个例子中,只要会使用浏览器的朋友,都能看得出来e完全继承了f的属性和方法,否则是无法解释的,因为在e中并没有定义属性a和b,那么按常理推断在e的实例对象c中,并不会出现这两个属性。

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

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

相关文章

  • 零碎知识(一)

    摘要:同时,由于本身的实现大部分是纯函数,因此在版本中,一些不含副作用的均在中暴露了以为前缀的函数方法,也可以直接导入使用。在浏览器中神秘丢失尝试检查被请求的是否存在尾部斜线,具体原因暂时没有找到相关资料。 写在前面 最近没怎么写新的东西,一是因为一直在准备换新的工作,所以一直在准备面试,二是因为过年,心静不下来,所以也无法输出或者翻译一些文章,三是由于手头还有一些遗留工作需要完成和交接,比...

    ernest.wang 评论0 收藏0
  • webpack-demos:全网最贴心webpack系列教程和配套代码

    摘要:全网最贴心系列教程和配套代码欢迎关注个人技术博客。所以我花费了个多月整理了这份教程,一共分成节,每节都有讲解,并且准备了配套代码。奈何深感水平不够,只有一腔热情,所以直接开放了教程和源码。 webpack-demos:全网最贴心 webpack 系列教程和配套代码 欢迎关注个人技术博客:godbmw.com。每周 1 篇原创技术分享!开源教程(webpack、设计模式)、面试刷题(偏前...

    LMou 评论0 收藏0
  • JavasScript重难点知识

    摘要:忍者级别的函数操作对于什么是匿名函数,这里就不做过多介绍了。我们需要知道的是,对于而言,匿名函数是一个很重要且具有逻辑性的特性。通常,匿名函数的使用情况是创建一个供以后使用的函数。 JS 中的递归 递归, 递归基础, 斐波那契数列, 使用递归方式深拷贝, 自定义事件添加 这一次,彻底弄懂 JavaScript 执行机制 本文的目的就是要保证你彻底弄懂javascript的执行机制,如果...

    forsigner 评论0 收藏0
  • 零碎知识(二)

    摘要:目录零碎的知识一新的媒体查询属性这个媒体查询属性的作用是,当用户在操作系统中设置了的选项时,能够根据其值声明不同的样式,因为有的人可能喜欢炫酷的特效,有的人可能更倾向于内容比如我,而有的人甚至因为生理问题无法接受这些特效。 目录 零碎的知识(一) 新的媒体查询属性 prefers-reduced-motion https://developers.google.com...https...

    wqj97 评论0 收藏0
  • 每天一个设计模式之组合模式

    摘要:作者按每天一个设计模式旨在初步领会设计模式的精髓,目前采用和两种语言实现。诚然,每种设计模式都有多种实现方式,但此小册只记录最直截了当的实现方式原文地址是每天一个设计模式之组合模式欢迎关注个人技术博客。 作者按:《每天一个设计模式》旨在初步领会设计模式的精髓,目前采用javascript和python两种语言实现。诚然,每种设计模式都有多种实现方式,但此小册只记录最直截了当的实现方式 ...

    不知名网友 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<