JavaScript高级学习笔记（总结）

最新推荐文章于 2024-04-19 10:18:52 发布
VIP文章 最新推荐文章于 2024-04-19 10:18:52 发布
阅读量1.4k 收藏 16
点赞数 3
文章标签： javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43294092/article/details/105548503
版权

JavaScript简称:JS

​ * JS分三个部分:

​ * 1 ECMAScript标准—基础的语法

​ * 2 DOM Document Object Model 文档对象模型

​ * 3 BOM Browser Object Model 浏览器对象模型

​ * 什么是JS?

​ * 是一门脚本语言

​ * 是一门解释性语言

​ * 是一门弱类型语言

​ * 是一门基于对象的语言

​ * 是一门动态类型的语言

​ *

​ * 动态页面:页面由html+css+Js

​ * 向服务器发送请求,服务器那边没有页面,是动态的生成,返回给客户端

​ *

​ * js最初的目的:解决用户和服务器之间的交互问题

​ * js做特效,游戏,移动端,服务端

​ *

​ *

​ *

​ *

​ * 编程思想:

​ * 面向过程:所有的事情都是亲力亲为,注重的是过程

​ * 面向对象:提出需求,找对象,对象解决,注重的是结果

​ * js不是一门面向对象的语言,是基于对象的语言,js来模拟面向对象

​ * 面向对象的特性:封装,继承,多态,(抽象性)

​ * 封装:就是包装,把一些重用的内容进行包装,在需要的时候,直接使用

​ * 把一个值,存放在一个变量中,把一些重用的代码放在函数中,把好多相同功能的函数放在一个对象中,把好多功能的对象,放在一个文件中,把一些相同的内容放在一个对象中

​ *

​ * 继承:类与类之间的关系,js中没有类的概念,js中有构造函数的概念,是可以有继承的,是基于原型

​ *

​ * 多态:同一个行为,针对不同的对象,产生了不同的效果

​ * */

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-75N3lJOB-1586969926995)(/Users/song/Desktop/05javascript高级/03-JavaScript-高级-第1天/01教学资料/media/课程大纲.png)]

创建对象的三种方式

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    //对象:特指的某个事物,具有属性和方法(一组无序的属性的集合)
    //特征---->属性
    //行为---->方法
    //小苏:------>姓名,性别,年龄,吃,睡觉,玩
    
    
    //创建对象三种方式:
    
    //1  字面量的方式
    //2  调用系统的构造函数
    //3  自定义构造函数方式
    
    //实例对象
//    var per1={
   
//      name:"卡卡西",
//      age:20,
//      sex:"男",
//      eat:function () {
   
//        console.log("吃臭豆腐");
//      },
//      readBook:function () {
   
//        console.log("亲热天堂");
//      }
//    };
//
//    //调用系统的构造函数
//    var per2=new Object();
//    per2.name="大蛇丸";
//    per2.age=30;
//    per2.sex="男";
//    per2.eat=function () {
   
//      console.log("吃榴莲");
//    };
//    per2.play=function () {
   
//      console.log("这个小蛇真好玩");
//    };
//
//    function Person() {
   
//
//    }
//    console.log(per2 instanceof Object);
//
//    var dog=new Object();


    //自定义构造函数
    function Person(name,age,sex) {
   
      this.name=name;
      this.age=age;
      this.sex=sex;
      this.play=function () {
   
        console.log("天天打游戏");
      };
    }
    var per=new Person("雏田",18,"女");
    console.log(per instanceof Person);


  </script>
</head>
<body>


</body>
</html>

构造函数与工厂函数的区别

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    function Person(name,age) {
   
      this.name=name;
      this.age=age;
      this.sayHi=function () {
   
        console.log("您好");
      };
    }
    //创建对象---->实例化一个对象,的同时对属性进行初始化
    var per=new Person("小红",20);

    /*
    *
    * 1.开辟空间存储对象
    * 2.把this设置为当前的对象
    * 3.设置属性和方法的值
    * 4.把this对象返回
    *
    *
    *
    * */
  </script>
</head>
<body>


</body>
</html>

