JavaScript基础语法

网页、网站和应用程序

网页:单独的一个页面
网站:一些列相关的页面组成到一起
应用程序:可以和用户产生交互,并实现某种功能。

JavaScript是什么

Netscape在最初将其脚本语言命名为LiveScript,后来Netscape在与Sun合作之后将其改名为JavaScript。JavaScript最初受Java启发而开始设计的,目的之一就是“看上去像Java”,因此语法上有类似之处,一些名称和命名规范也借自Java。JavaScript与Java名称上的近似,是当时Netscape为了营销考虑与Sun微系统达成协议的结果。Java和JavaScript的关系就像张雨和张雨生的关系,只是名字很像。
​Java 服务器端的编程语言
​JavaScript 运行在客户端(浏览器)的编程语言
JavaScript是一种运行在***客户端*** 的***脚本语言***
JavaScript的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。

JavaScript现在的意义(应用场景)

JavaScript 发展到现在几乎无所不能。

  1. 网页特效
  2. 服务端开发(Node.js)
  3. 命令行工具(Node.js)
  4. 桌面程序(Electron)
  5. App(Cordova)
  6. 控制硬件-物联网(Ruff)
  7. 游戏开发(cocos2d-js)

ECMAScript - JavaScript的核心

ECMA 欧洲计算机制造联合会
网景:JavaScript
微软:JScript
定义了JavaScript的语法规范
JavaScript的核心,描述了语言的基本语法和数据类型,ECMAScript是一套标准,定义了一种语言的标准与具体实现无关

BOM - 浏览器对象模型

一套操作浏览器功能的API
通过BOM可以操作浏览器窗口,比如:弹出框、控制浏览器跳转、获取分辨率等

DOM - 文档对象模型

一套操作页面元素的API
DOM可以把HTML看做是文档树,通过DOM提供的API可以对树上的节点进行操作

JavaScript的书写位置

  • 写在行内
<input type="button" value="按钮" onclick="alert('Hello World')" />
  • 写在script标签中
<head>
  <script>
    alert('Hello World!');
  </script>
</head>
  • 写在外部js文件中,在页面引入
<script src="main.js"></script>

计算机组成

软件

  • 应用软件:浏览器(Chrome/IE/Firefox)、QQ、Sublime、Word
  • 系统软件:Windows、Linux、mac OSX

硬件

  • 三大件:CPU(执行运算)、内存(临时存储数据)、硬盘(永久保存数据) – 主板
  • 输入设备:鼠标、键盘、手写板、摄像头等
  • 输出设备:显示器、打印机、投影仪等

变量

什么是变量

  • 什么是变量
    变量是计算机内存中存储数据的标识符,根据变量名称可以获取到内存中存储的数据
  • 为什么要使用变量
    使用变量可以方便的获取或者修改内存中的数据

变量的命名规则和规范

  • 由字母、数字、下划线、$符号组成,不能以数字开头
  • 不能是关键字和保留字,例如:for、while。
  • 区分大小写
  • 变量名必须有意义
  • 遵守驼峰命名法。首字母小写,后面单词的首字母需要大写。例如:userName、userPassword

数据类型

简单数据类型

Number、String、Boolean、Undefined、Null
不要判断两个浮点数是否相等

  • 字符串拼接
    1. 两边只要有一个是字符串,那么+就是字符串拼接功能
    2. 两边如果都是数字,那么就是算术功能。

Boolean类型

  • Boolean字面量: true和false,区分大小写
  • 计算机内部存储:true为1,false为0

Undefined和Null

  1. undefined表示一个声明了没有赋值的变量,变量只声明的时候值默认是undefined
  2. null表示一个空,变量的值如果想为null,必须手动设置

获取变量的类型

var age = 18;
console.log(typeof age); // ‘number’

注释

单行注释 // 多行注释/* */

数据类型转换

如何使用谷歌浏览器,快速的查看数据类型?
字符串的颜色是黑色的,数值类型是蓝色的,布尔类型也是蓝色的,undefined和null是灰色的

转换成字符串类型

var num = 5;
console.log(num.toString());
String()函数存在的意义:有些值没有toString(),这个时候可以使用String()。比如:undefined和null

转换成数值类型

Number()可以把任意值转换成数值,如果要转换的字符串中有一个不是数值的字符,返回NaN
var num1 = parseInt(“12.3abc”); // 返回12,如果第一个字符是数字会解析知道遇到非数字结束
var num2 = parseInt(“abc123”); // 返回NaN,如果第一个字符不是数字或者符号就返回NaN
parseFloat()把字符串转换成浮点数
parseFloat()和parseInt非常相似,不同之处在与
parseFloat会解析第一个. 遇到第二个.或者非数字结束
如果解析的内容里只有整数,解析成整数

