美文网首页
2016年学习笔记

2016年学习笔记

作者: JUN仔_8cea | 来源:发表于2020-02-16 00:02 被阅读0次

    ///////////////////////////////////////////////////////////////////////////////

    对于一个常驻的变量(对象),比如:

    oUserinfo={

    uid:xx,

    wid:xx,

    info:{}

    }

    通常需要一些方法来对其进行修改,常用的写法是

    oUseinfo.setUid=function(xxx){

    //这里是各种判定

    this.uid=xxx;

    }

    在使用的时候可以直接使用oUserinfo.setUid(xxx);

    而不用每次修改的时候进行判定了

    场景:1、对象常驻 2、属性经常会被改变 3、触发属性改变的时候需要做很多判断和输入值的调整、拼接等转换操作

    ///////////////////////////////////////////////////////////////////////////////

    chrome插件开发:

    manifest中的一些重要属性:

    1、点击插件弹出小窗口:

    "browser_action": {

    "default_icon": "images/logo.png",

    "default_title":"hello title",

    "default_popup":"popup.html"

    },

    小窗口中的内容为default_popup中的html文件

    2、监听点击插件:

    "background": {

    "scripts":["background.js"],

    "persistent": false

    },

    监听脚本在background.js

    注意:background中还可以设置page属性,是一个html文件,但page和scripts这两个属性只能使用一个,否则会报错

    另外,如果想要监听插件点击,则不可以使用default_pupup属性

    3、要想插件自动更新,则可以使用以下属性: 

    "update_url":"http://192.168.101.7/h5pro/apps/chrome_plugins/demo",

    目录设置到插件目录,这样,就不用每次更改插件都重新加载了,很方便开发。当然,如果改了manifest文件,则还是需要重新加载的

    4、获取一些重要权限: 

    "permissions":[

    "http://*/",

    "notifications",

    "tabs",

    "activeTab",

    "storage",

    "cookies"

    ],

    "http://*/"这个权限非常重要,这样你就可以讲该插件应用到所有的网站了,否则,该插件只能在localhost使用

    5、关于content_scripts: 

    "content_scripts": [{

    "matches": ["http://*/*","https://*/*"],

    "css": ["css/1.css"],

    "js": ["js/jquery.js","js/1.js"]

    }]

    这里的matches很重要,只有满足matches的网址才会被应用该插件。

    js中1.js可以被自动执行

    ///////////////////////////////////////////////////////////////////////////////

    并排的几个display:inline-block的元素为什么会出现错位呢?

    是因为inline-block是基于baseline定位的,当他们大小不一致的时候,就会出现上下不整齐的情况,只要设置好他们的高度相同,则不会再错位了

    ///////////////////////////////////////////////////////////////////////////////

    这是一种十分推荐的写法:

    (function(){

    }).call(this);

    这里的this是外部的环境,在内部用this.xxx定义的变量实际上是可以在外部被访问到的,而内部的变量则对外不可见。好处:

    1、一个js文件,如果使用这种写法作为整体结构,那么,this指向window,这样的话,就不用担心过多无用变量暴露在外面,而仅仅是将你需要赋给全局的变量用this.xxx

    2、十分简洁地就可以实现内部变量赋值给外部环境。

    ///////////////////////////////////////////////////////////////////////////////

    判断是否为数组类型:

    typeof [] =>object

    [] instanceof Array =>true

    所以判断数组不能采用typeof来判断,而应该用instance

    ///////////////////////////////////////////////////////////////////////////////

    本地存储:

    localStorage、sessionStorage、cookie

    localStorage和sessionStorage区别:前者是永久性存储,后者是会话级存储,窗口或标签关闭后就没有了

    前两者都都是window内置对象,有setItem、removeItem、setItem、clear等方法(这些方法都是继承自Storage,因为他们的__proto__都是Storage)。他们的改变会出发window的storage事件,所以,可以用window.addEventListener(’storage’,function(){},false)来监听本地存储的变化

    而cookie则是document的一个属性,增删查改都需要手动添加,而且,每次的请求都会讲cookie发送给服务端,会额外增加带宽。

    cookie跨域解决(php):

    A 机器所在的域:a1.main.com,A 有应用 main.php

    B 机器所在的域:b1.test.com,B 有应用 test.php

    在 main.php 里设置 cookie 的时候, cookie 的设置方法如下:

    setcookie( "TestCookie",  "okol",  time() + 3600,  "/", "b1.test.com", 1 ); //将cookie共享域名添加上

    If-Modified-Since:当资源过期时(使用Cache-Control标识的max-age),发现资源具有Last-Modified声明,则再次向web服务器请求时带上头 If-Modified-Since,表示请求时间。web服务器收到请求后发现有头If-Modified-Since 则与被请求资源的最后修改时间进行比对。若最后修改时间较新,说明资源又被改动过,则响应整片资源内容(写在响应消息包体内),HTTP 200;若最后修改时间较旧,说明资源无新修改,则响应HTTP 304 (无需包体,节省浏览),告知浏览器继续使用所保存的cache。

    ///////////////////////////////////////////////////////////////////////////////

    regex="a.*?d";// 懒惰匹配

    regex2="a.*d"// 贪婪匹配

    ///////////////////////////////////////////////////////////////////////////////

    es6的forEach、map、filter:

    // forEach仅仅是遍历数组

    forEach((value, index, callback) =>{

        xxx

    });

    // 而map则是按照return返回值对每个每个数组进行操作,遍历操作之后的值为return之后的值

    map((value, index, callback) => {

        return xxx;

    });

    // filter 则是过滤器,return 出的结果为true则通过,否则不通过

    filter((callback) => {

        return true/false; // 一旦返回true,则通过,返回的值被判断为true则通过,否则不通过,比如,0不通过,1会通过

    });

    ///////////////////////////////////////////////////////////////////////////////

    String()和toString() 区别:

    前者可以把null、undefined转换成'null'、'undefined',后者这么转则会报错

    数字转换成字符串时,前者不存在进制转换,后者可以转换成对应进制

    String(null) => 'null'

    10.toString(8); => 12

    相关文章

      网友评论

          本文标题:2016年学习笔记

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