zoukankan      html  css  js  c++  java
  • JS入门

    1,undefined,NaN,Null,infinity

    1) undefined 是undefined 类型

    var a; //声明变量后不赋值

    typeof 类型判断方法

    console.log(typeof(a))  //undefined

    2) NaN 是 number 型 表示不是一个数字

    var a=123;

    var b="abc";

    a-b 得到NaN

    console.log(typeof(a-b)) number

    3) Null 面向对象的概念 表示该对象为空

    4)infinity 是number 类型 表示无穷大 除数为0可得

    2,js精度问题

    js在运算时会存在精度问题:

    1)可以先乘以100 1000 ....先化成整数在100 1000
    2)number.toFixed(参数) 设置保留小数位数 1.528.toFixed(2) =1.53

    3,Math 对象常用几个函数

    1)天花板函数 ceil Math.ceil(1.23)=2 向上返回最小的整数
    2)地板函数 floor Math.floor(1.23)=1 向下返回最小的整数
    3)随机数
    Math.random() 返回0-1 的随机数
    Math.floor(Math.random()*10) 返回0-9 的随机数
    4) Math.max() Math.min() 返回最大最小的值
    5)Math.abs(x)返回一个绝对值
    6)Math.round(x) 四舍五入

    4,数据类型转换

    1)隐式转换 变量在运算过程中发生的类型转换
    !! console.log(!!"abc")
    2)显示(强制)转换:
    转字符串:a,(String)变量 b,变量.toString()
    转数字型:a,Number(变量) b,parseInt(变量) c,parseFloat(变量)
    转布尔型:Boolean(变量)
    几种转换为false的 undefined NaN Null 0 false ""

    5,逻辑运算符的短路操作:当操作数不是bool值时

    1)隐式转换
    2)从左往右
    3) 哪个操作数可以决定结果,就返回这个原操作数
    "100"&&0;//true&&false

    6,数组检测方式

    var arr=[]
    1)Array.isArray(arr) 有兼容性问题
    2)arr instanceof Array 推荐使用
    3) Object.prototype.toString.Call(arr) 可检测任意类型

    7,函数的arguments 和 es6 rest 用法

    1)arguments只在函数内部起作用,并且永远指向当前函数的调用者传入的所有参数 类似数组
    2)rest参数只能写在最后,前面用...标识
    function foo(a, b, ...rest) {
    console.log('a = ' + a);
    console.log('b = ' + b);
    console.log(rest);
    }

    foo(1, 2, 3, 4, 5);
    // 结果:
    // a = 1
    // b = 2
    // Array [ 3, 4, 5 ]

    8,函数变量提升:

    先扫描整个函数体的语句,把所有申明的变量“提升”到函数顶部
    'use strict';
    function foo() {
    var x = 'Hello, ' + y;
    alert(x);
    var y = 'Bob';
    }
    foo();
    虽然是strict模式,但语句var x = 'Hello, ' + y;并不报错,原因是变量y在稍后申明了。
    但是alert显示Hello, undefined,说明变量y的值为undefined。
    这正是因为JavaScript引擎自动提升了变量y的声明,但不会提升变量y的赋值。

    ............................................................................................
    变量提升后代码:
    function foo() {
    var y; // 提升变量y的申明
    var x = 'Hello, ' + y;
    alert(x);
    y = 'Bob';

    注意:函数内变量的怪异声明模式
    function fun(){
    num=10 //没写var 就相当于全局变量
    }
    fun()
    console.log(num) //10

    9,this 指向问题

    复制代码
     1 'use strict';
     2     var obj={
     3         name:"test",
     4         printName:function(){
     5             console.log(this.name)
     6         }
     7     }
     8     obj.printName(); //显示 test  this 指的就是obj
     9 
    10     var obj={
    11             name:"test",
    12             printName:function(){
    13                 function showName (){
    14                     console.log(this.name)
    15                 } 
    16                 return showName()
    17             }
    18         }
    19     obj.printName(); //this 指向 undefined (在非严格模式下指向Windows)
    20 
    21      解决方法: var obj={
    22             name:"test",
    23             printName:function(){
    24                 var self=this //在函数外捕获this
    25                 function showName (){
    26                     console.log(self.name)
    27                 } 
    28                 return showName()
    29             }
    30         }
    复制代码

    10,sort 排序的坑

    1)Array的sort()方法默认把所有元素先转换为String再排序,如果直接排序数字你就踩坑了
    2)默认根据ASCII码进行排序
    3)sort 是一个高阶函数,sort(function(){
    //写具体的实现逻辑
    })
    // 升序
    sort(function(a,b){
    return a-b
    })
    //降序
    sort(function(a,b){
    return b-a
    })

    11,获取样式

    getComputedStyle(el,null).width ie 不支持
    document.getElementById("btn").currentStyle.width ie提供的
      function getStyle(tag, attr) {  return tag.currentStyle ? tag.currentStyle[attr] : getComputedStyle(tag,null)[attr];  } 

    12,拼接字符串的问题

    在ie7以下存在性能问题,可用数组替换
    ie7以上不存在该问题

    13,数组的几个方法

    1)arr.slice(start,end) 拷贝数组中的一段数据,返回拷贝的数组
    2)splice(start,length) 返回截取数组的部分元素,修改原数组
    splice 的参数超过2个会将剩下的参数添加到被截取的数组位置上
    arr.splice(1,2,"a","b")

    14,清空数组:

    1)arr.length=0
    2)arr=[] //推荐使用
    3)arr.splice(0,arr.length)


    15,避免事件被覆盖的方法(ie9 以下不支持)

    标签.addEventListener(enventType,fn,flase) false默认冒泡 true 捕获
    function fun(){
    alert("你好")
    }
    eg:btn.addEventListener("click",fun)
    移除事件监听(参数必须一致)
    btn.removeEventListener("click",fun)


    ie-6-10(enventType 加on)
    标签.attachEvent(enventType,fn)
    标签.detachEvent(enventType,fn)

    16,事件冒泡,和事件捕获

    事件冒泡:从里向外执行,遇到相同的事件及执行
    事件捕获:执行顺序与冒泡相反(不推荐使用,因为ie使用attachEvent 没有第三个参数)

    阻止事件冒泡
    e.stopPropagation()
    ie 中阻止事件传播 cancelBubble=true

    17,事件的对象作用:记录当前事件触发时的一些信息

    btn.onclick=function(event){} 
    event.target真正触发事件的元素
    event.type="click"
    event.clinetX/clinetY 
    ie 低版本不兼容
    var tar=e.target||e.srcElement

    18,Json 串的2方法

    1)object-->string  JSON.stringify()
    2)  string--> obj  JSON.parse()

  • 相关阅读:
    Quicksum -SilverN
    uva 140 bandwidth (好题) ——yhx
    uva 129 krypton factors ——yhx
    uva 524 prime ring problem——yhx
    uva 10976 fractions again(水题)——yhx
    uva 11059 maximum product(水题)——yhx
    uva 725 division(水题)——yhx
    uva 11853 paintball(好题)——yhx
    uva 1599 ideal path(好题)——yhx
    uva 1572 self-assembly ——yhx
  • 原文地址:https://www.cnblogs.com/jc535201285/p/6258823.html
Copyright © 2011-2022 走看看