JavaScript 精粹 基础 进阶(3)语句

转载请注明出处

原文连接 http://blog.huanghanlian.com/article/5b698ec8b8ea642ea9213f4b

语句

语句、严格模式

JavaScript程序由语句组成，语句遵守特定的语法规则。例如：if语句, while语句, with语句等等。

语句种类

块 block

块语句常用于组合0 ~ 多个语句。块语句用一对花括号定义。

语法：
{
  语句1;
  语句2;
  ...
  语句n;
}
比如
{
    var str = "hi";
    console.log(str);
}//但在实际开发中，很少单独使用块语句
而是用if...else  或者for  while去结合起来使用，

if(true){
//然后{}是一个块，
然后{里面可以放多条语句}
 console.log(‘hi‘);
}

声明语句 var

声明变量语句
var a=1;

在一个var里也可以声明多个变量
var a=b=1;
这段语句确实创建了a,b两个变量并且赋值为1，但是其中b实际上是隐式的创建了全局变量，不信看下面的例子

function foo() {
    var a = b = 1;
}
foo();

console.log(typeof a);  // ‘undefined’
console.log(typeof b);  // ‘number  

在一条语句里定义多个变量的方式使用，号分隔
var a=1,b=1;

try catch语句

try {    //工作流程首先执行try,catch中的代码
    throw "test";    //如果抛出了异常  ，如果没有发生异常catch中的代码就会被忽略掉
} catch (ex) {    //会由catch去捕获
    console.log(ex); // test    //并执行
} finally {    //finally 不管有没有异常，finally 都会执行
    console.log(‘finally‘);
}

javascript中try...catch可以有三种形式
try {
    throw "test";
} catch (ex) {
    console.log(ex); // test
}

try {
    throw "test";
}finally {
    console.log(‘finally‘);
}

//还有一种就是两者皆有
try {
    throw "test";
} catch (ex) {
    console.log(ex); // test
} finally {
    console.log(‘finally‘);
}

例子1

try {
    // do sth.
} finally {
    console.log(‘finally‘);
}
//不管有没有异常最后都有执行finally中的内容

例子2

try {
    try {
        throw new Error("oops");
    }
    finally {
        console.log("finally");
    }
    //内部try没有catch，那么他会跳到最近的catch，也就是外层的catch去处理，再跳出block之前需要先执行finally
}
catch (ex) {
    console.error("outer", ex.message);
}
//所以这里的执行结果
"finally"
"outer" "oops"

例子3

try {
  try {
    throw new Error("oops");
  }
  catch (ex) {
    console.error("inner", ex.message);
  }
  finally {
    console.log("finally");
  }
}
catch (ex) {
  console.error("outer", ex.message);
}//由于内部异常已经处理过，所以不会再跳出到外部处理
执行结果
"inner" "oops"
"finally"

例子4

try {
  try {
    throw new Error("oops");
  }
  catch (ex) {
    console.error("inner", ex.message);
    throw ex;
  }
  finally {
    console.log("finally");
  }
}
catch (ex) {
  console.error("outer", ex.message);
}//由于内部catch再次抛出异常就会由外部catch来处理
执行结果是
"inner" "oops"
"finally"
"outer" "oops"

function语句

函数声明

fd(); // true
function fd() {
    // do sth.
    return true;
}

函数表达式

fe(); // TypeError
var fe = function() {  //定义变量fe，然后把一个匿名函数赋值给fe
    // do sth.
};

两者区别在函数声明前面调用函数也是可以的，函数表达式就不可以。

for...in语句

var p;
var obj = {x : 1, y: 2}

for (p in obj) {
}
  1. 顺序不确定
  2. enumerable为false时不会出现
  3. for in对象属性时受原型链影响

switch语句

例子1

var val = 2;

switch(val) {
    case 1:
        console.log(1);
        break;
    case 2:
        console.log(2);    //val==2,会执行这段代码
        break;             //使用 break 来阻止代码自动地向下一个 case 运行。
    default:               //使用 default 关键词来规定匹配不存在时做的事情
        console.log(0);
        break;
}

