Develop Reference

vue show js 's error :TypeError: "this is undefined"

I want to make a dynamic water pipe with water flowing. The front picture is an error message.
The following picture is a method in the method in the vue page. I don't know if it will report an error. If you don't call this method, nothing will be reported.
The following code is the js file that introduces the vue page
//构造函数
function Createline(config) {
this.c = 0;
this.lines = [];
var self = this;
//初始化线
(function (self){
if(config.fx == "w"){
var number = config.canvas_w / (config.width + config.width/2 + config.jiange*2);
number = Math.ceil(number) + 1;
for(var n = 0 ; n < number ; n++){
var mxx = config.canvas_w - n*(config.width+config.width/2+config.jiange*2);
var lines_data = {
mx:mxx,
lx:mxx - config.width,
my:config.my,
ly:config.ly,
vx:config.vx,
vy:config.vy,
}
self.lines.push(lines_data);
var lines_data2 = {
mx:mxx-config.width-config.jiange,
lx:mxx-config.width-config.jiange-config.width/2,
my:config.my,
ly:config.ly,
vx:config.vx,
vy:config.vy,
}
self.lines.push(lines_data2);
}
}
if(config.fx == "h"){
var number = config.canvas_w / (config.width + config.width/2 + config.jiange*2);
number = Math.ceil(number) + 1;
for(var n = 0 ; n < number ; n++){
var myy = config.canvas_h - n*(config.width+config.width/2+config.jiange*2);
var lines_data3 = {
mx:config.mx,
lx:config.lx,
my:myy,
ly:myy - config.width,
vx:config.vx,
vy:config.vy,
}
self.lines.push(lines_data3);
var lines_data4 = {
mx:config.mx,
lx:config.lx,
my:myy-config.width-config.jiange,
ly:myy-config.width-config.jiange-config.width/2,
vx:config.vx,
vy:config.vy,
}
self.lines.push(lines_data4);
}
}
})(self);
}
//开始
Createline.prototype.begin = function (element,config) {
var canvasObj = document.getElementById(element);
var self = this;
var canvas = {
line_w: config.line_w || 3, //线条厚度
vx: config.vx || 0,//x轴运动速度
vy:config.vy || 0,//Y轴速度
color:config.color || "blue",//线条颜色
canvas_w:config.canvas_w || 0,//画布宽度
canvas_h:config.canvas_h || 0,//画布高度
mx: config.mx || 0,//线的开始位置X坐标
my: config.my || 0,//线的开始位置Y坐标
lx: config.lx || 0,//线的结束位置X坐标
ly: config.ly || 0,//线的结束位置Y坐标
fx:config.fx || "w",//运动方向 w 水平 ，h: 垂直
width:config.width || 20,//线的长度
jiange:config.jiange || 10, //线的间隔
}
if(canvasObj.getContext("2d")){
canvas.ctx = canvasObj.getContext("2d"),
canvasObj.width = canvas.canvas_w;
canvasObj.height = canvas.canvas_h;
}else{
console.log("当前环境不支持canvas");
return null;
}
setInterval(function(){
self.createline(self,canvas);
if(canvas.fx == "w"){
self.updateline_w(self,canvas);
}
if(canvas.fx == "h"){
self.updateline_h(self,canvas);
}
self.addline(self,canvas);
},config.time);
return canvas.ctx;
}
//画线
Createline.prototype.createline = function(self,canvas){
var content = canvas.ctx;
content.clearRect(0,0,canvas.canvas_w,canvas.canvas_h);
for(var i = 0 ; i < self.lines.length ; i++){
content.beginPath();
content.moveTo(self.lines[i].mx,self.lines[i].my);
//线经过的转折点或结束点
content.lineTo(self.lines[i].lx,self.lines[i].ly);
//线条宽度
content.lineWidth = canvas.line_w;
content.strokeStyle = canvas.color;
content.stroke();
//线条颜色
content.closePath();
//画线
}
}
//改变数据 水平运动
Createline.prototype.updateline_w = function(self,canvas){
for (var i = 0 ; i < self.lines.length ; i++) {
self.lines[i].mx = self.lines[i].mx + self.lines[i].vx;
self.lines[i].lx = self.lines[i].lx + self.lines[i].vx;
}
//超出画布的线条从数组内删除，减少系统消耗
var cnt = [];
for (var j = 0 ;j < self.lines.length ; j++) {
if(self.lines[j].lx > canvas.canvas_w){
cnt.push(j);
}
}
for(var k = 0; k < cnt.length ; k++){
self.lines.splice(k,1);
}
}
//改变数据 垂直运动
Createline.prototype.updateline_h = function(self,canvas){
for (var i = 0 ; i < self.lines.length ; i++) {
self.lines[i].my = self.lines[i].my + lines[i].vy;
self.lines[i].ly = self.lines[i].ly + lines[i].vy;
}
//超出画布的线条从数组内删除，减少系统消耗
var cnt = [];
for (var j = 0 ;j < self.lines.length ; j++) {
if( self.lines[j].ly > canvas.canvas_h){
cnt.push(j);
}
}
for(var k = 0; k < cnt.length ; k++){
self.lines.splice(k,1);
}
}
//增加线
Createline.prototype.addline = function(self,canvas){
var length = self.lines.length;
//横线
if(canvas.fx == "w"){
//判断是否需要生成线
if(self.lines[length-1].lx > 0){
//起点位置 等于 左右一根线的坐标减去间隔
var ww = self.lines[length - 1].lx - canvas.jiange;
//判断长短
if(self.c == 0){
var jg = canvas.width;
self.c = 10;
}else{
var jg = canvas.width/2;
self.c = 0;
}
var lxx = ww - jg;
var data = {
mx:ww,
lx:lxx,
my:canvas.my,
ly:canvas.ly,
vx:canvas.vx,
vy:canvas.vy,
}
self.lines.push(data);
}
}
//垂直
if(canvas.fx == "h"){
if(length>0){
//判断是否需要生成线
if(self.lines[length-1].ly > 0){
//起点位置 等于 左右一根线的坐标减去间隔
var my = self.lines[length - 1].ly - canvas.jiange;
//判断长短
if(c == 0){
var jg = canvas.width;
c = 10;
}else{
var jg = canvas.width/2;
c = 0;
}
var ly = my - jg;
var data = {
mx:canvas.mx,
lx:canvas.lx,
my:my,
ly:ly,
vx:canvas.vx,
vy:canvas.vy,
}
self.lines.push(data);
}
}else{
var data = {
mx:canvas.mx,
my:canvas.my,
lx:canvas.lx,
ly:canvas.ly,
vx:canvas.vx,
vy:canvas.vy,
}
self.lines.push(data);
}
}
}
export{
Createline
}

