javascript 学习基础

注：部分内容已过时。

setTimeout(fn, time);//time 后执行 fn，tips：fn不加括号。

function fn () { setTimeout (fn, time )};//循环 等于 function fn() {} setInterval(fn,time)

DOM：document object model 操作HTML.document;

typeof a;

NaN和NaN是不相等的;isNaN用来检测;

== 先转换类型，然后比较，即隐式类型转换，减号也是;

=== 不转换类型，直接比较;

闭包：子函数可以使用父函数的局部变量;

匈牙利命名法：类型前缀（变量用），首字母大写（函数用）;

%求模：求余数;

break:中断整个;

continue:中断本次，跳过本次;

json:用花括号 var json = {a:12,b:5,c:'abc'};alert(json.a);

当循环时，数组可以使用for(var i=0;i<arr.length;i++) 或者 for(var i in arr) ，json 只能使用 for(var i in json);

arguments：可变参，不定参;

var a = new Array(1,2,3) 和 var a = [1,2,3] 相同，推荐使用右边;

var a = [1,2,3];a.push(4); alert(a)//添加;

var a = [1,2,3];a.pop(); alert(a)//删除最后一个;

var a = [1,2,3];a.shift(); alert(a)//删除头一个;

var a = [1,2,3];a.unshift(2); alert(a)//添加在头部;

var a = [1,2,3];a.splice(1,2,'a'); alert(a)//删除第1个开始，长度为2的部分，并插入a;

var a = [1,2,3];var b = [4,5,6]; alert(a.concat(b)); //连接;

var a = [1,2,3];a.join('-'); alert(a);//添加连接符;

var a = [a,z,d,y,d,s,j];a.sort(); alert(a);//排序，只认字符串，数字会失效;

str.charAt():全兼容取字符串某一位;

js的月份从0开始到11，星期：周日为0开始，周6为6;

offsetLeft:综合考虑位置信息，比如left，比如margin;

position:relative 相对定位;

overflow:hidden 隐藏溢出;

list-style:none 列表符隐去不见;

childNodes:IE6-8，nodeType：所有，使用法：childNodes[i].odeType == 1;

parentNode:父节点，offsetParent:获取元素在页面上的实际父级;

绝对定位元素，根据有定位的父级定位;

元素集合非数组，getElementsByTagName不能用sort;

表单验证action:提交到哪里,<form action = "www.baidu.com" ></form>;

运动框架：在开始运行时，先关闭已有定时器(避免多个定时器)；把运动和停止用if，else隔开；缓冲运动一定要取整，var speed=speed>0?Math.ceil(speed):Math.floor(speed);

Math.ceil(-9.8):向上取整，结果为-9;

Math.floor(4.9999):向下取整，结果为4;

z-index:设置元素的堆叠顺序，仅能在已定位的元素上奏效，即要有position，js调用:object.style.zIndex="1";

position:absolute，以已定位position:absolute/relative的父级的padding左上角来定位，否则以body来定位;

Math.abs()取整，用于匀速运动停于某处抖动的避免Math.abs(oDiv.offsetLeft-iTarget)<7;

多物体运动框架不能有公共变量，比如淡入淡出的alpha值，timer值等;

document.onclick:整个页面点击;

var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;

但凡使用clientX，clientY可视区位置，就需要scrollTop，两者合并才是当前点在滚动页面中的真正位置，其中scrollTop为：设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离;

事件:var oEvent= ev||event;alert(oEvent.clientX)//兼容IE,FF,C的弹出坐标法;

事件:var oEvent= ev||event;oEvent.cancelBubble = true//阻止事件冒泡;

document.onkeydown = function(ev){var oEvent=ev||event;alert(oEvent.keyCode)};//显示按了什么键;

oEvent.ctrlKey;

绑定事件:oBtn.attachEvent('onclick',function(){alert('a')});若干attachEvent...//IE下，顺序相反绑定;

oBtn.addEventListener('click',function(){alert('a')},false);若干addEventListener...//FF,Chrome下click，按顺序绑定;

事件捕获：oBtn.setCapture();//IE专用，所有事件都集中到按钮等上;

取消捕获：oBtn.releaseCapture();

ajax：不用刷新浏览器提交服务器;

服务器软件：比如wamp;

id是给前台用的，name是给后台用的;

get:通过网址，有容量限制，安全性差，有缓存，获取；post则不通过网址，且容量可达2G，安全性较好，没缓存，每次都是新的，上传;

ActiveX插件;

用没有定义的变量，会报错；用没有定义的属性window.a，window的某个属性，会undefined;

ajax绝大部分异步的;

this:当前的方法属于谁;

new：创建对象并返回对象;

原型就是CSS里的class，用构造函数加属性，用原型加方法，类名首字母大写，统称混合方式构造函数;

document.documentElement.srollTop||document.body.srollTop:滚动距离IE,FF||Chrome;

document.documentElement.clientHeight:可视区高度;

window.onscroll = window.onresize = function(){};//随着页面滚动;

同一个域名的所有页面共享一套cookie，4K-10K，不超过50条，可设置过期时间;

document.cookie = 'name=blue;expires='+oDate;document.cookie = 'pass=123456';//cookie不会覆盖，expires有效期限;

var oDate = new Date();oDate.setDate(oDate.getDate()+8);//设置添加天数;

正则：

\d 表数字 [0-9];

\w 表英文，数字，下划线 [a-z0-9_];

\s 表空白字符;

{n} 表正好出现n次;

{n,m} 表最少n次，最多m次;

{n,} 表最少n，最多不限;

+ 表最少1次，最多不限 {1,}

? 表最少0次，最多1次 {0,1}，()?

^ 表行首;

$ 表行尾;

2018/5/10 重新编辑

1.javascript 字符串转换来数字：每个字符一次转换，可以用 parseInt/parseFloat 验证

场景：console.log("true" == true); //false

2.字符串之间的比较：从打头字母开始两两比较，规则：a<b，A<a

3.Array.sort( 排序函数 )

场景：function compareNumbers(num1,num2) { return num1-num2 }； //升序 ？

升序：function compareNumAsc(n1,n2) {

　　if (num1>num2) {return 1;} else if (...)

}

4.函数形参视为函数的局部变量，它包含在环境中。

5.闭包：包含自由变量的函数与为所有这些自由变量提供了变量绑定的环境一起。自由变量的更新将会刷新环境中的自由变量本身。

ps：自由变量即非局部变量，也非全局变量。

场景：function multN(n) { return function multBy(m) { return n*m; }; } var multBy3 = multN(3); console.log(multBy3(2)); //6

6.instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。

7.分解大型类

var Spirit = function( name ){
  this.name = name;
};
Spirit.prototype.attack = function( type ){
  if ( type === 'waveBoxing' ){
    console.log( this.name + ': 使用波动拳' );
  }else if( type === 'whirlKick' ){
    console.log( this.name + ': 使用旋风腿')
    }
};

var spirit = new Spirit( 'RYU' );
spirit.attack( 'waveBoxing' );
spirit.attack( 'whirlKick' );


// Spirit.prototype.attack 如果要添加方法，那会变得很大，所以必要作为一个单独的类存在
var Attack = function( spirit ){
  this.spirit = spirit;
};

Attack.prototype.start = function( type ){
  return this.list[ type ].call( this );
};

Attack.prototype.list = {
  waveBoxing: function(){
    console.log( this.spirit.name + ': 使用波动拳' );
  },
  whirlKick: function(){
    console.log( this.spirit.name + ': 使用旋风腿' );
  }
};