例子2

var val = 2;

switch(val) {
    case 1:
        console.log(1);
    case 2:
        console.log(2);
    default:
        console.log(0);
}
//输出2,0

例子3

var val = 2;

switch(val) {
    case 1:
    case 2:
    case 3:
        console.log(123);
        break;
    case 4:
    case 5:
        console.log(45);
        break;
    default:
        console.log(0);
}
//输出123

循环语句while

while (条件)
{
    需要执行的代码
}

例子

var x="",i=0;
while (i<5){
    x=x + "该数字为 " + i ;
    i++;
}
console.log(x);

do/while 循环

do
{
    需要执行的代码
}
while (条件);

例子

var x="",i=0;
do{
    x=x + "该数字为 " + i;
    i++;
}
while (i<5)
console.log(x)
//该数字为 0该数字为 1该数字为 2该数字为 3该数字为 4

JavaScript for 循环

cars=["BMW","Volvo","Saab","Ford"];
for (var i=0;i<cars.length;i++){
    console.log(cars[i])
}
// BMW
// Volvo
// Saab
// For

不同类型的循环

JavaScript 支持不同类型的循环：

for - 循环代码块一定的次数

for/in - 循环遍历对象的属性

while - 当指定的条件为 true 时循环指定的代码块

do/while - 同样当指定的条件为 true 时循环指定的代码块

with语句

with 语句可以方便地用来引用某个特定对象中已有的属性，但是不能用来给对象添加属性。要给对象创建新的属性，必须明确地引用该对象

语法格式

with(object instance)
{
    //代码块
}

举例

function Lakers() {
   this.name = "kobe bryant";
   this.age = "28";
   this.gender = "boy";
}
var people=new Lakers();
console.log(people)
with(people)
{
   var str = "姓名: " + name + "<br>";
   str += "年龄：" + age + "<br>";
   str += "性别：" + gender;
   document.write(str);
}
// 姓名: kobe bryant
// 年龄：28
// 性别：boy
  1. 让JS引擎优化更难
  2. 可读性差
  3. 可被变量定义代替
  4. 严格模式下被禁用

JavaScript 严格模式

严格模式是一种特殊的执行模式，
它修复了部分语言上的不足，提供更强的错误检查，并增强安全性。

function func() {
    ‘use strict‘;
}

‘use strict‘;
function func() {

}

不允许用with

!function() {
    with({x : 1}) {
        console.log(x);
    }
}();
//输出1

!function() {
    ‘use strict‘;
     with({x : 1}) {
        console.log(x);
    }
}();
SyntaxError报错

不允许未声明的变量被赋值

!function() {
     x = 1;    //全局变量
      console.log(window.x);
}();
//输出1

!function() {
    ‘use strict‘;
     x = 1;
      console.log(window.x);
}();
//ReferenceError
//在use strict如果没有被声明的变量会报错

arguments变为参数的静态副本

arguments.length 属性返回函数调用过程接收到的参数个数：
arguments属性返回函数调用过程接收到的值

一般模式下

!function(a) {
    arguments[0] = 100;//给函数第一个值变成100
    console.log(a);//输出的a变成100
}(1);
//输出100

!function(a) {
    arguments[0] = 100;
    console.log(a);
}();//如果()没有传值arguments长度为空所以更改arguments的值不成立
输出undefined

严格模式下

!function(a) {
    ‘use strict‘;
    arguments[0] = 100;
    console.log(a);
}(1);
//1

!function(a) {
    ‘use strict‘;
    arguments[0].x = 100;
    console.log(a.x);
}({x:1});
//100

delete参数、函数名报错

一般模式下

!function(a) {
    console.log(delete a);
}(1);
//false

‘use strict‘;模式下

!function(a) {
    ‘use strict‘;
    delete a;
}(1);
SyntaxError报错语法错误