You need to use new when creating a instance for a constructor that uses this:
var cre = new Createline(data);
When a function is executed using new it does the following:
function User(name) {
// this = {}; (implicitly)
// add properties to this
this.name = name;
this.isAdmin = false;
// return this; (implicitly)
}

How to EXCLUDE MasterPage items when bulk exporting all text Frames

When I'm exporting all text frames from a file, the script sees the textframes in the masterpage and messes up the calculation and gives an error at the end because those frames are locked and can't be exported.
var myDoc = app.activeDocument;
var myFolder = myDoc.filePath;
var myImage = myDoc.textFrames;
var JPEGFolder = new Folder(myFolder+"/"+app.activeDocument.name+"_"+"JPEG");
if (!JPEGFolder.exists)
JPEGFolder.create();
var PromFolder = new Folder(myFolder+"/"+app.activeDocument.name+"_"+"Promethean");
if (!PromFolder.exists)
PromFolder.create();
var ToplamSoru = 0 ;
for (var i=0; myImage.length>i; i++)
{
app.select(myImage[i]);
ToplamSoru = ToplamSoru +1;
}
var Cevapli = (ToplamSoru/2-4);
alert(Cevapli);
app.jpegExportPreferences.jpegQuality = JPEGOptionsQuality.maximum;
app.jpegExportPreferences.exportResolution = 150;
for (var p=0; p < myDoc.pages.length; p++)
{
for (var i=0; myImage.length>i; i++)
{
if ( i <= Cevapli -1){
if( i < 9)
{
app.select(myImage[i]);
var SoruNo = myImage[i].contents.substring(1,2);
app.selection[0].exportFile(ExportFormat.JPG, File(JPEGFolder+"/"+SoruNo+".JPEG"), false);
}
else
{
app.select(myImage[i]);
var SoruNo = myImage[i].contents.substring(1,3);
app.selection[0].exportFile(ExportFormat.JPG, File(JPEGFolder+"/"+SoruNo+".JPEG"), false);
}
}
else{
//alert(Cevapli);
if( i < 9 + Cevapli+1)
{
app.select(myImage[i]);
var SoruNo = myImage[i].contents.substring(1,2);
app.selection[0].exportFile(ExportFormat.JPG, File(PromFolder+"/"+SoruNo+".JPEG"), false);
}
else
{
app.select(myImage[i]);
var SoruNo = myImage[i].contents.substring(1,3);
app.selection[0].exportFile(ExportFormat.JPG, File(PromFolder+"/"+SoruNo+".JPEG"), false);
}
}
}
}
alert ("Done")
Basically, when i run the code, everything is OK and exported as wanted, but when there are more than the fixed number of text frames in the masterpage, it will be screwed up once again.
var Cevapli = (ToplamSoru/2-4);
Is where i decrease the value of the variable because there are 2 master pages with 4 different locked text frames.
How can i actually make the code exlude the items in the masterpages altogether?
The working code below:
var myDoc = app.activeDocument;
var myFolder = myDoc.filePath;
var TotalQuestions = 0 ;
var JPEGFolder = new Folder(myFolder+"/"+app.activeDocument.name+"_"+"JPEG");
var PromFolder = new Folder(myFolder+"/"+app.activeDocument.name+"_"+"Promethean");
var TotalPages = 0;
var Extension = prompt("Başına ne koyalım?","fen-");
if (!JPEGFolder.exists)
JPEGFolder.create();
if (!PromFolder.exists)
PromFolder.create();
for (i=0; i< app.documents[0].pages.length; i++)
{
TotalPages = TotalPages+1;
for (ii=0; ii< app.documents[0].pages[i].textFrames.length; ii++)
{
app.select(app.documents[0].pages[i].textFrames[ii]);
TotalQuestions = TotalQuestions +1;
}
}
//alert(ToplamSoru);
var Cevapli = TotalPages/2;
//alert(Cevapli);
app.jpegExportPreferences.jpegQuality = JPEGOptionsQuality.maximum;
app.jpegExportPreferences.exportResolution = 72;
var result = confirm ("Devam?", false,"EU Thingie");
if(result ==true){
for (i=0; i < app.documents[0].pages.length; i++){
// CEVAPLI //
if(i < Cevapli){
//alert(i+" "+ii+" IF");
for (ii=0; ii < app.documents[0].pages[i].textFrames.length; ii++){
var QID = app.documents[0].pages[i].textFrames[ii].contents.substring(1,3);
if( QID < 10){
app.select(app.documents[0].pages[i].textFrames[ii]);
var Less = app.documents[0].pages[i].textFrames[ii].contents.substring(1,2);
app.selection[0].exportFile(ExportFormat.JPG, File(PromFolder+"/"+Extension+Less+".JPEG"), false);
}
else{
app.select(app.documents[0].pages[i].textFrames[ii]);
var More = app.documents[0].pages[i].textFrames[ii].contents.substring(1,3);
app.selection[0].exportFile(ExportFormat.JPG, File(PromFolder+"/"+Extension+More+".JPEG"), false)
}
}
}
// CEVAPSIZ //
else{
//alert(i+" "+ii+" ELSE");
for (ii=0; ii < app.documents[0].pages[i].textFrames.length; ii++){
var QID = app.documents[0].pages[i].textFrames[ii].contents.substring(1,3);
if( QID < 10){
app.select(app.documents[0].pages[i].textFrames[ii]);
var Less = app.documents[0].pages[i].textFrames[ii].contents.substring(1,2);
app.selection[0].exportFile(ExportFormat.JPG, File(JPEGFolder+"/"+Extension+Less+".JPEG"), false);
}
else{
app.select(app.documents[0].pages[i].textFrames[ii]);
var More = app.documents[0].pages[i].textFrames[ii].contents.substring(1,3);
app.selection[0].exportFile(ExportFormat.JPG, File(JPEGFolder+"/"+Extension+More+".JPEG"), false)
}
}
}
}
}
//alert ("Done")

