前端基础知识之“初识JavaScript”

您所在的位置:网站首页 前端报表工具 前端基础知识之“初识JavaScript”

前端基础知识之“初识JavaScript”

2023-04-10 12:24| 来源: 网络整理| 查看: 265

“这里是offer学堂,帮你轻松拿offer”

嗨~ 今天的你过得还好吗?

三月人间,乍然春风起,

吹得满山樱花遍地,如此美景,

小伙伴们都出去游玩了吗?

前面小编分享了HTML和css的基础知识,

今天接着说说

JavaScript是什么?

- 2023.03.09 -

一、JavaScirpt简介1. 什么是JavaScirpt

JavaScript ( JS ) 是一种具有函数优先的轻量级,解释型或即时编译型的编程语言。虽然它是作为开发Web 页面的脚本语言而出名的,但是它也被用到了很多非浏览器环境中,例如 Node.js、 Apache CouchDB 和 Adobe Acrobat。JavaScript 是一种基于原型编程、多范式的动态脚本语言,并且支持面向对象、命令式和声明式(如函数式编程)风格。

2. JavaScript的组成部分ECMAScript,描述了该语言的语法和基本对象。文档对象模型(DOM),描述处理网页内容的方法和接口。浏览器对象模型(BOM),描述与浏览器进行交互的方法和接口。3.浏览器执行JS简介

浏览器分成两部分:渲染引擎和 JS 引擎

渲染引擎:用来解析HTML与CSS,俗称内核,比如 chrome 浏览器的 blink ,老版本的 webkit。JS 引擎:也称为 JS 解释器。 用来读取网页中的JavaScript代码,对其处理后运行,比如 chrome 浏览器的 V8。

浏览器本身并不会执行JS代码,而是通过内置 JavaScript 引擎(解释器) 来执行 JS 代码 。JS 引擎执行代码时逐行解释每一句源码(转换为机器语言),然后由计算机去执行,所以 JavaScript 语言归为脚本语言,会逐行解释执行。

4.ECMAScript

ECMAScript 是由ECMA 国际( 原欧洲计算机制造商协会)进行标准化的一门编程语言,这种语言在万维网上应用广泛,它往往被称为 JavaScript 或 JScript,但实际上后两者是 ECMAScript 语言的实现和扩展。

ECMAScript 规定了JS的编程语法和基础核心知识,是所有浏览器厂商共同遵守的一套JS语法工业标准。

5.DOM文档对象模型

文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标记语言的标准编程接口。通过 DOM 提供的接口可以对页面上的各种元素进行操作(大小、位置、颜色等)。

6.BOM浏览器对象模型

BOM (Browser Object Model,简称BOM) 是指浏览器对象模型,它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可以操作浏览器窗口,比如弹出框、控制浏览器跳转、获取分辨率等。

二、JavaScirpt初体验1.行内式JS可以将单行或少量JS代码写在HTML标签的事件属性中(以on开头的属性),如: onclink注意单双引号的使用:在HTML中我们推荐使用双引号,JS中我们推荐使用单引号可读性差,在 HTML 中编入 JS 大量代码时,不方便阅读特殊情况下使用2.内嵌式JS可以将多行JS代码写到标签中内嵌 JS 是学习时常用的方式3.外部JS 利于HTML页面代码结构化,把单独JS代码独立到HTML页面之外,既美观,又方便引用外部JS文件的script标签中间不可以写代码适合于JS代码量比较大的情况三、JavaScirpt基础语法1.标识符

所谓标识符,就是指给变量、函数、属性或函数的参数起名字。 标识符可以是按照下列格式规则组合起来的一或多个字符:

第一个字符必须是一个字母、下划线( _ )或一个美元符号( $ )。其它字符可以是字母、下划线、美元符号或数字。按照惯例,ECMAScript 标识符采用驼峰命名法。标识符不能是关键字和保留字符。2.字面量和变量