工厂模式创建对象

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    
    function createObject(name,age) {
   
      var obj=new Object();
      obj.name=name;
      obj.age=age;
      obj.sayHi=function () {
   
        console.log("您好");
      };
      return obj;
    }
    function Person(name,age) {
   
      this.name=name;
      this.age=age;
      this.sayHi=function () {
   
        console.log("您好");
      };
    }
    //创建对象---->实例化一个对象,的同时对属性进行初始化

    /*
    * 共同点:都是函数,都可以创建对象,都可以传入参数
    *
    * 工厂模式:
    * 函数名是小写
    * 有new,
    * 有返回值
    * new之后的对象是当前的对象
    * 直接调用函数就可以创建对象
    *
    * 自定义构造函数:
    * 函数名是大写(首字母)
    * 没有new
    * 没有返回值
    * this是当前的对象
    * 通过new的方式来创建对象
    *
    *
    * */




    var per1=new Person("小红",20);

    var per2=createObject("小明",20);
  </script>
</head>
<body>


</body>
</html>

构造函数和实例对象之间的关系

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    //面向对象的思想是----抽象的过程---->实例化的过程

    //小苏这个人,姓名,年龄,性别, 吃饭,打招呼,睡觉

    //自定义构造函数----->实例化对象
    function Person(name,age,sex) {
   
      this.name=name;
      this.age=age;
      this.sex=sex;
      this.eat=function () {
   
        console.log("吃大蒜拌臭豆腐加榴莲酱");
      };
    }
    //构造函数---->创建对象
    var per=new Person("小苏",38,"女");
    //per.eat();//吃
    //实例对象是通过构造函数来创建
    //实例对象会指向自己的构造函数(暂时理解,是错误的)
    //把这个对象的结构显示出来
    console.dir(per);
    console.dir(Person);


    //实例对象的构造器(构造函数)
    //实例对象的构造器是指向Person的,结果是true,所以,这个实例对象per就是通过Person来创建的
    console.log(per.constructor==Person);//

    console.log(per.__proto__.constructor==Person);
    console.log(per.__proto__.constructor==Person.prototype.constructor);



    //构造函数
    function Animal(name) {
   
      this.name=name;
    }
    //实例对象
    var dog=new Animal("大黄");
    console.dir(dog);//实例对象
    console.dir(Animal);//构造函数的名字

    console.log(dog.__proto__.constructor==Person);
    console.log(dog.__proto__.constructor==Animal);


    //判断这个对象是不是这种数据类型
    console.log(dog.constructor==Animal);

    console.log(dog instanceof Person);



    //总结:
    /*
    * 实例对象和构造函数之间的关系:
    * 1. 实例对象是通过构造函数来创建的---创建的过程叫实例化
    * 2.如何判断对象是不是这个数据类型?
    *  1) 通过构造器的方式 实例对象.构造器==构造函数名字
    *  2) 对象 instanceof 构造函数名字
    *  尽可能的使用第二种方式来识别,为什么?原型讲完再说
    *
    *
    *
    * */






  </script>
</head>
<body>


</body>
</html>

构造函数创建对象带来的问题

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
//    function Person(name,age) {
   
//      this.name=name;
//      this.age=age;
//      this.eat=function () {
   
//        console.log("今天吃红烧土豆");
//      }
//    }
//    var per1=new Person("小白",20);
//    var per2=new Person("小黑",30);
//
//    console.dir(per1);
//    console.dir(per2);



function myEat() {
   
  console.log("吃大榴莲");
}
var myEat=10;
function Person(name,age) {
   
  this.name=name;
  this.age=age;
  this.eat=myEat;
}
var per1=new Person("小白",20);
var per2=new Person("小黑",30);

console.dir(per1);
console.dir(per2);
console.log(per1.eat==per2.eat);
//通过原型来解决---------数据共享,节省内存空间,作用之一



//
//    per1.eat();
//    per2.eat();
//    //不是同一个方法
//    console.log(per1.eat==per2.eat);
//
//    for(var i=0;i<100;i++){
   
//      var per=new Person("嘎嘎",20);
//      per.eat();
//    }
  </script>
</head>
<body>


</body>
</html>