This will loop through the pages and every textFrame on each page. The text frames from Master Pages will be ignored.
for (i=0; i< app.documents[0].pages.length; i++){
for (ii=0; ii< app.documents[0].pages[i].textFrames.length; ii++){
$.writeln(app.documents[0].pages[i].textFrames[ii].contents);
}
}

Why this.contains not a function when I call it inside another function

I am trying to make a Graph and implementing one method at a time. I don't know why I get after I call a.contains("cats") I get this error '//TypeError: Cannot read property 'length' of undefined'. After removing all the values. Perhaps it has to do with this.nodes.splice(i,1)?
var Graph = function(){
this.nodes = [];
this.edges = {};
};
Graph.prototype.addNode = function(node){
this.nodes.push(node);
this.edges[node] = {};
};
Graph.prototype.contains = function(node){
for(var i = 0; i < this.nodes[i].length; i++){
if(this.nodes[i] === node){
return true;
} else {
return false;
}
}
};
Graph.prototype.removeNode = function(node){
for(var key in this.edges){
if(key === node){
delete this.edges[node];
}
}
for(var i = 0; i < this.nodes.length; i++){
if(this.nodes[i] === node){
this.nodes.splice(i,1);
}
}
};
var a = new Graph();
a.addNode("cats");
a.addNode("dogs");
a.contains("cats");
a.removeNode("dogs");
a.contains("cats");
a.removeNode("cats");
a.contains("cats"); //TypeError: Cannot read property 'length' of undefined