delete不可配置的属性报错

一般模式下

!function(a) {
    var obj = {};
    Object.defineProperty(obj,
        ‘a‘, {configurable : false});
    console.log(delete obj.a);
}(1);
//false

‘use strict‘;模式下

!function(a) {
    ‘use strict‘;
    var obj = {};
    Object.defineProperty(obj,
        ‘a‘, {configurable : false});
    delete obj.a;
}(1);
//TypeError报错

对象字面量重复属性名报错

一般模式下

!function() {
    var obj = {x : 1, x : 2};//对象属性字面量去重复去写属性，这样也是合法的，属性以最后一个为准
    console.log(obj.x);
}();
//输出为2

‘use strict‘;模式下

!function() {
    ‘use strict‘;
    var obj = {x : 1, x : 2};
}();

//严格模式下
//SyntaxError报错

禁止八进制字面量

一般模式下

!function() {
    console.log(0123);//8进制的值
}();
//输出83

在严格模式下是不允许8进制

!function() {
    ‘use strict‘;
    console.log(0123);
}();
//SyntaxError报错语法错误

eval, arguments变为关键字，不能作为变量、函数名

一般模式

!function() {
    function eval(){}
    console.log(eval);
}();
//function eval(){}

严格模式

!function() {
    ‘use strict‘;
    function eval(){}
}();
//SyntaxError语法错误

eval独立作用域

一般模式

!function() {
    eval(‘var evalVal = 2;‘);      //在eval函数下定义变量evalVal等于数字2
    console.log(typeof evalVal);   //evalVal所在的函数内部仍然可以拿到 evalVal
}();
//所以输出number

严格模式

!function() {
    ‘use strict‘;
    eval(‘var evalVal = 2;‘);    //eval代码会在独立作用域执行
    console.log(typeof evalVal); //这里拿evalVal是拿不到的
}();
//所以输出undefined

严格模式总结

不允许用with
所有变量必须声明, 赋值给为声明的变量报错，而不是隐式创建全局变量。
eval中的代码不能创建eval所在作用域下的变量、函数。而是为eval单独创建一个作用域，并在eval返回时丢弃。
函数中得特殊对象arguments是静态副本，而不像非严格模式那样，修改arguments或修改参数变量会相互影响。
删除configurable=false的属性时报错，而不是忽略
禁止八进制字面量，如010 (八进制的8)
eval, arguments变为关键字，不可作为变量名、函数名等
>一般函数调用时(不是对象的方法调用，也不使用apply/call/bind等修改this)this指向null，而不是全局对象。
若使用apply/call，当传入null或undefined时，this将指向null或undefined，而不是全局对象。
试图修改不可写属性(writable=false)，在不可扩展的对象上添加属性时报TypeError，而不是忽略。
arguments.caller, arguments.callee被禁用

严格模式是一种特殊的运行模式，
它修复了部分语言上的不足，提供更强的错误检查，并增强安全性。

原文地址：https://blog.51cto.com/14229967/2359690

时间： 2024-11-06 09:51:27

JavaScript 精粹 基础 进阶(3)语句的相关文章

JavaScript 精粹 基础 进阶(6)函数和作用域（函数、this）

转载请注明出处 原文连接 http://blog.huanghanlian.com/article/5b698ef6b8ea642ea9213f4e 函数是一块JavaScript代码,被定义一次,但可执行调用多次,js中的函数也是对象,所以js函数可以像其他对象那样操作和传递所以我们也常叫js中的函数为函数对象. 函数概述 函数的构成主要有几个部分函数名,参数列表,函数体 function foo(x, y) { if (typeof x === 'number' && typeof y

JavaScript 精粹 基础 进阶(5)数组