原型添加方法解决数据共享问题

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    function Person(name,age) {
   
      this.name=name;
      this.age=age;
    }
    //通过原型来添加方法,解决数据共享,节省内存空间
    Person.prototype.eat=function () {
   
      console.log("吃凉菜");
    };

    var p1=new Person("小明",20);
    var p2=new Person("小红",30);
    console.log(p1.eat==p2.eat);//true

    console.dir(p1);
    console.dir(p2);

    //实例对象中根本没有eat方法,但是能够使用,这是为什么?
  </script>
</head>
<body>


</body>
</html>

原型

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>


    function Person(name,age) {
   
      this.name=name;
      this.age=age;
    }
    //通过原型来添加方法,解决数据共享,节省内存空间
    Person.prototype.eat=function () {
   
      console.log("吃凉菜");
    };

    var p1=new Person("小明",20);
    var p2=new Person("小红",30);

    console.dir(p1);
    console.dir(p2);
    console.dir(Person);
    p1.__proto__.eat();

    console.log(p1.__proto__==Person.prototype);


    /*
    * 原型?
    * 实例对象中有__proto__这个属性,叫原型,也是一个对象,这个属性是给浏览器使用,不是标准的属性----->__proto__----->可以叫原型对象
    * 构造函数中有prototype这个属性,叫原型,也是一个对象,这个属性是给程序员使用,是标准的属性------>prototype--->可以叫原型对象
    *
    * 实例对象的__proto__和构造函数中的prototype相等--->true
    * 又因为实例对象是通过构造函数来创建的,构造函数中有原型对象prototype
    * 实例对象的__proto__指向了构造函数的原型对象prototype
    *
    *
    *
    * */


    //window是对象
    //document是属性,document也是一个对象
    //write()是方法
    //window.document.write("哈哈");
    //对象.style.color=值;

  </script>
</head>
<body>


</body>
</html>

体会面向对象的和面向过程的编程思想

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <style>
    div {
   
      width: 300px;
      height: 200px;
      background-color: red;
    }
  </style>
</head>
<body>
<input type="button" value="显示效果" id="btn"/>
<div id="dv"></div>
<script src="common.js"></script>
<script>

  function ChangeStyle(btnObj, dvObj, json) {
   
    this.btnObj = btnObj;
    this.dvObj = dvObj;
    this.json = json;
  }
  ChangeStyle.prototype.init = function () {
   
    //点击按钮,改变div多个样式属性值
    var that = this;
    this.btnObj.onclick = function () {
   //按钮
      for (var key in that.json) {
   
        that.dvObj.style[key] = that.json[key];
      }
    };
  };


  //实例化对象


  var json = {
   "width": "500px", "height": "800px", "backgroundColor": "blue", "opacity": "0.2"};
  var cs = new ChangeStyle(my$("btn"), my$("dv"), json);
  cs.init();//调用方法

  //点击p标签,设置div的样式


</script>
<script>

  //点击按钮,改变div的背景颜色

  //  document.getElementById("btn").οnclick=function () {
   
  //      document.getElementById("dv").style.backgroundColor="yellow";
  //  };

  //面向对象思想----初级的
  //按钮是一个对象,div是一个对象,颜色是一个属性


  //  function ChangeStyle(btnId,dvId,color) {
   
  //    this.btnObj=document.getElementById(btnId);//按钮对象
  //    this.dvObj=document.getElementById(dvId);//div对象
  //    this.color=color;//颜色
  //  }
  //  //数据共享来改变背景颜色
  //  ChangeStyle.prototype.init=function () {
   
  //    //console.log(this);//就是实例对象---就是当前对象
  //    var that=this;
  //    //点击按钮,改变div的背景颜色
  //    this.btnObj.οnclick=function () {
   
  //      that.dvObj.style.backgroundColor=that.color;
  //    };
  //  };

  //实例化对象
  //  var cs=new ChangeStyle("btn","dv","yellow");
  //  cs.init();


  //  function Person() {
   
  //    this.sayHi=function () {
   
  //      console.log(this);
  //    };
  //  }
  //  var p=new Person();
  //  p.sayHi();

</script>

</body>
</html>

