js原生小小总结(一)
Day5
一.递归函数
1.本质:实现了循环
function fic(n){
if(n == 1){
return 1;
}else{
return n * fic(n - 1);
}
}
alert(fic(5));
二.面向对象
物质(对象):一切具有本质特征和行为的事物。
1.如何创建对象? 字面量(json)
var obj = {
name : '张志林',
age : 18
}
2.new Object()
3.构造函数
4.如何访问对象中的属性和方法?
对象.属性 对象.方法()
对象['属性'] 对象['方法']()
Day六
一.什么是数组?
存储一组或一系列数据容器.
二.数组好处?
为了解决大量相关数据的存储和使用的问题。
三.下标
从0开始。
四.如何定义数组?
1.字面量(json)
var arr = [];
2.构造函数的方式
var arr1 = new Array();
五.属性: length : 长度
六.方法: ==增,删,改,截,拼,复,排,转==
//1.作用2.参数3.返回值4.是否影响原数组
1.增
前增: unshift()
返回值:增加后数组的长度
影响: 是
后增: push()
返回值:增加后数组的长度
影响: 是
2.删
前删: shift()
返回值:被删除的元素
影响: 是
后删: pop()
返回值:被删除的元素
影响: 是
3.改
splice(start,length,增加的元素,……);
返回值: 被删除的元素数组
影响: 是
4.截
slice(start,end)
返回值: 截取到的新数组
影响: 否
var arr = [1,2,3,4,5,6];
console.log(arr.slice(-5,-2)); //2,3,4 //数组循环了
5.拼
concat()
返回值:拼接后的新数组
影响:否
6.复
复制克隆,好几种方法。
其中三种如下,ECMA5还有三种
var arr = [1,2,3,4];
var list = arr;
list[0] = 9;
console.log(arr,list);
var list = [];
for(var i = 0,len = arr.length;i < len;i ++){
一、 list[i] = arr[i];
// list.push(arr[i]);
}
二、 list = arr.slice(0);
三、 list = arr.concat();
ECMA5的复制数组
var arr = [1,2,3,4,5];
var list = [];
1、 arr.forEach(function(value){
list.push(value);
})
2、 var list1 = arr.map(function(value){
return value;
})
3、 var list2 = arr.filter(function(value){
return value;
})
console.log(arr,list,list1,list2);
7.排
1.reverse()倒序
2.sort()按照字符编码的顺序进行排序
sort(function(a,b){return a - b;})从小到大按数字排
sort(function(a,b){return b - a;})从大到小按数字排
返回值: 返回排序后的数组
影响: 是
8.转
1.toString() :将数组转为字符串,用逗号隔开
将十进制整数转为其它进制
2.join()
返回值:返回字符串
影响: 否
数组方法例题:
var arr = [3];
//有且仅有一个正整数作为参数时,表示数组长度,负数或小数报错,其它情况表示数组中的元素。
// var list = new Array(3,3);
// console.log(arr[0]);
// console.log(list[0]);
// var arr = [1,2,3,4,5,6];
// console.log(arr.slice(-5,-2)); //2,3,4
// console.log(arr.slice(5,1)); //[] //空数组
// var arr = [1,2,3,4,5,6];
// arr.push(['a','b','c']); //[1,2,3,4,5,6,['a','b','c']];
//// console.log(arr.length);
// var list = arr.concat(['a','b','c']); //[1,2,3,4,5,6,'a','b','c'];
// console.log(list);
var arr = [1,2,3,4];
// var list = arr;
// list[0] = 9;
// console.log(arr,list); //[9,2,3,4] //[9,2,3,4] //地址相同,共用一个数组,改变一个都改变了
// 数组复制
// var list = [];
// for(var i = 0,len = arr.length;i < len;i ++){
// list[i] = arr[i];
//// list.push(arr[i]);
// }
// list = arr.slice(0);
// list = arr.concat();
// 数组排序
// var arr = [5,2,100,3,6];
// console.log(arr.sort(function(a,b){return a - b}));
// console.log(arr.sort(function(a,b){return b - a}));
// console.log(typeof arr.toString());
// var num = 300;
// console.log(num.toString(2)); //二进制
// console.log(num.toString(8)); //八进制
// console.log(num.toString(16));//十六进制
// 获取(min,max)的随机数
// function fnRand(min,max){
// return Math.floor(Math.random() * (max - min + 1) + min);
// }
// alert(fnRand(0,0xffffff).toString(7));
七.冒泡排序/选择排序
冒泡排序
从大到小:
function mao(arr){
for(var i = 1;i < arr.length;i ++){
for(var j = 0;j < arr.length - i;j ++){
if(arr[j] < arr[j + 1]){
var t = arr[j];
arr[j] = arr[j + 1];
arr[j + 1] = t;
}
}
}
return arr;
}
从小到大:
function mao1(arr){
for(var i = 1;i < arr.length;i ++){
for(var j = arr.length - 1;j >= i;j --){
if(arr[j] < arr[j - 1]){
var t = arr[j];
arr[j] = arr[j - 1];
arr[j - 1] = t;
}
}
}
return arr;
}
选择排序
从小到大:
function xuan1(arr){
for(var i = 0;i < arr.length - 1;i ++){
for(var j = i + 1;j < arr.length;j ++){
if(arr[j] < arr[i]){
var t = arr[j];
arr[j] = arr[i];
arr[i] = t;
}
}
}
return arr;
}
数组去重
方法一、 function norepeat(arr){
var list = [];
for(var i = 0,len = arr.length;i < len;i ++){
if(list.indexOf(arr[i]) == -1){
list.push(arr[i]);
}
}
return list;
}
// ;
//方法二、 ;
八.堆/栈(值传递与引用传递)
Day7
一.ES5扩展方法
1.严格模式
想在哪个作用域下,使用严格模式,在哪个作用域下,写下面这句话。
"use strict"
2.数组扩展方法
1> indexOf()
2> lastIndexOf()
3> forEach(function(value,index,array){})
4> map(function(value,index,array){return ...})
5> reduce(function(pre,next,index,array){return ....})
6> filter(function(value,index,array){return ...})
例题
var arr = [1,2,3,4,5];
var list = [];
1、 arr.forEach(function(value){
list.push(value);
})
2、 var list1 = arr.map(function(value){
return value;
})
3、 var list2 = arr.filter(function(value){
return value;
})
console.log(arr,list,list1,list2);
//数组复制的三种方法
二.String
1.如何定义字符串?
var str = "";
var str1 = new String();
2.属性: length
3.方法: 查/替/截/转
查: indexOf()
lastIndexOf()
charAt()
charCodeAt()
String.fromCharCode()
替: replace()
将字符串中的一些字符替换为另外一些字符串。
返回一个替换后的新字符串,不会改变原字符串。
截: substring(start,==end==)
slice(start,==end==)
substr(start,length)
扩展:substr(start,==length==):从指定的位置开始截取指定长度的字符串。
转:
toUppercase()
toLowercase()
split()
var str = "how do you do";
var subStr = str.substr(4,2);
; //do
var sub = str.substring(5,1);
alert(sub); //ow d
三.中文范围
GB2312
GB18030
4e00-9fa5
输出所有汉字:
var str = '';
for(var i = 19968;i <= 40869;i ++){
str += String.fromCharCode(i) + ' ';
}
document.write(str);
Day8
一.Math
Math.PI
Math.abs()
Math.round()
Math.floor()
Math.ceil()
Math.max()
Math.max.apply(null,[])
Math.min.apply(null,数组名)
Math.random() 0 <= n < 1
Math.random() * (最大值 - 最小值 + 1) + 最小值
Math.pow()
Math.sqrt()
console.log(Math.round(-3.5));//-3
console.log(Math.round(-3.5000001));//-4
console.log(Math.max.apply(null,[1,2,3,4,5]));//5
console.log(Math.min.apply(null,[1,2,3,4,5]));//1
Math.random() * (5 + 1) + 5 //5-10的随机数
二.Date
1.如何创建日期对象
new Date()
new Date(year,month,date)
new Date(year,month,date,hour,minute,second)
2.获取
getFullYear()
getMonth()
getDate()
getDay()
getHours()
getMinutes()
getSeconds()
getMilliseconds()
getTime() 获取时间戳
toLocaleString()
toLocaleDateString()
toLocaleTimeString()
2.设置set
<<span class="hljs-name" style="margin: 0px; padding: 0px;">script type="text/javascript">
var date = new Date();
console.log(date.toLocaleString());
console.log(date.toLocaleDateString());
console.log(date.toLocaleTimeString());
</<span class="hljs-name" style="margin: 0px; padding: 0px;">script>
Day9
一.BOM
1.顶级对象(宿主对象) window
2.哪些子对象?
window
graph TB
window-->document
window-->history
window-->location
window-->frames
window-->screen
window-->navigator
document history location frames screen navigator
3.如何跳转页面?
window.location
location.href
4.如何获取操作系统和浏览器的信息
navigator.userAgent
5.方法
confirm()
prompt()
6.计时器
setTimeout()
setInterval()
二.DOM
1.如何获取页面元素?
1> document.getElementByIdx_x('id名');
2> document.getElementsByTagName_r('标签名');
3> document.getElementsByClassName('类名');
4> document.getElementsByName('name名');
5> document.querySelector('选择器');
6> document.querySelectorAll('选择器');
7> document.documentElement 获得html节点
8> document.body 获得 body节点
2.如何创建元素节点?
document_createElement_x()
3.如何创建文本节点?
document_createTextNode()
4.如何追加节点到页面?
a()
5.如何修改节点 ?
replaceChild(new,old)
6.如何克隆节点?
cloneNode()
7.如何删除节点?
removeChild()
8.常见节点对象有哪些?
元素节点 属性节点 文本节点
nodeName: 标签名 属性名 #text
nodeType: 1 2 3
nodeValue: null 属性值 文本内容