You need to change
for (var i = 0; i < this.nodes[i].length; i++)
to
for (var i = 0; i < this.nodes.length; i++)

Conways Game of Life errors in Javascript

I'm currently coding conways game of life in JavaScript, but have encountered some errors which I do not know how to fix. Was wondering if anyone could help me out on them?
there are currently 4 errors showing on google chrome inspector which are as follows:
Uncaught TypeError: Cannot read property 'length' of undefined - "for(var i =0; i< this.checkneighbours.length; i++){ "
GoL.update # life.js:72 - which is -" for(var i =0; i < this.checkneighbours.length; i++){ "
GoL.updateAll # life.js:88 which is - " this.update(i,j); "
(anonymous function) # life.js:115 which is - "gameoflife.updateAll(); "
I think they might fall under the same category I'm not sure.
Here is my code:
//object constructor
function cell(){
this.alive = Math.random() >0.7;
this.neighbours = 0; //number of live neighbours
this.checkneighbours = [[-1,-1],[-1,0],[0,-1],[-1,1],[1,-1],[1,0],[0,1],[1,1]];
}
function GoL(size){
this.size = size;
this.grid = this.makeGrid(size);
};
GoL.prototype.makeGrid = function(size){
var grid = [];
for(var i=0; i<size; i++){
var row=[];
for(var j =0; j<size; j++){
row.push(new cell());
}
grid.push(row);
}
return grid;
};
GoL.prototype.drawGrid = function(){
console.log("\033[2J");
for(var i=0;i<this.size;i++){
var row =this.grid[i];
var rowCell="";
for(var j=0;j<this.size;j++){
var cell = row[j];
if(cell.alive){
rowCell += "X|";
}else{
rowCell += " |";
}
}
console.log(rowCell);
}
};
GoL.prototype.underpopulation = function(ro,col){
var cell = this.grid[ro][col];
if(cell.neighbours <2){
return true;
}else{
return false;
}
};
GoL.prototype.overpopulation = function(ro,col){
var cell = this.grid[ro][col];
if(cell.neighbours >3){
return true;
}else{
return false;
}
};
GoL.prototype.backtolife = function(ro,col){
var cell = this.grid[ro][col];
if(cell.neighbours ===3 && !cell.alive){
return true;
}else{
return false;
}
};
GoL.prototype.update = function(ro,col){
var cell = this.grid[ro][col];
cell.num_of_neighbours = 0;
for(var i =0; i<this.checkneighbours.length; i++){
var checkneighbour = this.checkneighbours[i];
var neighbour1 = direction[0];
var neighbour2 = direction[1];
if(neighbour1>=0 && neighbour1 < this.size && neighbour2 >=0 && neighbour2 < this.size){
var currentneighbour = this.grid[ro + neighbour1][col+neighbour2];
if(currentneighbour.alive){
cell.num_of_neighbours++;
}
}
}
};
GoL.prototype.updateAll = function(){
for(var i=0; i<this.size;i++){
for(var j=0; j<this.size;j++){
this.update(i,j);
}
}
}
GoL.prototype.cellstatus = function(ro,col){
var cell = this.grid[ro][col];
if(this.underpopulation(ro,col) || this.overpopulation(ro,col)){
cell.alive = false;
}else if(this.backtolife(ro,col)){
cell.alive = true;
}
};
GoL.prototype.allcellstatus = function(ro,col){
for(var i=0; i<this.size;i++){
for(var j=0; j<this.size;j++){
this.cellstatus(i,j);
}
}
};
var gameoflife = new GoL(40);
var interval = setInterval(function(){
gameoflife.drawGrid();
gameoflife.updateAll();
gameoflife.allcellstatus();
},1000);
Any help would be appreciated!

