设为首页收藏本站
开启辅助访问

JavaScrip学习笔记（1）

 您所在的位置：网站首页 › js函数式编程和面向对象的区别 › JavaScrip学习笔记（1）

JavaScrip学习笔记（1）

2023-03-24 00:05| 来源: 网络整理| 查看: 265

文章目录 一、什么是JavaScript二、变量三、数据类型

一、什么是JavaScript

JavaScript（简称“JS”） JavaScript 是属于 HTML 和 Web 的编程语言。 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名，但是它也被用到了很多非浏览器环境中，JavaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式、声明式、函数式编程范式。 [1] JavaScript在1995年由Netscape公司的Brendan Eich，在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。 [2] JavaScript的标准是ECMAScript 。截至 2012 年，所有浏览器都完整的支持ECMAScript 5.1，旧版本的浏览器至少支持ECMAScript 3 标准。2015年6月17日，ECMA国际组织发布了ECMAScript的第六版，该版本正式名称为 ECMAScript 2015，但通常被称为ECMAScript 6 或者ES2015。 定义来自于百度百科

JavaScript 的组成

ECMAScript：JavaScript 的语法标准。DOM：JavaScript 操作网页上的元素的 API。BOM：JavaScript 操作浏览器的部分功能的 API。

JavaScript 的特点

可以使用任何文本编辑工具编写，然后使用浏览器就可以执行程序。 是一种解释型脚本语言：代码不进行预编译，从上往下逐行执行，不需要进行严格的变量声明。 主要用来向 HTML 页面添加交互行为。

1.JavaScript使用案例 新建一个demon.html文件，用于写编码。 案例代码：

DOCTYPE html> console.log("hello world");

上述代码的含义就是在控制台打印一句话：hello world。

首先教大家怎么查看：将上述代码复制到一个 html 文件中，然后在浏览器中运行，点击 F12，再点击控制台上的 Console，即可查看。我们也可以在控制台直接输入JavaScript代码，然后点击enter让其执行，如下图所示： 在这里插入图片描述

二、变量

JavaScript变量：是存储数据值的容器。 注：变量不是数值本身，变量仅仅是一个用于存储数值的容器。 举个实例： let x=7其中x是变量，存储值为7

所有 JavaScript 变量必须以唯一的名称的标识。 这些唯一的名称称为标识符。 标识符可以是短名称（比如 x 和 y），或者更具描述性的名称（age、sum、totalVolume）。 构造变量名称（唯一标识符）的通用规则是：

名称可包含字母、数字、下划线和美元符号名称必须以字母开头名称也可以 $ 和 _ 开头名称对大小写敏感（y 和 Y 是不同的变量）保留字（比如 JavaScript 的关键词）无法用作变量名称变量名不能有空格。

提示：JavaScript标识符对大小写敏感。

声明变量 let和const是ES6新增的声明变量的关键词，之前声明变量的关键词是var。例如：

var name=“张三” let name=“李四” const name=“王五”

1.let与var的不同

1.var定义的变量，可以预解析提前调用，结果为undefined；let定义的变量不能预解析，提前调用会报错 2.var定义的变量名称可以重复使用，效果是重复赋值；let定义的变量不能重复，否则执行会报错 3.var定义的变量作用域是全局或者局部（函数内）的；let定义的变量如果在{}中只能在{}中调用，有块作用域

2.const与var的不同

1.var定义的变量可以以预解析，const定义的变量不能预解析，否则结果报错 2.var定义的变量可以重复，const定义的变量不行，否则结果报错 3.var定义的变量作用域是全局/局部作用域。const定义的变量如果在{}中只能在{}中调用。 4.const 定义的变量存储的数据数值不能改变，也就是const定义的变量是常量，不可以被修改

3.代码演示

DOCTYPE html> // 提前调用 预解析 console.log(test); // 提前调用 预解析 console.log(test1); // 定义的变量 var test = 100; let test1 = 200;

运行结果：提前调用报错 在这里插入图片描述

// var 定义的变量 var test = 100; let test2 = 200; console.log(test); // 变量名称重复 重复赋值效果 var test = '北京'; // 变量名称重复 结果是报错 let test2 = '上海';

运行结果：报错 在这里插入图片描述

// 在 {} 中 使用 let 定义变量 只能在 { } 中 使用 // 如果需要在 { } 中 对 let 定义的变量 进行操作 // 提前定义 变量 在 {} 中 进行赋值操作 if (true) { var a = 300; let b = 400; // let 声明的变量 在 { } 中可以调用 // 对 {} 外定义的变量 进行赋值操作 console.log(b); } console.log(a); // let 声明的变量 在 { } 外 不能调用 console.log(b);

运行结果： 在这里插入图片描述