原型的练习

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>

    //构造函数

    function Person(sex,age) {
   
      this.sex=sex;
      this.age=age;
    }
    //通过原型添加方法
    Person.prototype.sayHi=function () {
   
      console.log("打招呼,您好");
    };
    var per=new Person("男",20);
    console.log(per.__proto__.constructor==Person.prototype.constructor);//实例对象
    console.dir(Person);//构造函数的名字

    var per2=new Person("女",30);
    console.log(per.sayHi==per2.sayHi);

    //实例对象中有两个属性(这两个属性是通过构造函数来获取的),__proto__这个属性
    //构造函数中并没有sex和age的两个属性

    /*
    *
    * 实例对象中有个属性,__proto__,也是对象,叫原型,不是标准的属性,浏览器使用的
    * 构造函数中有一个属性,prototype,也是对象,叫原型,是标准属性,程序员使用
    *
    * 原型---->__proto__或者是prototype,都是原型对象,
    * 原型的作用:共享数据,节省内存空间
    *
    *
    * */

  </script>
</head>
<body>


</body>
</html>

构造函数和实例对象的关系

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>

//    //通过构造函数实例对象,并初始化
//    var arr=new Array(10,20,30,40);
//    //join是方法,实例对象调用的方法
//    arr.join("|");
//    console.dir(arr);
//    //join方法在实例对象__proto__原型
//    console.log(arr.__proto__==Array.prototype);

  </script>
  <script>

    //原型的作用之一:共享数据,节省内存空间
    //构造函数
    function Person(age,sex) {
   
      this.age=age;
      this.sex=sex;
    }
    //通过构造函数的原型添加一个方法
    Person.prototype.eat=function () {
   
      console.log("明天中午吃完饭就要演讲,好痛苦");
    };

    var per=new Person(20,"男");
   // per.__proto__.eat();
    per.eat();
   // per.eat();


    //构造函数,原型对象,实例对象之间的关系

    console.dir(Person);
   //console.dir(per);



  </script>
</head>
<body>


</body>
</html>

总结三者的关系

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>

    /*
    *
    *
    * 构造函数可以实例化对象
    * 构造函数中有一个属性叫prototype,是构造函数的原型对象
    * 构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数
    * 实例对象的原型对象(__proto__)指向的是该构造函数的原型对象
    * 构造函数的原型对象(prototype)中的方法是可以被实例对象直接访问的
    *
    *
    *
    * */
  </script>
</head>
<body>


</body>
</html>

利用数据原型共享数据

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    //什么样子的数据是需要写在原型中?
    //需要共享的数据就可以写原型中
    //原型的作用之一:数据共享

    //属性需要共享,方法也需要共享
    //不需要共享的数据写在构造函数中,需要共享的数据写在原型中
    //构造函数
    function Student(name,age,sex) {
   
      this.name=name;
      this.age=age;
      this.sex=sex;
    }
    //所有学生的身高都是188,所有人的体重都是55
    //所有学生都要每天写500行代码
    //所有学生每天都要吃一个10斤的西瓜
    //原型对象
    Student.prototype.height="188";
    Student.prototype.weight="55kg";
    Student.prototype.study=function () {
   
      console.log("学习,写500行代码,小菜一碟");
    };
    Student.prototype.eat=function () {
   
      console.log("吃一个10斤的西瓜");
    };
    //实例化对象,并初始化
    var stu=new Student("晨光",57,"女");
    console.dir(Student);
    console.dir(stu);


//    stu.eat();
//    stu.study();


  </script>
</head>
<body>


</body>
</html>

原型的简单语法

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    function Student(name, age, sex) {
   
      this.name = name;
      this.age = age;
      this.sex = sex;
    }
    //简单的原型写法
    Student.prototype = {
   
      //手动修改构造器的指向
      constructor:Student,
      height: "188",
      weight: "55kg",
      study: function () {
   
        console.log("学习好开心啊");
      },
      eat: function () {
   
        console.log("我要吃好吃的");
      }
    };

    var stu=new Student("段飞",20,"男");
    stu.eat();
    stu.study();
    console.dir(Student);
    console.dir(stu);




    //    Student.prototype.height="188";
    //    Student.prototype.weight="55kg";
    //    Student.prototype.study=function () {
   
    //      console.log("学习,写500行代码,小菜一碟");
    //    };
    //    Student.prototype.eat=function () {
   
    //      console.log("吃一个10斤的西瓜");
    //    };
    //    //实例化对象,并初始化
    //    var stu=new Student("晨光",57,"女");
    //    console.dir(Student);
    //    console.dir(stu);

  </script>
