JavaScript基础

[NextBoy]

javaScript基础

数据类型

• boolearn
• undefined
• null
• string
• number
• object
  toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。

字符串常用的函数

• split() 切割
• match() 匹配
• replace() 替换
• indexOf() 是否存在某个字符

数组常用的函数

• join() 组成字符串
• push()
• pop()
• shift()
• unshift()
• reverse() 反转
• sort() 排序
• splice()
• slice()
• indexof()

    const copyArr = (arr)=>{
    return arr.slice(0);
    //return arr.concat([]);
    }

对象的深拷贝

错误

const cloneObj=(obj)=>{
    let proto = Object.getPrototypeOf(obj);
    
    return Object.assign({},Object.create(proto),obj);
}

正确

function clone(data){
	var newData;
	//如果是基本数据类型
	if (typeof(data) !== 'object'){
		newData = data;
	}else{//如果是引用类型

		//如果是数组
		if (data instanceof Array) {
		    newData = []
			for (var i = 0; i < data.length; i++) {
				if(typeof(data[i]) === 'object'){
					newData[i] = clone(data[i]);
				}else{
					newData.push(data[i]);
				}
			}
		}else{
		    newData = {};
			for(key in data){
				if(data.hasOwnProperty(key)){
					if(typeof(data[key]) === 'object'){
					newData[key] = clone(data[key]);
					}else{
					newData[key] = data[key];
					}
				}
			}
		}
	}

	return newData;
}

检查数据类型

• typeof 只能判断简单的数据类型
• instanceof 只能用来判断两个对象是否属于实例关系， 而不能判断一个对象实例具体属于哪种类型
• constructor 指向存在不确定性
• Object.prototype.toString.call

function checkType(data) {
    var typeClass = Object.prototype.toString.call(data);
    
    console.log(typeClass);
}

函数

虽然函数字面量是一个匿名函数，但语法允许为其指定任意一个函数名，当写递归函数时可以调用它自己，
使用Function()构造函数则不行。

BOM

window对象,存储浏览器的信息

• location(文档相关信息)
  • href
  • host
  • pathname
  • search
• history(历史信息)
  • go()
  • back()
  • forward()
• navigator(客户端相关信息)
  • userAgent (判断是什么浏览器)
  • platform (电脑是什么平台,window,linux, os..)

DOM

• 增、删、替换

//创建新元素节点
var newElm = document.createElement('p');

//创建文本节点
var text = '这些新插入的内容'
var newText = document.createTextNode('text');

//查找节点

//document.getElementById()
//document.querySelector()
//document.querySelectorAll()


//节点操作 
//insertBefore()前面插入   
//appendChild()后面插入
//removeChild()删除节点
//replaceChild(newNode,oldNode)替换节点

//关系节点查找
//parentNode
//children
//childNodes
//nextSibling
//previousSibling


//文档片段  DocumentFragment

• property和attribute

  • property 属性
  • attribute 特性

  所有特性都会映射到属性上,两种的赋值方法和查询出来的结果不同

事件

addEventListener(type,handle, boolean);
boolean
- true: 事件捕获
- false: 事件冒泡

阻止冒泡

event.stopPropagation();

事件模型

 - 事件捕获
 - 事件冒泡
 - 标准事件流: 捕获-处于目标阶段-冒泡

键盘事件

- keypress  按下字符集触发,主要用来检测用户输了啥字符的，
- keydown   按下任意键触发,主要检测按键是否按下
- keyup     松开按键触发