资讯专栏INFORMATION COLUMN

javscript学习笔记

hedge_hog / 616人阅读

摘要:一直对抱有敬畏的态度,也没有一直深入学习。当学到各种框架的时候才发现力不从心,感觉到了基础的重要性,重新认真的系统的学习一下。

一直对javscript抱有敬畏的态度,也没有一直深入学习。当学到各种js框架的时候才发现力不从心,感觉到了javascript基础的重要性,重新认真的系统的学习一下。

一、一些不同 1. javscript没有块级作用域

于是es6中有了let和var
模拟js的块级作用域

</>复制代码

  1. function outputNumbers(count){
  2. (function(){
  3. for(var i=0;i
  4. 2. javascipt中this用法不同
  5. 它指向调用它的那个对象

  6. 3. 闭包是指有权访问另一个函数作用域中的变量的函数。
  7. </>复制代码

    1. function createAFunction(){
    2. return function(){
    3. return "这是一个闭包";
    4. }
    5. }
  8. 二、基本数据类型
  9. undefinednullbooleanstringnumberobjectfunction
    它们有对应的方法
    Boolean()String()Number()Object()

  10. 1. undefined
  11. 没有被定义就会返回undefined,是null衍生出来的,因些undefined==null 返回true

  12. 2. null
  13. 由于历史原因 typeof null返回object

  14. 3. boolean
  15. Boolean()
    0返回true
    0nullundefined返回false

  16. 4. string
  17. String()
    不管传入什么都会原样返回,但如果是function,会执行该方法并返回undefined
    toString(参数,进制)
    toUpperCase()
    toLowerCase()
    substring(parm1,parm2)
    substr()
    charAt(1)
    charCodeAt(2)
    concat()
    slice()
    indexof()
    lastIndexOf
    trim()
    search(pattern) //返回索引
    replcae("原","新") //第一个参数支持正则 第二个参数也可以是一个function
    splice(",") //支持正则,支持指定长度
    它只有length属性

  18. 5. number
  19. Number() true=>1 false=>0 null=>0 undefined=>NaN
    Number.MAX_VALUE 最大值
    Number.MIN_VALUE 最小值
    NaN 它是一个特例,不与任何值相等包括自己
    parseInt() //可以查找字符串中的数字并转换
    parseFloat() //可以查找字符串中的数字并转换
    inFinite() //是否在最大值和最小值之间
    toFixed(小数点位数)
    说明:它能够识别科学计数法 比如 2.15e5 => 215000

  20. 6. object
  21. constructor 构造函数
    obj.hasOwnProperty() 是否具有自己的方法
    obj.isProtoTypeOf(object) 检查传入的对象是否是另一个对象的原型
    ob.propertyIsEnumerable(propetyName) 检查给定的属性能否使用for-in
    obj.toLocaleString() 返回执行地区对应的对象的字符串 =>["Object"]
    obj.toString() 返回执行对象的字符串 =>["Object"]
    obj.valueOf() 返回对象序列化之后的结果

  22. 三、运算符
  23. 1. 大于和小于
  24. "23"<"3" //true,字符串的比较跟数字的比较不同
    "a"<3 //false a会被转成NaN
    特别注意:NaN和任何数比都是false
    NaN>3 //false
    NaN<3 //false
    "23"<3 //false "23"会被转成23再与3比较

  25. 2. 全等和不全等
  26. "55"==55 //true 不全等只判断值不判断类型
    "55"===55 //false 全等不仅判断值还判断类型

  27. 四、条件控制语句
  28. </>复制代码

    1. for(proertyName in global){
    2. console.log(proertyName)
    3. }
  29. 五、方法
  30. 注意:javascript和java不同,它没有重载,定义两个方法名相同的方法后面一个会覆盖前面一个。

  31. 六、检测类型
  32. typeof xxx
    // 返回数据类型

  33. 七、引用类型
  34. 1. object
  35. 声明对象的方法
    var obj = new Object();
    var obj = {};

  36. 赋值
    obj.name="xiaomo";

  37. 使用对象的属性
    obj.name
    obj["name"]

  38. 2. Array
  39. 可以存任何类型

  40. 声明
    var arr = new Array();
    var arr = new Array(3);
    var arr = [];

  41. 添加对象
    arr.push("a",b",1,3,4,true)
    操作对象(删除、插入、替换)

  42. 删除:起始位置,要删除的个数
    arr.splice(起始位置,删除的个数)
    例子:arr.splice(2,1) //返回[1] 返回删除的那个数

  43. 插入:起始位置、要删除的个数(0)、要插入的数,可以是多个,返回空数组
    arr.splice(起始位置,删除的个数,参数1,参数2,参数n)
    例子:arr.splice(1,0,"插入的值1","插入的值2","插入的值n")

  44. 替换:起始位置、要删除的项目、要插入的任意项,可以是多个,返回被替换的值
    arr.splice(起始位置,删除的个数,参数1,参数2,参数n)
    例子:arr.splice(0,2,"test1","test2")

  45. 其他数组操作
    arr.push("test") 插入到数组的最后面
    arr.unshift("xiaomo") 插入到数组的最前面
    arr.pop() //删除数组的最后一个值
    arr.shift() //删除数组第一个值

  46. 使用对象
    arr[1]

  47. 数组自带的方法
    arr.reverse(); 反转数组
    arr.sort() 默认升序排列
    arr.sort((a,b)=>{reutrn b-a}) 传入排序方法会按照自定义排序
    arr.concat(另一个数组或者单个参数) 如果传入数组也会被展开拿出来,不会影响原数组
    arr.slice(0,3) 会把选定的部分截取出来生成一个新的数组,不会影响原数组
    arr.indexOf(4) 返回该值存在的下标,不存在返回-1
    arr.lastIndexOf(4) 从倒数开始查找,返回该值存在的下标,不存在返回-1
    arr.every(fn) 对每个参数进行处理,全部符合返回true

  48. </>复制代码

    1. fn=(item,index,array){//当前值、索引、该数组
    2. return item>2
    3. }
  49. arr.some(fn) 对每个参数进行处理,有一个符合就返回true

  50. </>复制代码

    1. fn=(item,index,array){//当前值、索引、该数组
    2. return item>2
    3. }
  51. arr.filter(fn) 对每个参数进行处理,返回过滤后的数组

  52. </>复制代码

    1. fn=(item,index,array){//当前值、索引、该数组
    2. return item>2
    3. }
  53. arr.map(fn) 对每个参数进行处理,返回处理后的数组

  54. </>复制代码

    1. fn=(item,index,array){//当前值、索引、该数组
    2. return item*2
    3. }
  55. arr.forEach(fn) 对每个参数进行处理,没有返回值
    arr.reduce(fn) 对每个参数进行处理,迭代返回最终结果

  56. </>复制代码

    1. fn=(prev,cur,index,array){//前一个值、当前值、索引、数组
    2. return prev+cur
    3. }
  57. arr.reduceRight(fn) 从右边对每个参数进行处理,迭代返回最终结果

  58. </>复制代码

    1. fn=(prev,cur,index,array){//前一个值、当前值、索引、数组
    2. return prev+cur
    3. }
  59. 3. Date类型
  60. 声明:
    var date = new Date(); 创建当前时间 也可以接收参数
    Date.parse(pattern) // 6/13/2016 May 25,2016 或者 yyyy-MM-dd hh:mm:ss格式的 返回时间戳
    new Date(Date.parse(pattern)) // 将时间戳格式化为正常的时间
    new Date(2016,5,19,20,49,15) //也可以用逗号 2016-05-19 20:49:15
    Date.now() //当前时间的时间戳
    toDateString() //返回时间的字符串 星期、日、月、年
    toTimeString() //时、分、秒、时区
    toLocaleDateString() 特定时区的星期、日、月、年
    toLocaleTimeString() 特定时区的时、分、秒、时间

  61. 时间格式

  62. </>复制代码

    1. var date = new Date();
    2. var time = date.getTime() //当前时间的时间戳
    3. var fullYear = date.getFullYear(); //2016
    4. var year = date.getYear(); //116
    5. var month = date.getMonth(); //04 从0开始
    6. var d = date.getDate(); //日 19
    7. var day = date.getDay(); //4 返回星期几
    8. var min = date.getMinitues(); //0
    9. var sec = date.getSeconds() //秒
    10. var mill = date.getMilliSeconds() //毫秒
  63. 4. 正则 RegExp类型
  64. </>复制代码

    1. var re = new RegExp("pattern");
    2. re.test(parm);
    3. // exec 返回匹配的结果
    4. var test = "abcdef.js";
    5. var pattern = /.js$/
    6. var matches = parrten.exec(test);
    7. console.log(matches); // ".js" ,index:6 input:"abcdef.js"
    8. //test 返回true/false
    9. var text = "abcdef.js";
    10. var pattern = /.js$/
    11. pattern.test(text); // true
  65. 5. 方法 function
  66. 方法没有重载,如果是同名,不管参数个数是不是相同,后面定义的方法都会覆盖前面的方法
    每个方法都包含两个属性:length(参数个数)和protoType(原型链)

  67. </>复制代码

    1. function test(a,b){
    2. return a+b;
    3. }
    4. function test(a){
    5. return a;
    6. }
    7. test(1) //1
    8. test(1,2) //1
  68. 你可以不按正常顺序执行方法,因为在执行的时候 function都会被提前

  69. </>复制代码

    1. test();
    2. function test(){
    3. console.log("这是一个方法");
    4. }
  70. 但如果是立即执行的函数则不行

  71. </>复制代码

    1. (
    2. function test(){
    3. }()
    4. )
  72. 方法有两个特殊的内部属性和两个非继承来的方法 call()apply(),以及其他方法 toString()、valueOf()
    argumentsthis
    arguments是类数组,保存着参数。它有arguments.callee()方法

  73. </>复制代码

    1. function factorial(num){
    2. if(num<=1){
    3. return 1;
    4. } else {
    5. return num * arguments.callee(num-1);
    6. }
    7. }
    8. factorial(5); // 5! 1*2*3*4*5
  74. this在javascript中用法比较特殊,它指向它的调用者

  75. </>复制代码

    1. var color="green";
    2. function sayColor(){
    3. console.log(this.color);
    4. }
    5. var o = {
    6. color="pink";
    7. }
    8. o.sayColor(); //pink
    9. sayColor(); //green
  76. protoType 原型链

  77. </>复制代码

    1. function sum (num1,num2){
    2. return num1+num2;
    3. }
    4. // call 参数1:运行函数的作用域 参数2 agruments或者Array
    5. function callSum1(num1,num2){
    6. return sum.apply(this,arguments);
    7. }
    8. function callSum2(num1,num2){
    9. return sum.apply(this,[num1,num2])
    10. }
    11. // apply 参数1:运行函数的作用域 其他参数:就是把apply中的数组拆开
    12. function callSum2(num1,num2){
    13. return sum.apply(this,num1,num2)
    14. }
  78. encodeURIComponent() //encode字符串
    decodeURICopmonent() //decode字符串
    eval(express) //解析字符串表达式
    eval("console.log("我是被解析的表达式")")

  79. 6. Math
  80. Math.E //e
    Math.LN10 //10的自然对数
    Math.LOG10E //以10为底e的对数
    Math.PI //PI
    Math.SQRT2 //2的平方根
    Math.SQRT1_2 // 1/2的平方根

  81. 方法:
    Math.min(Array)
    Math.max(Array)
    Math.ceil(parm) //向上取整
    Math.floor(parm) //向下取整
    Math.round(parm) //标准的四舍五入
    Math.random() // 0-1之间的数
    Math.abs(parm) //绝对值

  82. 八、面向对象的编程方法
  83. </>复制代码

    1. var person = {
    2. name:"xiaomo",
    3. age:25,
    4. sayHello:function(){
    5. console.log(this.name);
    6. }
    7. }
  84. 工厂模式

  85. </>复制代码

    1. function createPerson(name,age,job){
    2. var o = new Object();
    3. o.name = name;
    4. o.age= age;
    5. o.job =job;
    6. o.sayName=function(){
    7. console.log(this.name);
    8. }
    9. return o;
    10. }
    11. var person1 = createPerson("xiaomo",25,"programer");
    12. var person2 = createPerson("xiaoming",20,"it");
  86. 构造函数(不用显式的创建对象,不用返回值,直接把属性赋给this)

  87. </>复制代码

    1. function Person(name,age,job){
    2. this.name = name;
    3. this.age = age,
    4. this.job = job;
    5. this.sayName = function(){
    6. console.log(this.name);
    7. }
    8. }
    9. var person1 = new Person("xiaomo",25,"programer");
    10. var person2 = new Person("xiaoming",20,"it");
  88. 判断类型 instanceof

  89. </>复制代码

    1. person1 instanceof Object //true
    2. person1 instanceof Person //true
  90. 原型模式

  91. </>复制代码

    1. function Person(){}
    2. //实际上隐式的创建一个构造函数constructor
    3. Person.prototype.name="xiaomo";
    4. Person.prototype.age=25;
    5. Person.prototype.job="programmer";
    6. Person.prototype.sayName=function(){
    7. console.log(this.name);
    8. }
    9. //当前也可以这样
    10. Person.prototype={
    11. name="xiaomo";
    12. age=25;
    13. job="programmer";
    14. sayName=function(){
    15. console.log(this.name);
    16. }
    17. }
    18. var person1 = new Person();
    19. Person.prototype.isPrototypeOf(person1); //true
    20. Object.getPrototypeOf(person1.name); //xiaomo
    21. person1.hasOwnProperty("name") //false 存在于protoType中,不存在于实例中
    22. "name" in person1 //true 虽然实例中没有,但是它的原型链有,所以返回true
    23. Object.keys(person1) //会枚举出实例中所有的属性
  92. 九、定时器和延迟执行
  93. </>复制代码

    1. //延迟一秒执行fn函数,只执行一次
    2. let timeout = 1000;
    3. var fn = function(){
    4. console.log("hello");
    5. }
    6. var timeoutId = setTimeout(fn,timeout)
    7. //清除间歇执行函数
    8. clearTimeout(timeoutId);
    9. //定时器,每秒执行fn函数,直到清除定时器
    10. var timeout = 1000;
    11. var fn = function(){
    12. console.log("定时器")
    13. }
    14. var intervalId = setInterval(fn,timout)
    15. //清除定时器
    16. clearInterval(itervalId);
  94. 十、BOM(浏览器相关)
  95. 1. 系统对话框
  96. </>复制代码

    1. alert(); //弹出框
    2. confirm();//确认框
    3. if(confirm("are you sure?")){
    4. console.log("sure");
    5. } else{
    6. console.log("I am not sure!");
    7. }
    8. prompt();//交互框
    9. var result = promot("what"s up?","默认值");
    10. if(result!=null){
    11. alert(result);
    12. }
  97. 2. location对象
  98. 参数

  99. </>复制代码

    1. location.hash //#contents url的hash值
    2. location.host // ip
    3. location.hostname //域名
    4. location.href //http域名
    5. location.pathname //url的目录
    6. location.port //8080
    7. location.protocool //协议
    8. location.search //?q=search
    9. location.reload() //可能从缓存加载
    10. location.reload(true) //重新加载
  100. 3. navigator对象
  101. 检测浏览器属性

  102. </>复制代码

    1. navigator.appCodeName //浏览器的名字
    2. navigator.appName //完整的浏览器名称
    3. navigator.appVersion //浏览器的版本
    4. navigator.cookieEnabled //cookie是否启用
    5. navigator.javaEnabled() //java是否启用
    6. navigator.language //主语言 zh-CH
    7. navigator.languages //支持的语言
    8. navigator.onLine //浏览器是否连接到了internet
    9. navigator.platofrm //浏览器的平台 "Win32"
    10. navigator.plugins //返回浏览器安装的插件的数组
    11. function hasPlugin(name){
    12. name = name.toLowerCase();
    13. for(var i = 0 ; i-1表示找到了
    14. var isTrue = navigator.plugins[i].name.toLowerCase().indexOf(name)>-1;
    15. if(isTrue){
    16. return true;
    17. }
    18. }
    19. return false ;
    20. }
  103. 4. history对象
  104. </>复制代码

    1. history.go(-1);//后退一页
    2. history.back();
    3. history.go(1);//前进一页
    4. history.forward();
    5. history.go("xiaomo.info")//跳转到最近访问过的该页面
    6. history.length==0 //表示这是用户打开浏览器的第一个页面
  105. 十一、表单
  106. 1. 表单属性
  107. </>复制代码

    1. acceptCharset 服务器能够处理的字符集
    2. action 接受请求的url
    3. elements 表单所有控件的集合
    4. enctype 请求的编码类型
    5. length 表单中控件的数量
    6. method get/post
    7. name 表单的名字
    8. reset() 重置
    9. submit() 提交
    10. target
  108. document.forms 可以取到表单的所有控件

  109. 2. 控件
  110. </>复制代码

    1. disabled 当前字段是否禁用
    2. form 指向当前字段所属表单的指针:只读
    3. name 当前字段的名字
    4. readOnly 当前字段只读
    5. tabIndex tab切换的序号
    6. type 当前字段的类型
    7. value 当前字段提交给服务器的值
  111. 修改控件的值

  112. </>复制代码

    1. var input = document.getElementById("name");
    2. name.value="xiaomo"
    3. name.focus(); //把焦点设置到当前字段
    4. //在控件中加入 autofocus="focus" 是一样的效果
  113. 选择文本
    element.select()

  114. 取得选中的文本

  115. </>复制代码

    1. function alertText(username){
    2. var username = document.getElementById("username");
    3. alert(getSelectText(username));
    4. }
    5. function getSelectText(textbox){
    6. return textbox.value.substring(textbox.selectionStart,textbox.selectionEnd);
    7. }
    8. // html
  116. 3. 剪贴板事件
  117. </>复制代码

    1. beforecopy
    2. copy
    3. cut
    4. beforepaste
    5. paste
    6. //写一个公用方
    7. var EventUtil = {
    8. getClipboardText:function(event){
    9. var clipboardData = (event.clipboardData || window.clipboardData);
    10. return clipboardData.getData("text");
    11. }
    12. setClipboardText:function(event,value){
    13. if(event.clipboardData){
    14. return event.clipboardData.setData("text/plain",value);
    15. } else if (window.clipboardData){
    16. return window.clipboardData.setData("txt",value);
    17. }
    18. }
    19. }
    20. EventUtil.addHander(txtbox,"paste",function(event)){
    21. event = EventUtil.getEvent(event);
    22. var text = EventUtil.getClipboardText(event);
    23. if(!/^d*$/.test(text)){
    24. EventUtil.preventDefault(event);
    25. }
    26. }
  118. EventUtil

  119. 自动切换焦点

  120. </>复制代码

    1. (function(){
    2. function tabForward(event){
    3. event = EventUtil.getEvent(event);
    4. var target = EventUtil.getTarget(event);
    5. if(target.value.length = target.maxLength){
    6. var form = target.form;
    7. for( var i =0; len = form.elements.length;i
    8. 4. 下拉框 select
    9. </>复制代码

      1. add(newOption,relOption) 插入一个option
      2. //最佳做法(在列表最后插入一个option)
      3. var newOption = new Option("text","value");
      4. selectBox.add(newOption,undefined);
      5. multiple 是否允许多选
      6. options 控件中所有options的HTMLCollection
      7. remove(index) 移除指定位置的选项
      8. //移除指定的选项(这里移除的是第一项)
      9. var index = 0
      10. selectBox.remove(selectBox.options[index])
      11. selectedIndex 基于0的选中项的索引,没有选中项-1
      12. size 选择框中可见的行数
      13. text 选中项的文本内容
      14. value 选项的值
      15. //移动一个选项到特定位置(将第2个选项移动到最后一个选项)
      16. var optionToMove = selectBox.options[1];
      17. selectBox.insertBefore(optionToMove,selectBox.options[optionToMove.index-1])
      18. /添加一个选项(把当前列表中的第一个选项添加到当前列表的最后)
      19. selectBox.appendChind(selectBox.options[0]);
    10. 5. 表单序列化
    11. 原则:
      对表单字段的名字和值进行url编码,使用&分割
      不发送禁用的表单字段
      只发送勾选的单选按钮和复选框
      不发送type为reset和button的按钮
      多选框中的每选中的值多带带一个条目
      submit的时候,本按钮也会被提交
      select发送的时候如果有value就发value的值 没有就发text内容

    12. form.serialize()

    13. 6. 富文本编辑器
    14. 只要加上contenteditable就可以让div可以编辑


      也可以用js控制

    15. </>复制代码

      1. var richedit = document.getElementById("richedit");
      2. richedit.contenteditable="true";
      3. // true false inherit
      4. document.exexCommand(命令,false,值);
      5. //document.exexCommand("bold",false,null);
    16. 十二、canvas
    17. </>复制代码

      1. //定义一个canvas
      2. 您的浏览器不支持canvas
      3. //获取canvas
      4. document.getElementById("drawing");
      5. if(drawing.getContext){
      6. var context = drawing.getContext("2d");
      7. context.fillReact(30,30,30,30); //画了一个正方形
      8. context.fillStyle="#fff"; //填充
      9. context.strokeStyle="red"; //描边
      10. // todo
      11. }
    18. 十三、html5脚本编程
    19. </>复制代码

      1. //跨文档消息传送
      2. EventUtil.addHander(window,"message",function(event){
      3. if(event.origin="http://www.wrox.com"){//发送消息的文档所在的域
      4. //接受参数
      5. processMessage(event.data);
      6. //可选:向窗口来源发送回执
      7. event.source.postMessage("Receiived","http://xiaomo.info")
      8. }
      9. })
    20. 十四、本地存储
    21. 1. cookie
    22. </>复制代码

      1. var CookieUtil = {
      2. //根据key读取cookie
      3. get: function (name){
      4. //注意对键编码
      5. var cookieName = encodeURIComponent(name) + "=",
      6. cookieStart = document.cookie.indexOf(cookieName),
      7. cookieValue = null,
      8. cookieEnd;
      9. //找到cookie键
      10. if (cookieStart > -1){
      11. //键后面第一个分号位置
      12. cookieEnd = document.cookie.indexOf(";", cookieStart);
      13. if (cookieEnd == -1){
      14. cookieEnd = document.cookie.length;
      15. }
      16. //cookie值解码
      17. cookieValue = decodeURIComponent(document.cookie.substring(cookieStart + cookieName.length, cookieEnd));
      18. }
      19. return cookieValue;
      20. },
      21. //设置cookie
      22. set: function (name, value, expires, path, domain, secure) {
      23. var cookieText = encodeURIComponent(name) + "=" + encodeURIComponent(value);
      24. //失效时间,GMT时间格式
      25. if (expires instanceof Date) {
      26. cookieText += "; expires=" + expires.toGMTString();
      27. }
      28. if (path) {
      29. cookieText += "; path=" + path;
      30. }
      31. if (domain) {
      32. cookieText += "; domain=" + domain;
      33. }
      34. if (secure) {
      35. cookieText += "; secure";
      36. }
      37. document.cookie = cookieText;
      38. },
      39. //删除cookie,保持相同的键、域、路径、安全选项,然后设置失效时间即可
      40. unset: function (name, path, domain, secure){
      41. this.set(name, "", new Date(0), path, domain, secure);
      42. }
      43. };
    23. 使用util方法

    24. </>复制代码

      1. CookieUtil.set("name","xiaomo");
      2. CookieUtil.set("age",26);
      3. console.log(CookieUtil.get("name"));
      4. console.log(CookieUtil.get("age"));
      5. CookieUtil.unset("name");
      6. CookieUtil.unset("age");
    25. 2. localStorage
    26. </>复制代码

      1. Window.localStorage.setItem(key,value);//存储数据
      2. Window.localStorage.getItem(key);//读取数据,返回string类型
      3. Window.localStorage.removeItem(key);//删除数据项
      4. Window.localStorage.clear();//删除所有数据

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

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

相关文章

  • javscript中this初探

    摘要:是什么是一个特别的关键字,是自动定义在所有函数和全局的作用域中。是在运行时绑定的,而不是声明时绑定的。小结的指向取决于函数执行时的块级上下文 This This是什么:this是一个特别的关键字,是自动定义在所有函数和全局的作用域中。this是在运行时绑定的,而不是声明时绑定的。 为什么要有this假设不存在this关键字,那么对于一个函数根据不同上下文背景下的复用就用传入参数 ...

    Xufc 评论0 收藏0
  • javscript插件汇总

    摘要:更新单元测试,已使用,,,使用测试覆盖率,并集成配合来做持续化构建,可以参考本项目的配置文件和的配置文件。判断是否然后记得在文件中暴露函数单元测试在文件新建测试用例然后记得在中引入之前创建的测试用例脚本。 前言作为战斗在业务一线的前端,要想少加班,就要想办法提高工作效率。这里提一个小点,我们在业务开发过程中,经常会重复用到日期格式化、url参数转对象、浏览器类型判断、节流函数等一类函数...

    K_B_Z 评论0 收藏0
  • 2017年前端该学些什么(译)

    摘要:原文链接前端圈快速发展的今天,我们习惯于去尝试最新的技术并在互联网上讨论它们的优劣。整理了一系列年值得学习的部分。在这儿,我特别推荐以下的课程所著的五本对我最有意义的编程书你喜欢我的推荐吗你想在年学点什么 原文链接 前端圈快速发展的今天,我们习惯于去尝试最新的技术并在互联网上讨论它们的优劣。我并不是说我们不应该这么做,我只是觉得我们是不是应该慢下来,看看那些不常变的东西:它们能够很好的...

    hatlonely 评论0 收藏0
  • 使用CSS clip 属性实现音频播放圆环进度条

    摘要:突然有需求要做一个圆环的音频播放进度条上图效果,自己琢磨尝试了半天,也没有实现。然后结合让这个半圆旋转,就实现了内的进度条,当超过时,取消对的剪裁,再使用一个半圆来保存的进条,就实现一个的进度条效果。 showImg(https://segmentfault.com/img/remote/1460000009182482?w=208&h=213);   突然有需求要做一个圆环的音频播放...

    klivitamJ 评论0 收藏0

发表评论

0条评论

hedge_hog

|高级讲师

TA的文章

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