Web前端最新JavaScript前端学习大全(1),掌握这套精编Web前端高级面试题解析

总结

技术学到手后,就要开始准备面试了,找工作的时候一定要好好准备简历,毕竟简历是找工作的敲门砖,还有就是要多做面试题,复习巩固。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

cffaf74ac3234e80b5813c7f44725ff8.png

fb3fcfca4a1f44ebb02dc16954f296c1.png

运行结果040b233abdeb415eaaf408bae2f12160.png

小技巧:src下面的路径可以这样获取,更准确,更方便

9b0b95917ff44838b9bbd8887c0f8996.png

四.书写语法

(1)区分大小写:与Java一样,变量名,函数名以及其他一切东西都区分大小写

(2)每行结尾的分号可有可无

(3)注释:①∥单行注释

② 多行注释:/**/

(4)大括号表示代码块

(5)定义的语句都要写在script标签里面(script标签建议写在html的body里面)

五.输出语句:

①使用 window.alert(“”);写入警告框

37bf1ad1a32342c5b760be2f6e7ed402.png

运行结果:

3cc2bba7905a4b61ad9c670d586e61e7.png

②使用document.write(“”);写入html输出

04d47867efc14842a758d5de70cc7f01.png

运行结果:c2852b98ea614a08ad586522d95b744c.png

③使用console.log(“”);写入浏览器控制台

fbf740e489a847b38e69c6f420bae1f9.png

运行结果:77d0f2965ba34b65a87efb2a63a4409a.png

六.JavaScript的变量

简介:变量就是用来保存数据的,JavaScript是一门弱类型语言,变量可以用来存放任意的数据类型的值

七.变量名需要遵循以下原则:

①组成字符可以是任何字母,数字,下划线或者是美元符号。
②不能以数字开头
③建议使用驼峰命名

在JavaScripy中使用var来声明变量
e612ad05bc2a4091ad4c3be42746317a.png

运行结果:

30b837ed54f44011a1436f15ec88d695.png

2.

①作用域:全局变量:大概意思就是可以访问到代码块({}就是这个括号)以外的数据。
②.变量可以重复定义1ea127d50a4c463fa44d56e00a206b0a.png

运行结果:3dd0cbe4cca04443978e97a6e24e0879.png

八.

1.ECMAsript6新增了let关键字来定义变量,它的用法类似于var,但是声明的变量,只在let关键字所在的代码块内有效,并且呢不允许重复

①.代码例子

(只在let关键字所在的代码块内有效)

3c3590dd3ae44a4b8bda9bfaa43b2e6e.png

运行结果:b4aaff3d845d4ee786895c8078602afc.png

②不允许重复

f9c7100882f84c8595d651d0a8dcffb8.png

运行结果:ade59a48283a4b498134da21ef5396fc.png

2.ECMAsript6新增了const关键字,用来声明一个只读的常量,一旦声明,常量的值就不能被改变

①用来声明一个只读的常量

faae672f8d034ff7b6e8fbb8418ccadd.png

运行结果:

e727e0d41b044e3dbcecb2b86629e3a8.png

② 一旦声明,常量的值就不能被改变

918796f0913d4502a3969cce8d51c21b.png

运行结果:

3eedbe98d0224e1384a55f9909b22182.png

九.

数据类型:var test=20;
JavaScript中分为:原始类型和引用类型。

五种原始类型:

①number:数字(整数 ,小数,NaN(Not aNumber))

2e1e882961d949f1a54473b8f4bba901.png运行结果:4009447e18fd46fab7d33070385bf3fe.png

②string:字符,字符串,单双引皆可。

6dce8c14129441dcb98f1f89be42dec4.png

运行结果:16cacce2d81d476dbf8e4dbec369c550.png

③boolean:布尔。一般用来判断false,true。

54ec608b31f0446e845319c5b7c863b4.png

运行结果:a9c3fe0a018549279955d434d148227b.png

④null:对象为空

8a58a19af0a144a49b36915cdc04e3bd.png

注意:为什么会弹出一个object?而不是null?

解答:在 JavaScript 中,使用 typeof 操作符检查 null 类型时,会返回 “object”,这是 JavaScript 的一个历史遗留问题,属于语言本身的设计特点。这个问题可以追溯到 JavaScript 最初的实现中。JavaScript 最初是在较短的时间内设计和实现的,因此在语言的早期版本中存在一些不完善之处。在 JavaScript 的早期版本中,typeof null 返回的确实是 “object”,这被视为 JavaScript 的一个缺陷。null 本质上是一种特殊的原始值,但在 typeof 操作中,它被错误地识别为对象。这个行为已经成为 JavaScript 的一个特性,并且为了保持向后兼容性,不能轻易改变。

