美文网首页
1. JavaScript入门

1. JavaScript入门

作者: 苏宇lovecc | 来源:发表于2016-08-07 11:39 被阅读18次
  1. JS在页面中的位置
    我们可以将JavaScript代码放在HTML文件中任何位置,但是我们一般放在网页的 <head> 或者 <body> 部分。

  2. 放在 <head> 部分
    最常用的方式是在页面中 <head> 部分放置 <script> 元素,浏览器解析head部分就会执行这个代码,然后才解析页面的其余部分。

  3. 放在 <body> 部分
    JavaScript代码在网页读取到该语句的时候就会执行。

    1.jpg
    注意:JavaScript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后顺序的,所以前面的script就先被执行。比如进行页面显示初始化的js必须放在 <head> 里面,因为初始化都要求提前进行(如给页面body设置css等);而如果是通过事件调用执行的function,那么对位置没什么要求的。
  4. 引用JS外部文件

<script src="script.js"></script>
  1. 变量
    3.1 语法

    var 变量名;
    

    3.2 变量名命名规则:
    * 可以使用任意多个英文字母、数字、下划线(_)或者美元符($)组成;
    * 不能以数字开始;
    * 不能使用关键词与保留字。
    3.3 变量要先声明再赋值,如下:

    var mychar;
    mychar="javascript";
    var mynum = 6;
    

    3.4 变量可以重复赋值,如下:

    var mychar;
    mychar="javascript";
    mychar="hello";
    

    注意:

    1. 在JS中严格区分大小写,如变量mychar与myChar是不一样的,表示是两个变量。
    2. 变量虽然也可以不声明,直接使用,但不规范,需要先声明,后使用。
  2. 数组
    数组是一组按顺序排列的集合,集合的每个值称为元素。JavaScript的数组可以包括任意数据类型。例如:
    [1, 2, 3.14, 'Hello', null, true];
    上述数组包含6个元素。数组用[]表示,元素之间用,分隔。
    另一种创建数组的方法是通过Array()函数实现:
    new Array(1, 2, 3); // 创建了数组[1, 2, 3]
    然而,出于代码的可读性考虑,强烈建议直接使用[]。
    数组的元素可以通过索引来访问。请注意,索引的起始值为0:

var arr = [1, 2, 3.14, 'Hello', null, true];
arr[0]; // 返回索引为0的元素,即1
arr[5]; // 返回索引为5的元素,即true
arr[6]; // 索引超出了范围,返回undefined
  1. 对象
    JavaScript中的对象可以理解为OC中的字典:有键值对组成的无序集合。重点有三:
    • 键:必须是字符串,也称为对象的属性
    • 值:可以是任意类型;
    • 访问方法:以对象名.属性名的形式访问;
      示例:
var person = {
  pID = 1,
  pName = 'CC',
  pAge = 20,
};
console.log(person.pID);
  1. strict模式
    JavaScript在设计之初,为了方便初学者学习,并不强制要求用var申明变量。这个设计错误带来了严重的后果:如果一个变量没有通过var申明就被使用,那么该变量就自动被申明为全局变量:
i = 10; // i现在是全局变量

在同一个页面的不同的JavaScript文件中,如果都不用var申明,恰好都使用了变量i,将造成变量i互相影响,产生难以调试的错误结果。
使用var申明的变量则不是全局变量,它的范围被限制在该变量被申明的函数体内(函数的概念将稍后讲解),同名变量在不同的函数体内互不冲突。
为了修补JavaScript这一严重设计缺陷,ECMA在后续规范中推出了strict模式,在strict模式下运行的JavaScript代码,强制通过var申明变量,未使用var申明变量就使用的,将导致运行错误。
启用strict模式的方法是在JavaScript代码的第一行写上:

 'use strict';

这是一个字符串,不支持strict模式的浏览器会把它当做一个字符串语句执行,支持strict模式的浏览器将开启strict模式运行JavaScript。
来测试一下你的浏览器是否能支持strict模式:

'use strict';
// 如果浏览器支持strict模式,
// 下面的代码将报ReferenceError错误:
abc = 'Hello, world';
alert(abc);

扩展内容:

  1. Map和Set
  2. iterable

相关文章

网友评论

      本文标题:1. JavaScript入门

      本文链接:https://www.haomeiwen.com/subject/gmllsttx.html