js原生小小总结（一）_你看我独自一人_新浪博客

小咪咪 2021-12-11 09:17 177阅读 0赞

### 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的复制数组

###### 7.排 ######

1.reverse()倒序
        
        2.sort()按照字符编码的顺序进行排序
          sort(function(a,b){
        return a - b;})从小到大按数字排
          
          sort(function(a,b){
        return b - a;})从大到小按数字排
          
          返回值: 返回排序后的数组
         影响: 是

###### 8.转 ######

1.toString() :将数组转为字符串,用逗号隔开
                      将十进制整数转为其它进制
            
        2.join()
        返回值:返回字符串
        影响: 否

数组方法例题：

##### 七.冒泡排序/选择排序 #####

###### 冒泡排序 ######

从大到小：   
            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 ...\})

> 例题

##### 二.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.如何删除节点? ######