字面量实际上就是一些固定的值,比如:1、2 、3、true、false、null、NaN、“hello”,字面量都是不可以改变的,由于字面量不是很方便使用,所以在JavaScript中很少直接使用字面量,使用的而是变量。

变量的作用是给某一个值或对象标注名称。比如我们的程序中有一个值123,这个值我们是需要反复使用的,这个时候我们最好将123这个值赋值给一个变量,然后通过变量去使用123这个值。

3.数据类型

数据类型决定了一个数据的特征,比如:123和”123”,直观上看这两个数据都是123,但实际上前者是一个数字,而后者是一个字符串。对于不同的数据类型我们在进行操作时会有很大的不同。

JavaScript中一共有5种基本数据类型:

字符串型(String)数值型(Number)布尔型(Boolean)undefined型(Undefined)null型(Null)

这5种之外的类型都称为Object,所以总的来看JavaScript中共有六种数据类型。

4.强制类型转换

强制类型转换指将一个数据类型强制转换为其它的数据类型。一般是指,将其它的数据类型转换为String、Number、Boolean。

5.运算符

运算符也叫操作符,通过运算符可以对一个或多个值进行运算并获取运算结果。比如:typeof就是运算符,可以来获得一个值的类型,它会将该值的类型以字符串的形式返回(number string boolean undefined object)

y=5,下面的表格解释了这些算术运算符:

x=5,下面的表格解释了比较运算符:

x=10 和 y=5,下面的表格解释了赋值运算符:

6.代码块

代码块是在大括号 {} 中所写的语句,以此将多条语句的集合视为一条语句来使用。

7.条件语句

条件语句是通过判断指定表达式的值来决定执行还是跳过某些语句,最基本的条件语句:

if…elseswitch…case8.循环语句

循环语句和条件语句一样,也是基本的控制语句,只要满足一定的条件将会一直执行,最基本的循环语句:

whiledo…whilefor四、JavaScirpt常用对象1.数组对象

数组也是对象的一种,数组是一种用于表达有顺序关系的值的集合的语言结构,也就是同类数据元素的有序集合。

数组的存储性能比普通对象要好,在开发中我们经常使用数组来存储一些数据。但是在JavaScript中是支持数组可以是不同的元素,这跟JavaScript的弱类型有关。

2.函数对象

call()和apply()这两个方法都是函数对象的方法,需要通过函数对象来调用,当对函数调用call()和apply()都会调用函数执行,在调用call()和apply()可以将一个对象指定为第一个参数,此时这个对象将会成为函数执行时的this,call()方法可以将实参在对象之后依次传递,apply()方法需要将实参封装到一个数组中统一传递。

call()方法演示:

apply()方法演示:

3.Date对象

在JavaScript中使用Date对象来表示一个时间,如果直接使用构造函数创建一个Date对象,则会封装为当前代码执行的时间。

4.Math对象

Math和其它的对象不同,它不是一个构造函数,它属于一个工具类不用创建对象,它里边封装了数学运算相关的属性和方法。

5.String对象

在JS中为我们提供了三个包装类,通过这三个包装类可以将基本数据类型的数据转换为对象。

String():可以将基本数据类型字符串转换为String对象Number():可以将基本数据类型的数字转换为Number对象Boolean():可以将基本数据类型的布尔值转换为Boolean对象

但是注意:我们在实际应用中不会使用基本数据类型的对象,如果使用基本数据类型的对象,在做一些比较时可能会带来一些不可预期的结果。

6.RegExp对象

正则表达式用于定义一些字符串的规则,计算机可以根据正则表达式,来检查一个字符串是否符合规则,获取将字符串中符合规则的内容提取出来。

今天的分享就到这里了,想学习更多前端知识,记得常来看我!

我们下期再见!

END

文案编辑|云端学长

文案配图|云端学长

内容由:云端源想分享



【本文地址】


今日新闻


推荐新闻


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