JavaScript学习之路（二）

JS学习

一、Object.freeze冻结变量

<script>
  const HOST={
    url:'hao123.com',
    port:8080
  };
  HOST.port=8686;
  console.log(HOST);
</script>

HOST对象的port能被成功修改，输出如下：

{url: "hao123.com", port: 8686}

但是不希望它被修改应该怎么做呢？
使用Object.freeze冻结变量HOST：

<script>
  const HOST={
    url:'hao123.com',
    port:8080
  };
  Object.freeze(HOST);
  HOST.port=8686;
  console.log(HOST);
</script>

HOST里面的变量就不会被修改：

{url: "hao123.com", port: 8080}

如果还希望在尝试修改时报错，可以使用严格声明：

<script>
  "use strict";
  const HOST={
    url:'hao123.com',
    port:8080
  };
  Object.freeze(HOST);
  HOST.port=8686;
  console.log(HOST);
</script>

想要修改HOST.port就会报错：

test1.html:18 Uncaught TypeError: Cannot assign to read only property 'port' of object '#<Object>'
    at test1.html:18

二、传值和传址

number、String等基本数据类型占存储空间较小，赋值时是传值的：

<script>
  let a=1;
  let b=a;
  console.log(a,b);
  b=3;
  console.log(a,b);
</script>

输出：

1 1
1 3

修改b的值不会影响a的值。

但对象等引用类型占存储空间较大，赋值时时传址的：

<script>
  let a={name:"wowkie"};
  let b=a;
  console.log(a,b);
  b.name="dada";
  console.log(a,b);
</script>

输出：

{name: "wowkie"} {name: "wowkie"}
{name: "dada"} {name: "dada"}

修改b的name值同时也修改了a的name值。

另外，直接修改b的值也不会影响a的值：
test1：

<script>
  let a={name:"wowkie"};
  let b=a;
  console.log(a,b);
  b="hello";
  console.log(a,b);
</script>

输出：

{name: "wowkie"} {name: "wowkie"}
{name: "wowkie"} "hello"

test2：

<script>
  let a={name:"wowkie"};
  let b=a;
  console.log(a,b);
  b={name:"dada"};;
  console.log(a,b);
</script>

输出：

{name: "wowkie"} {name: "wowkie"}
{name: "wowkie"} {name: "dada"}

三、null和undefined

引用类型未赋值时为null。
基本数据类型未赋值时为undefined；
变量未定义时也为undefined；
函数参数未赋值时，或者函数没有返回值时，都为undefined：

<script>
  function show(name){
    console.log(name);
  }
  console.log(show());
</script>

输出：

undefined
undefined

当num未赋值时打印5颗星星：

<script>
  function star(num){
    if(num==undefined){
      num=5;
    }
    for(let i=0;i<num;i++){
      document.write("*");
    }
    	
  }
  star();
</script>

网页上显示：*****
与num=num||5;或者function star(num=5)这两种写法效果一样：

<script>
  function star(num){
    num=num||5;
    for(let i=0;i<num;i++){
      document.write("*");
    }
    	
  }
  star();
</script>

<script>
  function star(num=5){
    for(let i=0;i<num;i++){
      document.write("*");
    }
    	
  }
  star();
</script>

四、use strict严格模式

1、不能使用未声明的变量

<script>
  "use strict";
  web="hao123.com";
</script>

报错：

Uncaught ReferenceError: web is not defined
    at test1.html:12

对象也是一个变量：

<script>
  "use strict";
  web={name:"port",port:8080};
</script>

报错：

Uncaught ReferenceError: web is not defined
    at test1.html:12

2、不允许删除变量或对象（可以删除属性）：

<script>
  "use strict";
  var web={name:"port",port:8080};
  delete web;
</script>

报错：

Uncaught SyntaxError: Delete of an unqualified identifier in strict mode.

函数也是一个对象：

<script>
  "use strict";
  function x(p1, p2) {};
  delete x; 
</script>

报错：

Uncaught SyntaxError: Delete of an unqualified identifier in strict mode.

3、不允许变量重名：

<script>
  "use strict";
  function x(p1, p1) {};
</script>

报错：

Uncaught SyntaxError: Duplicate parameter name not allowed in this context

4、保留关键字

<script>
  "use strict";
  var public = 1500;
</script>

报错：

Uncaught SyntaxError: Unexpected strict mode reserved word

5、严格模式的作用域为当前作用域及其子作用域

<script>
  "use strict";
  function run(){
    port=8080;
  }
  run();
</script>

port报错：

Uncaught ReferenceError: port is not defined
    at run (test1.html:13)
    at test1.html:18

<script>
  function run(){
    port=8080;
  }
  function show(){
    "use strict";
    web="baodu.com";
  }
  run();
  show();
</script>

web报错，port不报错：

Uncaught ReferenceError: web is not defined
    at show (test1.html:16)
    at test1.html:19

一个问题：

<script>
  port=8080;
  "use strict";
  web="baodu.com";
</script>

“use strict”;当前作用域前面有不严格现象不会报错，而且导致即使后面也有不严格现象也不报错了。。。。。。