ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

【学习笔记】JavaScript基础

2021-07-31 20:00:20  阅读:36  来源: 互联网

标签:浏览器 JavaScript 笔记 JS 学习 字符串 123 var 转换


JavaScript基础

初识JavaScript

1. 什么是JavaScript

  • 运行在客户端的脚本语言,创始人Brendan Eich
  • 脚本语言,不需要编译,编译是在代码执行直接编译生成中间代码文件如exe,解释器是在代码运行时进行解释并立即执行
  • 可基于Node.js技术进行服务器端编程

2. 浏览器执行JS

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

  • 渲染引擎: 解析HTML和CSS,俗称内核,如chrome的blink
  • JS引擎: 也成为JS解释器,用来读取网页中的JS代码,如chrome中的V8(号称最快的JS引擎)

3. JS的组成

  • ECMAScript: 规定了JS的编程语法和基础知识,是所有浏览器厂商共同遵守的一套JS语法工业标准
  • DOM: 文档对象模型,是W3C组织推荐的处理可扩展置标语言的标准编程接口。通过DOM可操作页面上的各种元素(大小、位置、颜色等)。
  • BOM: 浏览器对象模型,它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可操作浏览器窗口,比如弹出框、控制浏览器跳转、分辨率等。

4. JS的三种书写方式

  • 行内式: 直接写在元素内部
    <!-- 行内式的JS直接写到元素内部 -->
    <input type="button" value="点一下" onclick="alert('行内式')">
    
  • 内嵌式: 写在<head><body>标签中
    <!-- 写在`<head>`或`<body>`中的<script>标签内 -->
     <script>alert('内嵌式')</script>
    
  • 外联式:
    <!-- 放置与外部文件中 -->
     <script src="test.js"></script>
    

JS语言基础

1. 注释

  • 单行注释
//单行注释 ctrl + /
  • 多行注释
/*
多行行注释 shift + alt + a
*/

2. JS输入输出语句

方法说明归属
alert(msg)浏览器弹出警示框浏览器
console.log(msg)浏览器控制台打印输出信息浏览器
prompt(msg)浏览器弹出输入框,用户可输入浏览器

3. 变量

JavaScript 变量是存储数据值的容器,通过变量获取数据。 JavaScript 变量必须以唯一的名称的标识。

  • 变量命名规范:
    • 名称必须以字母开头
    • 名称可包含字母、数字、下划线和美元符号
    • 名称也可以$_开头,一般不这么做
    • 名称对大小写敏感
    • 名称不能使用保留字,如var
    • 驼峰命名规范: 首单词的首字母小写,后面单词的首字母大写

4. 标识符、保留关键字

标识符

开发人员为变量、属性、函数、参数等取的名字,不能是关键字和保留字

保留关键字

在 JavaScript 中,一些标识符是保留关键字,不能用作变量名或函数名。

  • 用星号标记的关键词是 ECMAScript 5 和 6 中的新词。
    abstractargumentsawait*boolean
    breakbytecasecatch
    charclass*constcontinue
    debuggerdefaultdeletedo
    doubleelseenum*eval
    export*extends*falsefinal
    finallyfloatforfunction
    gotoifimplementsimport*
    ininstanceofintinterface
    let*longnativenew
    nullpackageprivateprotected
    publicreturnshortstatic
    super*switchsynchronizedthis
    throwthrowstransienttrue
    trytypeofvarvoid
    volatilewhilewithyield

5. JS数据类型

基本数据类型

Number、String、Boolean、Undefined、Null

1) 数字Number

与许多其他编程语言不同,JavaScript 不会定义不同类型的数,比如整数、短的、长的、浮点的等等。JavaScript 数值始终以双精度浮点数来存储,根据国际 IEEE 754 标准。此格式用 64 位存储数值。使用isNaN()判断是否非数字,非数字返回true

指数符号
52bits11bits1bits
0-5252-6263
  • 精度:
    • 整数(不使用指数或科学计数法)会被精确到 15 位。
    • 小数的最大数是 17 位,但是浮点的算数并不总是 100% 精准
    /*精度*/
    var a = 999999999999999;   // x 将是 999999999999999
    var b = 9999999999999999;  // y 将是 10000000000000000
    var c = 0.2 + 0.1;         // x 将是 0.30000000000000004
    /*特殊值*/
    var d = Number.MAX_VALUE   // 最大值:1.7976931348623157e+308
    var e = Number.MIN_VALUE   // 最小值:5e-32
    var f = Infinity	       // 无穷大
    var g = NaN 			   // 非数字
    
  • 进制的前缀
    二进制八进制十六进制
    0b00x