</head>
<body>


</body>
</html>

原型中添加方法

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>

//    function Person(age) {
   
//      this.age=age;
//      this.sayHi=function () {
   
//        console.log("考尼奇瓦");
//        //打招呼的同时,直接调用吃的方法
//
//      };
//      this.eat=function () {
   
//        console.log("吃东西啦");
//        this.sayHi();
//      };
//    }
//    //实例对象的方法,是可以相互调用的
//
//    //实例化对象，并初始化
//    var per=new Person(20);
//    //调用方法
//    //per.sayHi();
//    per.eat();


    //原型中的方法,是可以相互访问的

    function Animal(name,age) {
   
      this.name=name;
      this.age=age;
    }
    //原型中添加方法
    Animal.prototype.eat=function () {
   
      console.log("动物吃东西");
      this.play();
    };
    Animal.prototype.play=function () {
   
      console.log("玩球");
      this.sleep();
    };
    Animal.prototype.sleep=function () {
   
      console.log("睡觉了");
    };

    var dog=new Animal("小苏",20);
    dog.eat();
    //原型对象中的方法,可以相互调用
  </script>
</head>
<body>


</body>
</html>

实例对象使用属性和方法层层的搜索

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    function Person(age,sex) {
   
      this.age=age;//年龄
      this.sex=sex;
      this.eat=function () {
   
        console.log("构造函数中的吃");
      };
    }
    Person.prototype.sex="女";
    Person.prototype.eat=function () {
   
      console.log("原型对象中的吃");
    };v


    var per=new Person(20,"男");
    console.log(per.sex);//男
    per.eat();
    console.dir(per);


    /*
    * 实例对象使用的属性或者方法,先在实例中查找,找到了则直接使用,找不到则,去实例对象的__proto__指向的原型对象prototype中找,找到了则使用,找不到则报错
    *
    *
    * */


  </script>
</head>
<body>


</body>
</html>

为内置对象添加原型方法

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>
    //为内置对象添加原型方法

//    var arr=new Array(10,20,30,40,50);
    //    arr.join("|");
    //    console.dir(arr);
    //
    //
    //    var str=new String("哦,唛嘎的");
    //    str.indexOf("哦");
    //    console.dir(str);
    
    
    //    var dt=new Date();
    //    dt.getFullYear();
    //    console.dir(dt);

    //实例中的方法如果没有,去创建该实例对象的构造函数的原型对象中找



    //我们能否为系统的对象的原型中添加方法,相当于在改变源码
    //我希望字符串中有一个倒序字符串的方法
    String.prototype.myReverse=function () {
   
      for(var i=this.length-1;i>=0;i--){
   
        console.log(this[i]);
      }
    };
    var str="abcdefg";
    str.myReverse();


    //为Array内置对象的原型对象中添加方法
    Array.prototype.mySort=function () {
   
      for(var i=0;i<this.length-1;i++){
   
          for(var j=0;j<this.length-1-i;j++){
   
              if(this[j]<this[j+1]){
   
                  var temp=this[j];
                this[j]=this[j+1];
                this[j+1]=temp;
              }//end if
          }// end for
      }//end for
    };

    var arr=[100,3,56,78,23,10];
    arr.mySort();
    console.log(arr);


    String.prototype.sayHi=function () {
   
      console.log(this+"哈哈,我又变帅了");
    };

    //字符串就有了打招呼的方法
    var str2="小杨";
    str2.sayHi();
  </script>
</head>
<body>


</body>
</html>

把局部变量变成全局变量

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>

    //函数的自调用---自调用函数

    //一次性的函数--声明的同时,直接调用了
//    (function () {
   
//      console.log("函数");
//
//
//    })();


    //页面加载后.这个自调用函数的代码就执行完了
//    (function (形参) {
   
//      var num=10;//局部变量
//    })(实参);
//    console.log(num);


