总结
- 对于框架原理只能说个大概,真的深入某一部分具体的代码和实现方式就只能写出一个框架,许多细节注意不到。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
-
算法方面还是很薄弱,好在面试官都很和蔼可亲,擅长发现人的美哈哈哈…(最好多刷一刷,不然影响你的工资和成功率???)
-
在投递简历之前,最好通过各种渠道找到公司内部的人,先提前了解业务,也可以帮助后期优秀 offer 的决策。
-
要勇于说不,对于某些 offer 待遇不满意、业务不喜欢,应该相信自己,不要因为当下没有更好的 offer 而投降,一份工作短则一年长则 N 年,为了幸福生活要慎重选择!!!
第一次跳槽十分忐忑不安,和没毕业的时候开始找工作是一样的感受,真的要相信自己,有条不紊的进行。如果有我能帮忙的地方欢迎随时找我,比如简历修改、内推、最起码,可以把烦心事说一说,人嘛都会有苦恼的~
祝大家都有美好的未来,拿下满意的 offer。
}));
// Pooling layer 池化层
model.add(tf.layers.maxPooling2d({
poolSize: [2, 2],
strides: [2, 2]
}));
// 添加dropout rate = 0.5随机去掉一半
model.add(tf.layers.dropout({
rate: 0.5
}));
// Flatten layer 降维
model.add(tf.layers.flatten());
// Dense layer
model.add(tf.layers.dense({//全连接层
units: 128,
activation: ‘relu’
}));
model.add(tf.layers.dense({
units: 10, // 对应0-10数字
}));
const OPT = tf.train.adam(0.002) // 优化器
const config = {
optimizer: OPT,
loss: tf.losses.softmaxCrossEntropy, // 损失函数
}
model.compile(config); //模型设置好配置
3. 加载数据
由于训练集数量比较大,这里选取了前60000个数据进行训练(train.js)
console.log(“载入数据”)
inputs = tf.tensor2d(mnist.train_images.slice(0, 60000));
outputs_org = tf.tensor1d(mnist.train_labels.slice(0, 60000));// 标签Y
outputs = tf.oneHot((outputs_org), 10);//全部对应到0-9 [0,0,0,0,0,0,0,1]
console.log(“重组数据”) // 归一化除以255 变成0-1
inputs = tf.div(inputs, tf.scalar(255.0));
inputs = inputs.reshape([60000, 28, 28, 1]); // 格式化28* 28* 1
4. 训练模型
这里使用15个epoh迭代,并且实时输出每一轮结果的loss.(train.js)
async function train() {
for (let i = 1; i < 15; i++) {
const h = await model.fit(inputs, outputs, {
atchSize: 200,
epochs: 1
);
console.log("Loss after Epoch " + i + " : " + h.history.loss[0]);
}
const saveResults = await model.save(‘indexeddb://my-model-6’);
console.log(“模型已经保存”);
select(‘#modelStatus’).html(‘模型已经训练完成并保存’);
}
5. 其中需要对模型进行保存和重加载
// 保存训练模型到浏览器数据库my-model-5
const saveResults = await model.save(‘indexeddb://my-model’);
// 加载已经保存的my-model模型,不需要重新训练
const model = await tf.loadLayersModel(‘indexeddb://my-model’);
6. 测试训练准确率
首先加载测试数据,这里选择前10000个,之后进行训练(load.js)
console.log(“加载测试数据。。”)
inputs_test = tf.tensor2d(mnist.test_images.slice(0, 10000));
inputs_test = tf.div(inputs_test,tf.scalar(255.0));
inputs_test = inputs_test.reshape([10000, 28, 28, 1]);
outputs_test = tf.tensor1d(mnist.test_labels.slice(0, 10000));
print(outputs_test.shape);
console.log(“测试数据加载完成”)
async function test() {
const model = await tf.loadLayersModel(‘indexeddb://my-model’);
console.log(‘加载已经保存的模型’);
output_tem = model.predict(inputs_test);
label = tf.argMax(output_tem, 1);
// 打印测试准确率
tf.div(tf.sum(outputs_test.equal(label)), mnist.test_labels.length).print();
result = tf.div(tf.sum(outputs_test.equal(label)), mnist.test_labels.length);
select(‘#modelStatus’).html(‘模型已经加载完成:’ + result);
}
7. 手写体识别可视化
实时鼠标在区域画数字,会进行预测,点击空格键删除。(recognition.js)
(参考链接:https://github.com/CodingTrain/Toy-Neural-Network-JS/blob/master/examples/mnist)
let img = user_digit.get();
if(!user_has_drawing) {
return img;
}
let inputs = [];
img.resize(28, 28);
img.loadPixels();
for (let i = 0; i < 784; i++) {
inputs[i] = img.pixels[i * 4];
}
inputs = tf.tensor2d([inputs]);
inputs = inputs.reshape([1,28,28,1]);
let prediction = model.predict(inputs);
let guess = tf.argMax(prediction,1);
user_guess_ele.html(guess.dataSync());
return img;
image(user_digit, 0, 0);
// 鼠标控制画线,预测数字
if (mouseIsPressed) {
user_has_drawing = true;
user_digit.stroke(255);
user_digit.strokeWeight(16);
user_digit.line(mouseX, mouseY, pmouseX, pmouseY);
}
四、实验结果
1. 网络训练以及模型保存
运行页面加载模型并开始训练,显示每个epoch的loss值,迭代完成后模型保存,页面也显示‘模型已经训练完成并保存’:
2. 模型加载及准确率测试
模型保存完成之后,点击‘测试准确率’按钮,跳转到模型测试页面,加载测试数据并显示准确率。可见当前的准确率为99.39
3. 在线手写数字识别
数据测试完成之后,点击‘开始手写识别’按钮,跳转到手写识别页面,可以随机用鼠标在电脑上画0-9的数值测试结果,猜测的数字会显示在下面,点击空格键重画。首先会显示“正在加载模型”。当模型加载好后会出现“模型已经加载完成”,之后可以进行手写识别,如下图:
文末
js前端的重头戏,值得花大部分时间学习。
推荐通过书籍学习,《 JavaScript 高级程序设计(第 4 版)》你值得拥有。整本书内容质量都很高,尤其是前十章语言基础部分,建议多读几遍。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
另外,大推一个网上教程 现代 JavaScript 教程 ,文章深入浅出,很容易理解,上面的内容几乎都是重点,而且充分发挥了网上教程的时效性和资料链接。
学习资料在精不在多,二者结合,定能构建你的 JavaScript 知识体系。
面试本质也是考试,面试题就起到很好的考纲作用。想要取得优秀的面试成绩,刷面试题是必须的,除非你样样精通。
这是288页的前端面试题