DOCTYPE html> // const 定义的变量 不能重复赋值 // const c = 100 ; // c = 200 ; // 结果是报错 const arr = [1, 2, 3, 4, 5]; // 只是修改引用数据类型中,数据单元存储的数据 // 没有修改 arr变量中 存储的引用数据类型的内存地址 arr[0] = '北京'; console.log(arr);

运行结果： 在这里插入图片描述

三、数据类型

数据类型分为：基本数据类型、引用（复杂）数据类型，还有一种新的原始数据类型：Symbol是ES6引入的，表示独一无二的值。有九种类型

基本数据类型：字符串（Sring）、数字（Number）、布尔（Boolean）、空（null）、未定义（undefined）、Symbol 引用数据类型：对象（Object）、数组（Array）、函数（Function）

1.Undefined：Undefined类型只有一个值，即特殊值undefined。在使用var声明变量，但未对其加以初始化时，这个变量值就是undefined。

2.Null：Null类型是第二个只有一个值的数据类型。其特殊值就是Null。从逻辑角度上看，null是一个空的对象指针。而这也正是使用typeof操作符检测null值，会返回“object”的原因。

3.Boolean：即布尔类型，该类型有两个值：true、false。需要注意的是，Boolean类型的字面值true和false是区分大小写的。也就是说，True和False(以及其它的混合大小形式)都不是Boolean值，只是标识符。

4.Number：该类型的表示方法有两种形式，第一种是整数，第二种为浮点数。整数：可以通过十进制，八进制，十六进制的字面值来表示。浮点数：就是该数值中必须包含一个小数点，且小数点后必须有一位数字。

5.String：String类型用于表示由零或多个16位的Unicode字符组成的字符序列，即字符串。至于用单引号，还是双引号，在js中还是没有差别的。记得成对出现。

6.Symbol类型，符号 (Symbols) 是 ECMAScript 第 6 版新定义的。符号类型是唯一的并且是不可修改的

var s = Symbol()

Symbol 函数前不能使用 new 命令，否则会报错。这是因为生成的 Symbol 是一个原始类型的值，不是对象 Symbol 函数可以接受一个字符串作为参数，表示对 Symbol 实例的描述

7.Object：Object数据类型，称为对象，是一组数据和功能（函数）的集合。可以用new操作符后跟要创建的对象类型的名称来创建。也可以用字面量表示法创建。在其中添加不同名（包含空字符串在内的任意字符串）的属性。

8.Array JavaScript 数组用方括号书写。数组的项目由逗号分隔。

var cars=["Porsche", "Volvo", "BMW"]

数组索引基于零，这意味着第一个项目是 [0]，第二个项目是 [1]，以此类推。

ECMAScript中的数组和其他语言的数组有着相当大的区别：ECMAScript 数组的每一项可以保存任何类型的数据；ECMAScript数组的大小可以动态调整，可向数组添加元素或者删除元素；

9.Function ECMAScript中的函数是对象，与其他引用类型一样具有属性和方法。因此，函数名实际是一个指向函数对象的指针。

1）、函数声明

//函数声明 function sum(num1,num2){ return num1+num2; } //函数表达式 这里的分号很重要 var sum = function(num1,num2){ return num1+num2; };

2）、没有重载

function addSomeNumber(num){ return num + 100; } function addSomeNumber(num){ return num + 200； } var result = addSomeNumber(100); //300

创建第二个函数时覆盖了引用第一个函数的变量addSomeNumber。

3）、函数声明与函数表达式

alert (sum(10,10)); function sum(num1,num2){ return num1+num2; }

这样的代码可以正常执行。代码开始执行前，解析器会率先读取函数声明并将其添加到执行环境中，对代码求值前，JS引擎在第一遍会声明函数并将它们放到源代码树的顶部。但改为函数表达式就会出错。

4）、作为值的函数 像传递参数一样把一个函数传递给另一个函数

function callSomeFunction(someFunction,someArgument){ return someFunction(someArgument); } function add10(num){ return num+10; } var result1 = callSomeFunction(add10,10); alert(result1); //20 function getGreeting(name){ return "Hello"+name; } var result2 = callSomeFunction(getGreeting,"Mike"); alert(result2); //Hello Mike //callSomeFunction是通用的，函数作为第一个参数传递进去，返回执行第一个参数后的结果

从一个函数中返回另一个函数

function createComparisonFunction(propertyName){ return function(object1,object2){ var value1 = object1[propertyName]; var value2 = object2[propertyName]; if(value1 return 1; }else{ return 0; } } } var date = [{name:"Mike", age:28},{name:"Amy", age:29}];//创建包含两个对象的数组 date.sort(creatComparisonFunction("name")); alert(date[0].name);//Amy date.sort(creatComparisonFunction("age")); alert(date[0].name);//Mike

基本数据类型按值存储，保存在栈内存中 对象类型按地址存储，保存在堆内存中



【本文地址】


今日新闻

推荐新闻

CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3