2)字符串String

JavaScript 字符串是引号中的零个或多个字符。可以使用''"",推荐使用'',因为HTML标签内的属性使用""

  • 字符串长度
    内建属性length可返回字符串的长度
    var str = "ABCDEFG";
    var strLength = str.length;
    
  • 特殊字符——转义
    转义符含义
    \n换行
    \\
    ""
    \b退格
    \r回车
    \t水平制表符,tab 缩进
    \v垂直制表符
    \f换页
  • 字符串拼接
    • 使用+对字符串进行拼接
    • 字符串和字符串的拼接
    • 字符串和其他类型的拼接
    var x = "123" + "456";	// x = "123456"
    var y = "123" + 456;	// y = "123456"
    var z = "123" + true;	// z = "123true"
    

2)布尔类型Boolean

布尔类型有两个值:truefalse

var x = true + 1;	// x = 2
var y = false + 1;	// y = 1

3)Undefined 和Null

一个变量申明后未被赋值默认值为undefined,声明变量可以给undefinednull

var x = undefined + "123"	// x = "undefined123"
var y = undefined + 123     // x = NaN
var z = null + "123"	    // z = "null123"
var r = null + 123	        // r = 123

5)typeof

typeof方法返回数据类型,返回结构有以下几种

  • string
  • number
  • boolean
  • undefined
  • function
  • object
typeof "Bill"              		// 返回 "string"
typeof 3.14                		// 返回 "number"
typeof true                		// 返回 "boolean"
typeof false               		// 返回 "boolean"
typeof x                   		// 返回 "undefined" (假如 x 没有值)
typeof {name:'Bill', age:62} 	// 返回 "object"
typeof [1,2,3,4]             	// 返回 "object" (数组即对象)
typeof null                  	// 返回 "object"
typeof function myFunc(){}   	// 返回 "function"

4)数据类型的转换

  • 转换为字符串
    转换方式说明
    变量.toString()转换为字符串
    String()强制转换为字符串
    +通过拼接转换为字符串,隐式转换
    • 变量.toString()和String()的区别:
      • 变量.toString()不能转Undefined和null可以转换进制数据传参2、8、10、16即可
      • String()可以将null和undefined转换为字符串,但不能转换进制字符串
  • 转换为数字型
    转换方式说明
    parseInt(string)将string类转换为整数数值型
    parseFloat(string)将string类转换为浮点数数值型
    Number()强制转换为数值型
    - * /通过算式运算转换,隐式转换
    • 区别:
    /*parseInt()*/
    var num1=parseInt("num123");    //NaN
    var num2=parseInt("");          //NaN
    var num3=parseInt("123.45")     //123
    var num4=parseInt("101010",2)   //42
    var num5=parseInt("123num")     //123
    var num6=parseInt("0xff")       //255
    /*parseFloat(string)*/
    var num1=parseFloat("1234blue");    //1234
    var num2=parseFloat("0xA");         //0
    var num3=parseFloat("0908.5");      //908.5
    var num4=parseFloat("3.125e7");     //31250000
    var num5=parseFloat("123.45.67")    //123.45
    var num6=parseFloat("")             //NaN
    var num7=parseFloat("num123")       //NaN
    /*Number()*/
    var num1=Number("Hello World");  //NaN
    var num2=Number("");             //0
    var num3=Number("000011");       //11
    var num4=Number(true);           //1
    var num5=Number("num123")       //NaN
    /*隐式转换*/
    var num1 = '12' - 0				// 12
    var num2 = '123' - '190'		// 3
    var num2 = '123' * '1'			// 123
    
  • 转换为布尔型
    使用Boolean()进行转换
    falsetrue
    ‘’、0、NaN、null、undefined其他所有值

复杂数据类型

object类型,在后面重点讲到

6. JS运算符

待续…

标签:浏览器,JavaScript,笔记,JS,学习,字符串,123,var,转换
来源: https://blog.csdn.net/hehao1421771020/article/details/119277812

专注分享技术,共同学习,共同进步。侵权联系[admin#icode9.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有