重温JS——对象、函数、变量的作用域、this关键字、构造函数 ...

目录
一、对象
二、函数
三、变量的作用域
四、this关键字
五、构造函数  

---

一、对象

   JS中只有两种数据类型： 基本数据、引用数据（object、function）

1.         var obj = {
2.             name:"karen",  //对象内的属性
3.             //对象的方法：这个函数的大括号中的代码不会运行，只有调用了才会运行
4.             sayName:function () {
5.                 console.log(1)
6.             }
7.         }

复制代码

二、函数

函数的三种写法

1.         //定义一个函数:直接创建一个函数，把它当作数据一样，不会提升
2.         var obj= {
3.             say:function () {}
4.         }
5.         var a=function () {}
6.         var arr=[function(){},200,2]
7.         （function(){})
9.         //声明函数：直接在作用域写一个函数，会提升
10.         function fn () {}
12.         //标准的创建一个函数都西昂
13.         var f1=new Function("console.log(1)")
14.         f1()

复制代码

  函数被调用一次，就会执行一次函数体中的所有代码
  函数一定会有返回值，没有写return的就返回undefined。写了返回值，就是返回值。
    注意：
  声明一个函数：var fn = function () { }
  在控制台写fn() 回车后是undefined。
  如果在控制台写console.log (123),回车后会显示123  和undefined
    return 后面紧跟表达式。如果紧跟后面没有写代码的话，就是一个空表达式，就生成undefined。
  return一旦运行了，函数体后面的代码都不会执行了
     函数的嵌套

1.         function fn () {
2.             var a=20
3.             function fm(){}
4.             var obj={say:function(){
5.                 console.log(obj)  //能访问到上一排的obj。但是访问不到say属性
6.             }}
7.         }

复制代码

   能够修饰标识符的只有两个：  var   function
    实际传入函数的参数（实参）的格式可以比形参的个数多，按照顺序赋值，不会影响程序的执行逻辑，但是会影响性能。
  也可以比形参的个数少，也是按顺序赋值。可能会影响程序的执行逻辑==>可以解决：就是设计函数时，提前预设

1.         function fn (a,b) {
2.             if(a==undefined){a=0}
3.             if(b==undefined){b={}}
4.         }
5.         fn(10,{name:"karen"})
6.         fn(1)

复制代码

   函数内部有一个关键字 arguments，代表实际传入函数的参数列表（类数组）。
  函数的length属性代表的是形参的个数
    函数有name属性，就是自己函数的名字
  如果函数有自己的名字，那就是自己的名字（就算有变量赋值给它也是自己的名字），但如果没有自己的名字，但是有变量赋值此函数，那函数的name属性值就是变量名

1.        function fn() {}
2.         console.log(fn.name)  //fn
3.         var a=fn
4.         console.log(a.name)  //fn
6.         var a=function() {}
7.         console.log(a.name)   //a
10.         var a=function fn() {}
11.         console.log(a.name) //fn

复制代码

三、变量的作用域

作用域一般是对函数来说
在ES5中，函数的代码块内部的代码，可以访问形参变量，也可以访问外部的变量（全局），就近优先。
函数外面的代码不能直接访问函数内部的变量
作用域：指一个变量它在哪些代码范围能够被使用，这些地方就是变量的作用域
局部变量就是函数内部能使用，外部不能使用的变量

1.         var obj = {
2.             name:"karen"
3.         }
4.         function fn(n) {
5.             n.name="jack"   //打印jack
6.             // n={name:"jack"}  //打印karen
7.         }
8.         fn(obj)
9.         console.log(obj.name)

复制代码

   name先在自己的fm函数中找，如果没有，就去外面的作用域找，外面的作用域是fn和fm之间，而这之间只有一个obj，没有name，所以最后结果为没有定义报错

1.         function fn () {
2.             var obj={
3.                 name:"karen",
4.                 fm:function() {
5.                     console.log(name)   
6.                 }
7.             }
8.         }

复制代码

四、this关键字

   this关键字代表了函数调用时的调用者。只需要看离他最近（嵌套）的函数的调用者

1.         fn()  //window
2.         obj.fn()   //obj
3.         obj.x1.x2()  //obj.x1
4.         (function(){})()   //window
5.         fn()()  //window
6.         fn()[1]()   //fn()返回的数组
7.         var f1=new fn()   //创建的新对象（可能是f1）

复制代码

  在脚本中代表的是window全局对象
  console.log(this)
  
  var a=20   //全局变量会在脚本执行时，把变量名设置为全局对象window的属性
  
  function fn () {console.log(this)}   //全局函数会在脚本执 行时，把函数设置为全局对象window方法
  
  fn()   ==>   window.fn()

1.         var obj={fn:function(){console.log(this)}}
2.         var arr=[]
3.         arr[0]=1
4.         arr[1]=obj.fn
5.         arr[1]()   //[1,fn]

复制代码

1.         //匿名函数
2.         (function(){
3.             console.log(this)   //window
4.         })();
6.         function fn() {
7.             return function fm () {
8.                 console.log(this)  //window
9.             }
10.         }
11.         fn()()   //调用者是window

复制代码

  打印this 的愿意：ths代表了一个对象，常常在项目中需要给一个对象操作成员
  winodw有一个属性： name，它的值是 空字符串 " "   ==>    name : " "
    基本数据取一个成员是可以的，但是是undefined

1.         function a(xx) {
2.             this.x=xx
3.             return this
4.         }
5.         var x=a(5)   //a=6
6.         var y=a(6)   //y=window
7.         console.log(x.x)   //undefined        6.x==>基本数据取一个成员是可以的，但是是undefined
8.         console.log(y.x)   //6                window.x=6

复制代码

   var a=b=c   的解释：
  从右边开始，b=c；如果c是基本数据，就将其赋值给b；如果c是引用数据，就是b和c都指向/引用同一个空间。
  a=b也是一样。虽然a是最后赋值（引用）的，但是a的引用声明是一开始就有了。
    this 基本上就代表的是对象，在极其少的时候，this不是对象==>call、apply、bind
  

五、构造函数  

JS是一个基于面向对象的单线程的脚本语言
   new fn()   解释：
  new关键字后面跟函数，是一个表达式（运算符），创建对象的运算，整个表达式一定会得到一个对象
  1、创建一个空对象  {}
  2、运行构造函数，让内部的this指向创建的对象（用创建的空对象去调用构造函数） {}.fn()
  3、整个表达式的结果，看函数的返回值：(可能是数组、函数.....)
        返回值是引用数据，就是返回值
        返回值不是引用数据，那么就是这个运行完毕之后的创建的那个对象
    任何对象都有构造函数，任何对象都是函数创建出来的（null除外）
    new  ==>后面一般跟一个函数，new会创建对象，而且会去调用这个函数
  new fn==> 创建对象，然后调用函数，不传参   ==>new无参
  new fn（）==> 创建对象，然后调用函数，并传参   ==>new带参

1.         function fn() {
2.             this.name="karen"
3.             return function fm () {
4.                 console.log("1")
5.                 this.name="jack"
6.             }
7.         }
8.         var f1=new fn()
9.         console.log(f1.name)   //fm

复制代码

1.         console.log(x)  //报错
2.         console.log(window.x)  //undefined     （原型链的知识）

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！