⑤undefined:当声明的变量未初始化时,改变量的默认值是undefined.

使用typeof运算符可以获取数据类型
alert(typeof age);

=的代码例子

代码例子1

3e5f50ec252948bfb374a56b121534a2.png

运行结果为:e59cb217ec684daa97276a2e5577d0b2.png

注意:①

==a.会判断类型是否一样,如果不一样,则会进行类型转换b.再去比较两个值是否相等,相等则会返回true,反之则会返回false

===全等于,判断类型是否一样,如果一样就会返回true,反之

代码例子2

d5e2f944b8394354b9c6ece490ef02d9.png

运行结果:

1e1d4369091444feafab30034a95dde8.png

17b0c6d9d63f47e6b18588f3b1e3f644.png

运行结果为:a09c8d64f8934ee39be0b84244786ef2.png

十.运算符

一元运算符:++,–
算术运算符:+,-,*,/,%
赋值运算符:=,+=,-=…
关系运算符:>,<,>=,!=,,=
逻辑运算符:&&,‖,!
三元运算符:条件表达式?true_value:false_value

代码例子1

70c4b4a289ed441bafc1284889c7cb6d.png

运行结果为:

ea29425297694e66bbff869e9e107103.png

注意:按照字符串的字面值,转为数字,如果字面值不是数字,则转为NaN.

代码例子2d55b27b720214bdcbef2e0eaa62426b3.png

运行结果为:
03e61205130c4b6d99c3af54892c043a.png

类型转换:     其他类型转换为number

1.String:按照字符串的字面值,转为数字,如果字面值不是数字,则转为NaN 一般使用parseInt
2.boolean:true转为1 false转为0.

其他类型转换为Boolean:

1.nember:0和NaN转换为false,其他的数字转换为true

2.String:空字符串转为false,其他的字符串转为true

3.null:false

4.undefined:false

十一.函数 函数定义方式一:

函数(方法)是被那些设计为执行特定任务的代码块。
①定义:JavaScript函数通过function关键字进行定义,语法为:
function  functionName(参数1,参数2…){
         要执行的代码
}

注意:
①形式参数不需要类型。因为JavaScript是弱语言。
②返回值不需要定义类型,可以在函数内部直接使用return返回即可。

function add(a,b){
         return a+b;
}

②调用:函数名称(实际参数列表);
let result =add(1,2);

函数定义方式二:

var functionName=funtion(参数列表){
}

var add=function(a,b){
return a+b;
}
调用:JS中,函数调用可以任意传递个数参数
let result=add(1,2,3);

十二.Array

1.JavaScript对象:
Array:
String:
自定义对象:
定义:
①var 变量名=new Array(元素列表);方式一
var arr =new Array(1,2,3);

②var 变量名=[元素列表];方式二
  var arr =[1,2,3];

访问:
arr[索引]=值;
arr=[0]=1;

注意:JS数组类似于Java集合,长度,类型都可变

2.属性:length(字符串的长度)
方法:
①charAt:返回在指定位置的字符
②idexOf:检索字符串

String定义:
var 变量名 =new String(s);方式一
var str=new String (“hello”);方式二

var str=“hello”;
var str=‘hello’;

4.自定义对象
格式:
var 对象名称={
            属性名称1:属性值1
            属性名称2:属性值2
            …
           函数名称:function(形参列表){}
          …
         };
例子:
var person={
         name:“张三”,
       age:23,
     eat:function(){
       alert(“干饭~”);
      }
};

十三.BOM:

总结

技术学到手后,就要开始准备面试了,找工作的时候一定要好好准备简历,毕竟简历是找工作的敲门砖,还有就是要多做面试题,复习巩固。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

属性名称2:属性值2
            …
           函数名称:function(形参列表){}
          …
         };
例子:
var person={
         name:“张三”,
       age:23,
     eat:function(){
       alert(“干饭~”);
      }
};

十三.BOM:

总结

技术学到手后,就要开始准备面试了,找工作的时候一定要好好准备简历,毕竟简历是找工作的敲门砖,还有就是要多做面试题,复习巩固。

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

[外链图片转存中…(img-4AtQhA0R-1715905870647)]

  • 18
    点赞
  • 24
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值