转换成布尔类型

  • Boolean()
    0 ‘’(空字符串) null undefined NaN 会转换成false 其它都会转换成true

== 与 ===的区别:==只进行值得比较,===类型和值同时相等,则相等

运算符的优先级

优先级从高到底
	1. ()  优先级最高
	2. 一元运算符  ++   --   !
	3. 算数运算符  先*  /  %   后 +   -
	4. 关系运算符  >   >=   <   <=
	5. 相等运算符   ==   !=    ===    !==
	6. 逻辑运算符 先&&   后||
	7. 赋值运算符

数组中新增元素

数组的赋值

// 格式:数组名[下标/索引] = 值;
// 如果下标有对应的值,会把原来的值覆盖,如果下标不存在,会给数组新增一个元素。
var arr = ["red", "green", "blue"];
// 把red替换成了yellow
arr[0] = "yellow";
// 给数组新增加了一个pink的值
arr[3] = "pink";

函数

函数声明的时候,函数体并不会执行,只要当函数被调用的时候才会执行。
函数一般都用来干一件事情,需用使用动词+名词,表示做一件事情 tellStory sayHello

函数的返回值

当函数执行完的时候,并不是所有时候都要把结果打印。我们期望函数给我一些反馈(比如计算的结果返回进行后续的运算),这个时候可以让函数返回一些东西。也就是返回值。函数通过return返回一个返回值
返回值语法:

//声明一个带返回值的函数
function 函数名(形参1, 形参2, 形参...){
  //函数体
  return 返回值;
}

//可以通过变量来接收这个返回值
var 变量 = 函数名(实参1, 实参2, 实参3);

返回值详解:
如果函数没有使用return语句 ,那么函数有默认的返回值:undefined
如果函数使用return语句,但是return后面没有任何值,那么函数的返回值也是:undefined
函数使用return语句后,这个函数会在执行完 return 语句之后停止并立即退出,也就是说return后面的所有其他代码都不会再执行。

推荐的做法是要么让函数始终都返回一个值,要么永远都不要返回值。

arguments的使用

JavaScript中,arguments对象是比较特别的一个对象,实际上是当前函数的一个内置属性。也就是说所有函数都内置了一个arguments对象,arguments对象中存储了传递的所有的实参。arguments是一个伪数组,因此及可以进行遍历。
可以通过arguments 获取函数调用的时候的实参。console.log(arguments);

函数其它

匿名函数

匿名函数:没有名字的函数
匿名函数如何使用:
将匿名函数赋值给一个变量,这样就可以通过变量进行调用
匿名函数自调用
关于自执行函数(匿名函数自调用)的作用:防止全局变量污染。

自调用函数

匿名函数不能通过直接调用来执行,因此可以通过匿名函数的自调用的方式来执行

(function () {
  alert(123);
})();

函数是一种数据类型

  • 函数可以作为参数或返回值
    不使用var声明的变量是全局变量,不推荐使用。
    变量退出作用域之后会销毁,全局变量关闭网页或浏览器才会销毁

预解析

JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。JavaScript解析器执行JavaScript代码的时候,分为两个过程:预解析过程和代码执行过程
预解析过程:

  1. 把变量的声明提升到当前作用域的最前面,只会提升声明,不会提升赋值。
  2. 把函数的声明提升到当前作用域的最前面,只会提升声明,不会提升调用。
  3. 先提升var,在提升function
    如果变量和函数同名的话,函数优先

JavaScript中的对象

JavaScript中的对象其实就是生活中对象的一个抽象,是无序属性的集合。
特征—属性
行为—方法

对象创建方式

var o = {
  name: 'zs',
  age: 18,
  sex: true,
  sayHi: function () {
    console.log(this.name);
  }
};   
  • new Object()创建对象
var person = new Object();
  person.name = 'lisi';
  person.age = 35;
  person.job = 'actor';
  person.sayHi = function(){
  console.log('Hello,everyBody');
}

new关键字

构造函数 ,是一种特殊的函数。主要用来在创建对象时初始化对象, 即为对象成员变量赋初始值,总与new运算符一起使用在创建对象的语句中。

  1. 构造函数用于创建一类对象,首字母要大写。
  2. 构造函数要和new一起使用才有意义。

this详解

JavaScript中的this指向问题,有时候会让人难以捉摸,随着学习的深入,我们可以逐渐了解
现在我们需要掌握函数内部的this几个特点
	1. 函数在定义的时候this是不确定的,只有在调用的时候才可以确定
	2. 一般函数(独立的)直接执行,内部this指向全局window
	3. 函数(属于对象)作为一个对象的方法,被该对象所调用,那么this指向的是该对象
	4. 构造函数中(第一个字母大写),是指向构造函数里面的对象。
posted @ 2019-04-27 18:09  neverthelessing  阅读(38)  评论(0)    收藏  举报