转载请注明出处 原文连接 http://blog.huanghanlian.com/article/5b698ee6b8ea642ea9213f4d 数组是值的有序集合.每个值叫做元素,每个元素在数组中都有数字位置编号,也就是索引.JS中的数组是弱类型的,数组中可以含有不同类型的元素.数组元素甚至可以是对象或其它数组. 第一节.创建数组.数组操作 数组概述 数组是值的有序集合.每个值叫做元素,每个元素在数组中都有数字位置编号,也就是索引.JS中的数组是弱类型的,数组中可以含有不同类型的元素.数组

JavaScript 精粹 基础 进阶(2)表达式和运算符

转载请注明出处 原文连接 http://blog.huanghanlian.com/article/5b698e88b8ea642ea9213f4a 表达式和运算符 JavaScript 表达式 表达式是指能计算出值得任何可用程序单元.--Wiki 表达式是一种JS短语,可使JS解释器用来产生一个值.--<JS权威指南> JavaScript 运算符 三元运算符 c ? a : b var val = true ? 1 : 2; // val = 1 //val值为true就会返回冒号前面的值

JavaScript 精粹 基础 进阶(1)数据类型

转载请注明出处 原文连接 http://blog.huanghanlian.com/article/5b698e54b8ea642ea9213f49 数据类型 JavaScript六种数据类型 JavaScript一共有六种数据类型,其中有五种原始类型,和一种对象类型. JavaScript 隐式转换 var x='The answer'+42;//The answer42 var y=42+'The answer';//42The answer 这里的加号可以理解为字符串的拼接 var x="

JavaScript 精粹 基础 进阶(8)OOP面向对象编程(上)

转载请注明出处 原文连接 http://blog.huanghanlian.com/article/5b698f14b8ea642ea9213f50 面向对象编程,oop并不是针对与javascript,很多语言都实现了oop这样一个编程发法论,比如说java,c++,都是实现了oop的语言. 概念与继承 概念 面向对象程序设计(Object-oriented programming OOP)是一种程序设计范型,同时也是一种程序开发的方法.对象指的是类的实例,它将对象作为程序的基本单元,将程序和

JavaScript 精粹 基础 进阶(4)对象

转载请注明出处 原文连接 http://blog.huanghanlian.com/article/5b698ed6b8ea642ea9213f4c 对象中包含一系列属性,这些属性是无序的.每个属性都有一个字符串key和对应的value. JavaScript 对象概述 概述 对象中包含一系列属性,这些属性是无序的.每个属性都有一个字符串key和对应的value. var obj = {x : 1, y : 2}; //定义obj对象, 有两个属性x和y obj.x; // 1 //访问对应ob

JavaScript 精粹 基础 进阶(9)OOP面向对象编程(下)

转载请注明出处 原文连接 http://blog.huanghanlian.com/article/5b698f22b8ea642ea9213f51 我们怎么去模拟重载,在javasceipr中我们可以通过参数的类型区别或者数量的区别,来去让同样一个函数名字,可以根据不同的参数列表的情况来去调用相应的函数. javascript中函数类型是不确定的,并且参数的个数也是可以任意的,那么我们可以通过判断实际传入的参数的个数,来去做一个模拟的重载, OOP(模拟重载.链式调用.模块化) 模拟重载 fu

JavaScript 精粹 基础 进阶(7)函数和作用域（闭包、作用域）

转载请注明出处 原文连接 http://blog.huanghanlian.com/article/5b698f05b8ea642ea9213f4f 闭包在JavaScript?中是一个非常重要的概念. 闭包例子 function outer() { var loc = 30; return loc; }; console.log(outer()); //30 outer函数是一个函数声明,有一个局部变量loc赋值为30,返回loc. 当这个函数调用之后,局部变量就会被释放了, function

js基础--javascript基础概念之语句(二)

js基础--javascript基础概念之语句(二)label,break,continue.. break .  continue 语句. break  continue 语句用于在循环中精确控制代码的执行,其中break语句会立即退出循环,执行循环后面的语句. continue 则退出循环后返回到再次进入循环中. 如: var num = 0; for(var i = 0; i<=100; i++){ if(i >= 10){ break; } num = i; } alert(num);