首页
学习
活动
专区
圈层
工具
发布

之 设计并实现第一个JS模块?

这篇文章不太好写,谈目前网上的多数教程,谈到JS模块必贴代码,而我一向不喜欢在公众号文章里写代码,因为难以阅读。所以我尝试从“构思”的角度,来写一下本文。...就是图上画红框的地方,说它全站级别,是因为从图上来看,是整个网站应该都能看到它;说它是广播模块,因为从图上来看,它的功能就是不断的更新一些站内新闻。 所以把它称之为一个全站级别的广播模块。...JS模块,从前端的发展路径来讲,其实一个function函数,就是一个模块,后来搞成用一个对象,里面来包含函数,形成封闭式的模块。...所以我在这里只说如何用JS去实现业务逻辑,而不会去讲,这东西用React怎么做,用angular又怎么做,用vue又怎么做。...function news(){ var _html = ''; get(newsAPI.ajax,function(d){ _html = '用户' + d.name + '喜欢了

1.1K80

2018年各大互联网前端面试题五(今日头条)

针对移动浏览器端开发页面,不期望用户放大屏幕,且要求“视口(viewport)”宽度等于屏幕宽度,视口高度等于设备高度,如何设置? 概念 Bom是什么?列举你知道的Bom对象。...了解过hybrid通信的实现原理么 fetch和ajax的区别 data-xxx 属性的作用是什么?...框架 用过NodeJS的EventEmitter模块吗,它是怎么实现功能的,步骤是什么? 说说Vue框架,对于对象引用的情况呢? react怎样提高性能。...手写bind函数 如何用CSS实现一个三角形 promise、setTimeout、async/await的执行顺序。 arguments是数组吗?怎么实现用它调用数组方法?类数组和数组的区别是什么?...给一个多行多空格的字符串,让你分割成三行三列的数组。 随意给定一个无序的、不重复的数组data,任意抽取n个数,相加和为sum,也可能无解,请写出该函数。

14500
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    2018年各大互联网前端面试题五(今日头条)

    针对移动浏览器端开发页面,不期望用户放大屏幕,且要求“视口(viewport)”宽度等于屏幕宽度,视口高度等于设备高度,如何设置? 概念 Bom是什么?列举你知道的Bom对象。...了解过hybrid通信的实现原理么 fetch和ajax的区别 data-xxx 属性的作用是什么?...框架 用过NodeJS的EventEmitter模块吗,它是怎么实现功能的,步骤是什么? 说说Vue框架,对于对象引用的情况呢? react怎样提高性能。...手写bind函数 如何用CSS实现一个三角形 promise、setTimeout、async/await的执行顺序。 arguments是数组吗?怎么实现用它调用数组方法?类数组和数组的区别是什么?...给一个多行多空格的字符串,让你分割成三行三列的数组。 随意给定一个无序的、不重复的数组data,任意抽取n个数,相加和为sum,也可能无解,请写出该函数。

    1.6K30

    求职 | 史上最全的web前端面试题汇总及答案2

    因为它涉及浏览器兼容、跨域等问题,在项目中一般会使用一些基础类库辅助实现,如jQuery等。 一个简单的Ajax操作如下。 5、谈谈你对JSON的理解。...④Ajax可以实现动态不刷新(局部刷新) 缺点: ①安全问题 AJAX暴露了与服务器交互的细节。 ②对搜索引擎的支持比较弱。 ③不容易调试。...③当然jQuery还有非常有用的其它特性,如为dom对象绑定数据、动画、等。并且jQuery还非常容易扩展,在它的基础上开发非常灵活,也有众多的插件可用,如jQueryUI、easyUI等。...6、ajax、get、post、ajaxSetup、getJSON各有何用途? ①ajax:jQuery对ajax执行的核心方法。其它ajax方法都是使用该方法实现。...②在jQuery中有专门的获取服务器json数据的方法,getJSON(),在回调中,jQuery会自动将json转换为javascript对象。 8、addClass、css有何用途?

    8.4K20

    关于ajax学习笔记

    AJAX缺点: ajax不支持浏览器back按钮。 安全问题 AJAX暴露了与服务器交互的细节。 对搜索引擎的支持比较弱。 破坏了程序的异常机制。 不容易调试。...当我们使用AJAX之后,浏览器是先把请求发送到XMLHttpRequest异步对象之中,异步对象对请求进行封装,然后再与发送给服务器。...二、ajax 的执行过程 创建XMLHttpRequest对象,也就是创建一个异步调用对象 创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息 设置响应HTTP请求状态变化的函数 发送...的示例:瀑布流 要实现2个地方: 滚动到底部判断(包含视口的底部和总的底部) 瀑布流里面的内容需要错位显示 8.1 滚动到底部判断 我们需要知道: 总文档高度 已经滚动的高度 视口高度,通过$(document...).height(); 获取,视口底部来触发ajax 获取下一页的数据 总文档高度-已经卷动高度-视口高度 ajax 请求。

    2.2K20

    从零开始学 Web 系列教程

    现在就让我们一起进入 Web 前端学习的冒险之旅吧! 前言 昨天收到一个朋友的留言反馈,意思是说文章太多,找起来很麻烦,做个索引页就好了。...这个建议特别好,于是下面就是整个《从零开始学 Web 开发》所有内容的索引,并且按照知识点的分类排列好,每一篇文章的主要内容也简单的列举出来。...本索引将长期不定期更新…… 索引 从零开始学 Web 之 HTML 从零开始学 Web 之 HTML(一)认识前端 什么是前端 网页组成 Web 标准 浏览器内核 认识 HTML HTML 结构标准 标签分类...)BOM的概念,一些BOM对象 BOM 的概念 BOM 顶级对象 系统对话框 页面加载对象 location 对象 history 对象 navigator 对象 从零开始学 Web 之 BOM(二)定时器...Web 之 CSS3(七)多列布局,伸缩布局 从零开始学 Web 之 CSS3(八)CSS3三个案例 从零开始学 Web 之 移动Web 从零开始学 Web 之 移动Web(一)屏幕相关基本知识,调试,视口

    5.3K50

    【Hello CSS】第三章-浏览器的视图与坐标

    如:打印机输出可达600DPI的分辨率,表示打印机可以在每一平方英寸的面积中可以输出600X600=360000个输出点。...这个特性主要被用于移动设备,但是也可以用在支持类似“固定到边缘”等特性的桌面浏览器,如微软的Edge。 按百分比计算尺寸的时候,就是参照的初始视口(viewport)。...初始视口指的是任何用户代理和样式对它进行修改之前的视口。桌面浏览器如果不是全屏模式的话,一般是基于窗口大小。 在移动设备上(或者桌面浏览器的全屏模式),初始视口通常就是应用程序可以使用的屏幕部分。...图上信息就不作过多的解释了,有需要详细了解的可以参考https://zh.wikipedia.org/笛卡尔坐标系 WEB中的坐标系统 上面介绍的是我们数学概念中的坐标系,在WEB页面中,也有相应的坐标系统...如果你也喜欢 CSS,喜欢探讨技术,或者对本文,本系列有任何的意见或建议,鱼头非常希望你能加入一个有趣的微信群 — “进击的CSS”。

    2.7K20

    一个小时学会jQuery

    收集一组元素,可以使用如下简单的语法: $(selector) 或者 jQuery(selector) 也许刚开始你会觉得$()符号有点奇怪,但大部分jQuery用户很快就喜欢上它的简洁。...:last') //最后一个节点 $("td:even") //索引为偶数的节点,从 0 开始 $("td:odd") //索引为奇数的节点,从 0 开始 $("td:eq...(1)") //给定索引值的节点 $("td:gt(0)") //大于给定索引值的节点 $("td:lt(2)") //小于给定索引值的节点 $(":focus") //当前获取焦点的节点...settings是ajax参数对象,如: //ajax一般形式,路径也可以使用setting中的url属性 $.ajax(""some.php"", { type: "POST", data...设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 可用于控制不同的 Ajax 事件。

    22.4K71

    Bootstrap笔记

    /ajax/libs/jquery/1.11.3/jquery.min.js"> 的视口(承载页面的容器)宽度都是980;视口的宽度可以通过meta标签设置此属性为移动端页面视口设置,当前值表示在移动端页面的宽度为设备的宽度,...第三方依赖jQueryBootstrap框架中的所有JS组件都依赖于jQuery实现html5shiv让低版本浏览器可以识别HTML5的新标签,如header、footer、section等respond...视口 视口的作用:在移动浏览器中,当页面宽度超出设备,浏览器内部虚拟的一个页面容器...,将页面容器缩放到设备这么大,然后展示 目前大多数手机浏览器的视口(承载页面的容器)宽度都是980; 视口的宽度可以通过meta标签设置 此属性为移动端页面视口设置,当前值表示在移动端页面的宽度为设备的宽度

    4.6K90

    据说看了这篇文章的小伙伴,都找到前端工作了,不信试试看

    * 请指出 JavaScript 宿主对象 (host objects) 和原生对象 (native objects) 的区别?...* 请尽可能详尽的解释 Ajax 的工作原理。 * 使用 Ajax 都有哪些优劣? * 请解释 JSONP 的工作原理,以及它为什么不是真正的 Ajax。...* 请解释什么是单页应用 (single page app), 以及如何使其对搜索引擎友好 (SEO-friendly)。 * 你使用过 Promises 及其 polyfills 吗?...* 你会使用怎样的语言结构来遍历对象属性 (object properties) 和数组内容? * 请解释可变 (mutable) 和不变 (immutable) 对象的区别。...* 如何用你自己的代码来实现不变性 (immutability)? * 请解释同步 (synchronous) 和异步 (asynchronous) 函数的区别。

    1.2K70

    JS的面试题(一)

    有数组索引组成的数组,或由对象属性组成的数组 14.说一说深拷贝的理解? 将值是基础类型的属性直接拷贝,将值是数组或者对象的属性进行重新遍历。...方法执行完毕之后返回jquery对象 50、ajax实现的步骤?...jQuery.noConflict() jQuery 使用 noConflict 方法来放弃 调用时的命名,之后由 jQuery 代替 进行编写 54、如何用jQuery获取元素在文档中的位置?...(口述) 点击标签给当前标签设置样式,其他标签删除样式,与点击标签的索引对应的内容显示,其他内容隐藏 57、jQuery获取索引的两种方式?...index= (this).index() 所有同辈元素中的索引 index= (“li:even”).index($(this)) 在匹配选择器的元素中的索引 58、如何将对象转成json字符串?

    1K10

    “推荐系统”加上“图神经网络”

    如何用协同过滤做推荐? NGCF是如何构图的?NGCF在基础的GNN上有哪些改动?如何用NGCF做推荐? 协同过滤 协同过滤(CF)是一种常用的推荐系统做法。...协同,指收集广大用户的口味;过滤,指过滤出『我』可能喜欢的物品。这个方法通过收集用户的兴趣和口味,给用户推荐口味相近的人喜欢的物品。...例如『你浏览的这个电影,喜欢它的用户也喜欢以下电影』这种『用户-物品-用户-物品』三阶信息,就是一种『高阶交互历史信息』。这种信息在推荐系统中无疑是非常重要的。 ?...首先,要将历史交互构图;然后,在这个交互图上,使用GNN来嵌入『高阶交互历史信息』,获得节点(用户、物品)的embedding;最后,通过embedding来近似历史交互矩阵 ? 。...过程如下: 使用交互历史构图; 在图上,使用GNN学习embedding ? ; 和MF类似,使用矩阵的乘积 ? 去近似交互矩阵 ? 。 NGCF如何构图?

    2.6K41

    【愚公系列】2021年12月 Typescript-接口的使用

    属性类接口 1.1 未使用接口的情况: 1.2 使用接口 1.3 类型断言 1.3 额外的属性检测 1.4 可选属性 通过ajax实例演示 属性类接口 三、函数类型接口 四、可索引接口 4.1 可索引接口...对数组的约束 4.2 可索引接口 对对象的约束 五、类类型接口 ,利用implements实现接口 六、接口扩展 6.1 类实现接口 - 类类型接口 前面已讲 6.2 接口可以继承接口 6.3....(不常用) 可索引接口:数组、对象的约束 (不常用) ts定义数组的方式 /* var arr:number[]=[2342,235325] var arr1:Array=[‘111’,‘222...']; console.log(arr[0]); var arr:UserArr=[123,'bbb']; /*错误*/ console.log(arr[0]); 4.2 可索引接口 对对象的约束...Other Types 类型别名还可以用于其他类型,如基本类型(原始值)、联合类型、元组。

    64320

    尚能饭否|技术越来越新,我对老朋友jQuery还是一如既往热爱

    不过呢,我身为后端开发,也就是一个新人于前端来说,所以我还是很喜欢jQuery的思想,因为让我直接理解Vue/React的话,还是需要大量时间的,所以认为jQuery是一个不错的过渡选择,也可以学习下前端编程思想...4.与Ajax技术的完美结合 5.大量插件在页面中的运用 3、搭建jQuery开发环境 「流程:」 准备两份文件如下: ?...属性过滤选择器,根据元素的某个属性获取元素,如ID号或匹配属性值的内容,并以“[”号开始,以“]”结束,ps:最后一个是复合属性选择器 ? 子元素过滤选择器,注意:nth-child索引从1开始 ?...表单对象属性过滤选择器,通过表单中的某对象属性特征获取该类元素,如:enabled、disabled、checked、selected属性 ? 「选择器综合案例:」 整体如下: ? ? 代码如下 对象 「关系:」 jQuery对象就是通过jQuery包装DOM对象后产生的对象 注意:jQuery对象是包装DOM对象后产生的,但是jQuery无法使用DOM对象的任何方法,同理DOM对象也不能使用

    1K50

    前端工作面试经典问题(超级全)

    你是如何组织自己的代码?是使用模块模式,还是使用经典继承的方法? 请指出 JavaScript 宿主对象 (host objects) 和原生对象 (native objects) 的区别?...请指出浏览器特性检测,特性推断和浏览器 UA 字符串嗅探的区别? 请尽可能详尽的解释 AJAX 的工作原理。 请解释 JSONP 的工作原理,以及它为什么不是真正的 AJAX。...请解释什么是单页应用 (single page app), 以及如何使其对搜索引擎友好 (SEO-friendly)。...你会使用怎样的语言结构来遍历对象属性 (object properties) 和数组内容? 请解释可变 (mutable) 和不变 (immutable) 对象的区别。...如何用你自己的代码来实现不变性 (immutability)? 请解释同步 (synchronous) 和异步 (asynchronous) 函数的区别。 什么是事件循环 (event loop)?

    1.4K80

    python接口自动化40-盘点requests那些不常用(面试经常问)的高级技能

    前言 如果面试问你如何用 python 发 get/post 请求? 这种问题只要是个小白花10分钟随便看下博客都能学得会。 面试官如果知道你是资深的,还是初级的呢?...面试其实最喜欢考那些你不常用的功能(工作中用不到的),因为你用不到这些功能,所以会被你忽略! 代理功能 如何用 requests 库使用代理? 如果你没接触过爬虫,其实基本上用不到代理功能。...但是面试嘛,上面说到,你越是忽略的东西,它越是喜欢问你(其实没卵用,了解下什么是 SSL 证书就行了) 如果你本地已经有了证书,也可以指定本地的证书 获取响应时间 关于如何获取接口的响应时间,可以关注我前面这篇...Ajax 异步请求 什么是异步请求,什么是同步请求?...通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

    79320

    Java进阶学习路线图「建议收藏」

    面向对象编程 理解对象的本质,以及面向对象,类与对象之间的关系,如何用面向对象的思想分析和解决显示生活中的问题, 并java程序的手段编写出来。...常用设计模式如单利、模版等模式。 什么是异常 异常的捕捉和抛出 异常捕捉的原则 finally的使用,package的应用 import关键字。...SQL语句 数据库的创建,表的创建,修改,删除,查询,索引的创建,主从表的建立,数据控制授权和回收,事务控制,查询语句以及运算符的详解,sql中的函数使用。...ajax及框架技术 了解和属性原生态的ajax的使用,ajax使用的场合,使用ajax的好处,ajax框架jquery渲染页面效果和相关的强大的第三方类库,dwr如何和后台服务进行数据传输,以及页面逻辑控制等...lucene搜索引擎 了解全文搜索原理、全文搜索引擎、什么是OSEM、OSEM框架Compass、基于使用Lucene使用Compass实现全文增量型索引创建和搜索、探索Lucene 3.0以及API。

    1.2K30
    领券