some thoughts
GoL.prototype.update = function (ro, col) {
var cell = this.grid[ro][col];
cell.num_of_neighbours = 0;
for (var i = 0; i < cell.checkneighbours.length; i++) { // change this to cell
var direction = cell.checkneighbours[i]; // change this to cell, rename 'checkneighbour' to 'direction'
var neighbour1 = direction[0];
var neighbour2 = direction[1];
if (neighbour1 >= 0 && neighbour1 < this.size && neighbour2 >= 0 && neighbour2 < this.size) {
var currentneighbour = this.grid[ro + neighbour1][col + neighbour2]; // add here some error checking for out of range!
if (currentneighbour.alive) {
cell.num_of_neighbours++;
}
}
}
};

Protractor:How to store values in array and then to do sorting

I need to sort list strings under the table ,so for that i have written following lines of code but on console i am not getting any values:
var j = 9;
var rows = element.all(by.repeater('row in renderedRows'));
var column = element.all(by.repeater('col in renderedColumns'));
expect(rows.count()).toEqual(5); //here its printing number of rows
expect(column.count()).toEqual(5); //here its printing number of columns
var arr = [rows.count()];
for (var i = 0; i < rows.count(); i++) {
console.log("aai" + i);
if (i = 0) {
//var columnvalue=column.get(9).getText();
var columnvalue = column.get(9).getText().then(function(ss) {
return ss.trim();
arr[i] = ss.trim(); //here it will save the value first value of column
console.log("value1" + arr[i]);
expect(arr[i]).toEqual('DN');
console.log("aa" + ss.trim());
});
} else {
var j = j + 8;
var columnvalue = column.get(j).getText().then(function(ss) {
return ss.trim();
arr[i] = ss.trim(); //here it will save the other values of column
console.log("value" + arr[i]);
expect(arr[i]).toEqual('DN');
console.log("ab" + ss.trim());
});
}
}

Sorting_Under_Table: function(col){
test = [];
var m;
var dm = 0;
element(by.xpath('//div[#class="ngHeaderScroller"]/div['+col+']')).click();
element.all(by.repeater('row in renderedRows')).then(function(row) {
m = row.length;
for (i = 1; i <= row.length; i++)
{
user_admin_table_name = browser.driver.findElement(by.xpath('//div[#class="ngCanvas"]/div['+i+']/div['+col+']'));
user_admin_table_name.getText().then(function(text) {
var test_var1 = text.toLowerCase().trim();
test.push(test_var1);
var k = test.length
if (k == m){
for (j = 0; j < test.length; j++){
test.sort();
d=j+1;
user_admin_table_name1 = browser.driver.findElement(by.xpath('//div[#class="ngCanvas"]/div['+d+']/div['+col+']'));
user_admin_table_name1.getText().then(function(text1) {
var test_var2 = text1.toLowerCase().trim();
if (test_var2 == test[dm]){
expect(test_var2).toEqual(test[dm]);
dm = dm +1;
}else {
expect(test_var2).toEqual(test[dm]);
log.error("Sorting is not successful");
dm = dm +1;
}
});
}
}
});
}
});
},
You can use this code for sorting and verifying is it sorted or not

I'm not sure how your above example is doing any sorting, but here's a general solution for trimming and then sorting:
var elementsWithTextToSort = element.all(by.xyz...);
elementsWithTextToSort.map(function(elem) {
return elem.getText().then(function(text) {
return text.trim();
});
}).then(function(trimmedTexts) {
return trimmedTexts.sort();
}).then(function(sortedTrimmedTexts) {
//do something with the sorted trimmed texts
});