//    (function (win) {
   
//      var num=10;//局部变量
//      //js是一门动态类型的语言,对象没有属性,点了就有了
//      win.num=num;
//    })(window);
//    console.log(num);

    //如何把局部变量变成全局变量?
    //把局部变量给window就可以了



  </script>
</head>
<body>


</body>
</html>

把随机数对象暴露给window成为全局对象

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script>

    //通过自调用函数产生一个随机数对象,在自调用函数外面,调用该随机数对象方法产生随机数
    (function (window) {
   
      //产生随机数的构造函数
      function Random() {
   
      }
      //在原型对象中添加方法
      Random.prototype.getRandom = function (min,max) {
   
        return Math.floor(Math.random()*(max-min)+min);
      };
      //把Random对象暴露给顶级对象window--->外部可以直接使用这个对象
      window.Random=Random;
    })(window);
    //实例化随机数对象
    var rm=new Random();
    //调用方法产生随机数
    console.log(rm.getRandom(0,5));
    //全局变量
  <<
最低0.47元/天 解锁文章
云城雪华
关注
  • 3
    点赞
  • 踩
  • 16
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript高级程序设计学习笔记（二）
01-20
最近花了一天看完了第四章（变量、作用域和内存问题）和第五章（引用类型），然后隔天就被同学拉去干活了，身心俱疲。 先把第四章的笔记总结一下，怕回头忘光了哈哈。以下的笔记是书上一些我以前学习的时候，没有太重视的js基础知识，也有一些面试知识的拓展，通过博客回顾并加深理解，希望我的学习过程对你有所帮助。 第四章 基本类型和引用类型 在ECMAScript中有两种不同数据类型的值：基本类型值和引用类型值，基本类型值是指简单的数据段，而引用类型值指的是那些可能由多个值构成的对象。 Undefined、Null、Boolean、Number、String这五种基本数据类型都是按值访问的，它们是基本类型值。
对javascript的一点点认识总结《javascript高级程序设计》读书笔记
10-28
Javascript专为与网页交互而设计的脚本语言，由下列三个部门构造
01 知识点回顾——JavaScript的面向对象
X北辰北的博客
02-15 1998
写在前面 这个系列的文章是通过对《JavaScript设计模式》一书的学习后总结而来，刚开始觉得学习的时候只需看书即可，不用再另外记录笔记了，但是后面发现书中有些内容理解起来并不是很容易，所以结合书中的描述就将自己的理解也梳理了一下并将它记录下来，希望和大家一起学习，文章中如果有我理解错的内容，请各位批评指正，大家共同进步~ 目录 写在前面 内容 动态类型语言和鸭子类型 多态 ...
5种方式实现数组扁平化
weixin_30249203的博客
05-16 127
数组扁平化概念 数组扁平化是指将一个多维数组变为一维数组 [1, [2, 3, [4, 5]]] ------> [1, 2, 3, 4, 5] 实现 1. reduce 遍历数组每一项，若值为数组则递归遍历，否则concat。 function flatten(arr) { return arr.reduce((result, item...
递归遍历dom树
gaoyan426926的博客
12-17 222
递归遍历dom树 ● 递归用在一些树状结构非常方便，因为树状要遍历就需要一级一级往下，再一级一级回来 ● 代码如下： function getChild(ele) { for (let i = 0; i < ele.children.length; i++) { console.log(ele.children[i]) // 找当前这个元素的子元素
JavaScript高级 笔记
踩的坑越多，经验越多
09-16 2896
JavaScript高级 学习笔记总结
js高级学习笔记
yifan6688的博客
11-25 192
1、全局作用域作用域链 嵌套关系的作用域串联起来形成了作用域链 相同作用域链中按着从小到大的规则查找变量 子作用域能够访问父作用域，父级作用域无法访问子级作用域（就近原则）2、 闭包3、变量提升变量提升是 JavaScript 中比较“奇怪”的现象，它允许在变量声明之前即被访问4、动态参数arguments 是函数内部内置的伪数组变量，它包含了调用函数时传入的所有实参5、剩余参数借助 ... 获取的剩余实参6、箭头函数7、解构赋值8、构造函数。
js高级笔记
neversleepy的博客
09-25 142
js高级笔记null跟undefined深复制 浅复制值传递 引用传递垃圾回收![在这里插入图片描述](https://img-blog.csdnimg.cn/330d86733969422e9256cb43d93d374f.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBAbmV2ZXJzbGVlcF8=,size_20,color_FFFFFF,t_70,g_se,x_16)对象函数
JavaScript高级.xmind
09-26
自己总结的JavaScript高级的笔记，绘制了详细的思维导图，每个思维导图中均有详细的博文解释，方便大家学习和理解，免费分享给大家。适合网页前端的爱好者和学习者
JavaScript高级程序设计（第3版）学习笔记12 js正则表达式
12-04
需要指出的是，这里只是总结了正则表达式的常用的且比较简单的语法，而不是全部语法，在我看来，掌握了这些常用语法，已经足够应对日常应用了。正则表达式不只是应用在ECMAScript中，在JAVA、.Net、Unix等也有相应...
使用递归和dom遍历dom树形结构
09-28
使用递归和dom遍历dom树形结构 完整代码
JavaScript高级程序设计学习总结
02-23
JavaScript高级程序设计是一本非常值得看的书，这些是我的一些学习总结，供大家参考
JS高级笔记
10-28
JS高级笔记，学习js的朋友可以参考下。
javascript高级学习笔记整理
12-04
一.js面向对象的一种实现 代码如下: 　　[removed] function Person() { this.name = “张三”; this.age = 0; var nickName = “小三”; //类似私有变量,函数中的局部变量在函数执行完后自动销毁. this.SayHi = function () { alert(“我的名字是” + this.name + ” ,大家都叫我” + nickName + ” ,我今年已经” + this.age + “岁了”); } } ///////////////////////// func
javascript高级程序设计笔记
05-05
javacript高级程序设计的个人学习总结，涉及到很多javascript的高级特性
JEECG表格选中状态怎么去掉
最新发布
weixin_39031037的博客
04-19 138
官网代码（在取消选中状态的时候不生效）
使用 Fetch API 执行 GraphQL 查询和变体
ikxin的博客
04-15 1113
GraphQL 是从远程服务器查询数据的强大工具，也是我构建 API 的首选方式。对一些人来说，学习它可能有一定难度，因为教程通常使用 Apollo 或 Relay 等工具进行编写。这些工具很不错，但通常更适用于复杂项目。在某些情况下，最好选择更轻量级的方法，并且不要通过添加额外的库增加包大小。在这种情况下，你可以直接使用浏览器中提供的工具，在本快速教程中，我们将使用在你的浏览器中通常可用的fetch。让我们首先简单地回顾一下fetch。
PLSQL的下载与安装
code袁的博客
04-18 298
🦁作者简介：一名喜欢分享和记录学习的在校大学生💥个人主页code袁💥个人QQ🐯个人wechat：code8896凭借其语法突出显示、SQL和PL/SQL帮助、对象描述、代码助手、编译器提示、重构、PL/SQL美化器、代码内容、代码层次结构、代码折叠、超链接导航、宏库和许多其他复杂功能，Unicode兼容编辑器甚至会吸引最苛刻的用户。手动码字，如有错误，欢迎在评论区指正💬~你的支持就是我更新的最大动力💪~
js的filter函数
xiaohua0708day的博客
04-14 287
这个函数接收数组中的每个元素作为参数，并检查该元素是否是偶数。如果是偶数，函数返回。是一个数组方法，它创建一个新数组，其包含通过提供的函数实现的测试的所有元素。函数遍历数组中的每个元素，并只将那些使测试函数返回。在这个箭头函数版本中，我们直接返回了表达式。在上面的代码中，我们传递了一个匿名函数给。方法就会将该元素包含在新数组中。，则该元素会被包含在新数组中。在JavaScript中，的元素包含在新数组中。
前端学习笔记 javascript
08-31
对于前端学习笔记，我可以给你一些常见的主题和要点，帮助你开始学习前端开发。 1. HTML基础： - 了解HTML的基本结构和标签 - 学习如何创建和组织网页内容 - 掌握常用的HTML标签，如标题、段落、链接、图像等 2. ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值